aril 0.0.21 → 0.0.22

package/fesm2022/aril-theme-layout.mjs

@@ -365,73 +365,73 @@ class AppMenuItemComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppMenuItemComponent, deps: [{ token: LayoutService }, { token: i0.ChangeDetectorRef }, { token: i2.Router }, { token: AppMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppMenuItemComponent, isStandalone: true, selector: "[app-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey" }, host: { properties: { "class.layout-root-menuitem": "this.root", "class.active-menuitem": "this.activeClass" } }, viewQueries: [{ propertyName: "submenu", first: true, predicate: ["submenu"], descendants: true }], ngImport: i0, template: `
-		<ng-container>
-			@if (root) {
-				<div class="layout-menuitem-root-text">
-					{{ item.label }}
-				</div>
-			}
-			@if (item.items?.length) {
-				<a
-					[attr.href]="item.url"
-					(click)="itemClick($event)"
-					(mouseenter)="onMouseEnter()"
-					[attr.target]="item.target"
-					tabindex="0"
-					pRipple
-					[pTooltip]="item.label"
-					[tooltipDisabled]="!(isSlim && root && !active)">
-					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
-					<span class="layout-menuitem-text">{{ item.label }}</span>
-					@if (item.items) {
-						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
-					}
-				</a>
-			} @else {
-				<a
-					(click)="itemClick($event)"
-					(mouseenter)="onMouseEnter()"
-					[routerLink]="item.routerLink"
-					routerLinkActive="active-route"
-					[routerLinkActiveOptions]="
-						item.routerLinkActiveOptions || {
-							paths: 'exact',
-							queryParams: 'ignored',
-							matrixParams: 'ignored',
-							fragment: 'ignored'
-						}
-					"
-					[fragment]="item.fragment"
-					[queryParamsHandling]="item.queryParamsHandling"
-					[preserveFragment]="item.preserveFragment"
-					[skipLocationChange]="item.skipLocationChange"
-					[replaceUrl]="item.replaceUrl"
-					[state]="item.state"
-					[queryParams]="item.queryParams"
-					[attr.target]="item.target"
-					tabindex="0"
-					pRipple
-					[pTooltip]="item.label"
-					[tooltipDisabled]="!(isSlim && root)">
-					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
-
-					<span class="layout-menuitem-text">{{ item.label }}</span>
-
-					@if (item.items) {
-						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
-					}
-				</a>
-			}
-
-			@if (item.items) {
-				<ul #submenu [@children]="submenuAnimation" (@children.done)="onSubmenuAnimated($event)">
-					@for (child of item.items; track child; let i = $index) {
-						<li app-menuitem [item]="child" [index]="i" [parentKey]="key"></li>
-					}
-				</ul>
-			}
-		</ng-container>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppMenuItemComponent, isStandalone: true, selector: "[app-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey" }, host: { properties: { "class.layout-root-menuitem": "this.root", "class.active-menuitem": "this.activeClass" } }, viewQueries: [{ propertyName: "submenu", first: true, predicate: ["submenu"], descendants: true }], ngImport: i0, template: `
+		<ng-container>
+			@if (root) {
+				<div class="layout-menuitem-root-text">
+					{{ item.label }}
+				</div>
+			}
+			@if (item.items?.length) {
+				<a
+					[attr.href]="item.url"
+					(click)="itemClick($event)"
+					(mouseenter)="onMouseEnter()"
+					[attr.target]="item.target"
+					tabindex="0"
+					pRipple
+					[pTooltip]="item.label"
+					[tooltipDisabled]="!(isSlim && root && !active)">
+					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
+					<span class="layout-menuitem-text">{{ item.label }}</span>
+					@if (item.items) {
+						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
+					}
+				</a>
+			} @else {
+				<a
+					(click)="itemClick($event)"
+					(mouseenter)="onMouseEnter()"
+					[routerLink]="item.routerLink"
+					routerLinkActive="active-route"
+					[routerLinkActiveOptions]="
+						item.routerLinkActiveOptions || {
+							paths: 'exact',
+							queryParams: 'ignored',
+							matrixParams: 'ignored',
+							fragment: 'ignored'
+						}
+					"
+					[fragment]="item.fragment"
+					[queryParamsHandling]="item.queryParamsHandling"
+					[preserveFragment]="item.preserveFragment"
+					[skipLocationChange]="item.skipLocationChange"
+					[replaceUrl]="item.replaceUrl"
+					[state]="item.state"
+					[queryParams]="item.queryParams"
+					[attr.target]="item.target"
+					tabindex="0"
+					pRipple
+					[pTooltip]="item.label"
+					[tooltipDisabled]="!(isSlim && root)">
+					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
+
+					<span class="layout-menuitem-text">{{ item.label }}</span>
+
+					@if (item.items) {
+						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
+					}
+				</a>
+			}
+
+			@if (item.items) {
+				<ul #submenu [@children]="submenuAnimation" (@children.done)="onSubmenuAnimated($event)">
+					@for (child of item.items; track child; let i = $index) {
+						<li app-menuitem [item]="child" [index]="i" [parentKey]="key"></li>
+					}
+				</ul>
+			}
+		</ng-container>
 	`, isInline: true, dependencies: [{ kind: "component", type: AppMenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i5.Ripple, selector: "[pRipple]" }], animations: [
             trigger('children', [
                 state('collapsed', style({
@@ -455,73 +455,73 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImpor
             args: [{
                     standalone: true,
                     selector: '[app-menuitem]',
-                    template: `
-		<ng-container>
-			@if (root) {
-				<div class="layout-menuitem-root-text">
-					{{ item.label }}
-				</div>
-			}
-			@if (item.items?.length) {
-				<a
-					[attr.href]="item.url"
-					(click)="itemClick($event)"
-					(mouseenter)="onMouseEnter()"
-					[attr.target]="item.target"
-					tabindex="0"
-					pRipple
-					[pTooltip]="item.label"
-					[tooltipDisabled]="!(isSlim && root && !active)">
-					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
-					<span class="layout-menuitem-text">{{ item.label }}</span>
-					@if (item.items) {
-						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
-					}
-				</a>
-			} @else {
-				<a
-					(click)="itemClick($event)"
-					(mouseenter)="onMouseEnter()"
-					[routerLink]="item.routerLink"
-					routerLinkActive="active-route"
-					[routerLinkActiveOptions]="
-						item.routerLinkActiveOptions || {
-							paths: 'exact',
-							queryParams: 'ignored',
-							matrixParams: 'ignored',
-							fragment: 'ignored'
-						}
-					"
-					[fragment]="item.fragment"
-					[queryParamsHandling]="item.queryParamsHandling"
-					[preserveFragment]="item.preserveFragment"
-					[skipLocationChange]="item.skipLocationChange"
-					[replaceUrl]="item.replaceUrl"
-					[state]="item.state"
-					[queryParams]="item.queryParams"
-					[attr.target]="item.target"
-					tabindex="0"
-					pRipple
-					[pTooltip]="item.label"
-					[tooltipDisabled]="!(isSlim && root)">
-					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
-
-					<span class="layout-menuitem-text">{{ item.label }}</span>
-
-					@if (item.items) {
-						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
-					}
-				</a>
-			}
-
-			@if (item.items) {
-				<ul #submenu [@children]="submenuAnimation" (@children.done)="onSubmenuAnimated($event)">
-					@for (child of item.items; track child; let i = $index) {
-						<li app-menuitem [item]="child" [index]="i" [parentKey]="key"></li>
-					}
-				</ul>
-			}
-		</ng-container>
+                    template: `
+		<ng-container>
+			@if (root) {
+				<div class="layout-menuitem-root-text">
+					{{ item.label }}
+				</div>
+			}
+			@if (item.items?.length) {
+				<a
+					[attr.href]="item.url"
+					(click)="itemClick($event)"
+					(mouseenter)="onMouseEnter()"
+					[attr.target]="item.target"
+					tabindex="0"
+					pRipple
+					[pTooltip]="item.label"
+					[tooltipDisabled]="!(isSlim && root && !active)">
+					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
+					<span class="layout-menuitem-text">{{ item.label }}</span>
+					@if (item.items) {
+						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
+					}
+				</a>
+			} @else {
+				<a
+					(click)="itemClick($event)"
+					(mouseenter)="onMouseEnter()"
+					[routerLink]="item.routerLink"
+					routerLinkActive="active-route"
+					[routerLinkActiveOptions]="
+						item.routerLinkActiveOptions || {
+							paths: 'exact',
+							queryParams: 'ignored',
+							matrixParams: 'ignored',
+							fragment: 'ignored'
+						}
+					"
+					[fragment]="item.fragment"
+					[queryParamsHandling]="item.queryParamsHandling"
+					[preserveFragment]="item.preserveFragment"
+					[skipLocationChange]="item.skipLocationChange"
+					[replaceUrl]="item.replaceUrl"
+					[state]="item.state"
+					[queryParams]="item.queryParams"
+					[attr.target]="item.target"
+					tabindex="0"
+					pRipple
+					[pTooltip]="item.label"
+					[tooltipDisabled]="!(isSlim && root)">
+					<i [ngClass]="item.icon" class="layout-menuitem-icon"></i>
+
+					<span class="layout-menuitem-text">{{ item.label }}</span>
+
+					@if (item.items) {
+						<i class="pi pi-fw pi-angle-down layout-submenu-toggler"></i>
+					}
+				</a>
+			}
+
+			@if (item.items) {
+				<ul #submenu [@children]="submenuAnimation" (@children.done)="onSubmenuAnimated($event)">
+					@for (child of item.items; track child; let i = $index) {
+						<li app-menuitem [item]="child" [index]="i" [parentKey]="key"></li>
+					}
+				</ul>
+			}
+		</ng-container>
 	`,
                     imports: [NgClass, RouterLink, RouterLinkActive, TooltipModule, RippleModule],
                     animations: [
@@ -565,11 +565,11 @@ class AppMenuComponent {
         this.menuService = inject(AppMenuService);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppMenuComponent, isStandalone: true, selector: "app-menu", ngImport: i0, template: "<ul class=\"layout-menu flex-wrap\">\r\n\t@for (item of menuService.menuItems(); track $index) {\r\n\t\t@if (item.separator) {\r\n\t\t\t<li class=\"menu-separator\"></li>\r\n\t\t} @else {\r\n\t\t\t<li app-menuitem [item]=\"item\" [index]=\"$index\" [root]=\"true\"></li>\r\n\t\t}\r\n\t}\r\n</ul>\r\n", dependencies: [{ kind: "component", type: AppMenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppMenuComponent, isStandalone: true, selector: "app-menu", ngImport: i0, template: "<ul class=\"layout-menu flex-wrap\">\n\t@for (item of menuService.menuItems(); track $index) {\n\t\t@if (item.separator) {\n\t\t\t<li class=\"menu-separator\"></li>\n\t\t} @else {\n\t\t\t<li app-menuitem [item]=\"item\" [index]=\"$index\" [root]=\"true\"></li>\n\t\t}\n\t}\n</ul>\n", dependencies: [{ kind: "component", type: AppMenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppMenuComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'app-menu', imports: [AppMenuItemComponent], template: "<ul class=\"layout-menu flex-wrap\">\r\n\t@for (item of menuService.menuItems(); track $index) {\r\n\t\t@if (item.separator) {\r\n\t\t\t<li class=\"menu-separator\"></li>\r\n\t\t} @else {\r\n\t\t\t<li app-menuitem [item]=\"item\" [index]=\"$index\" [root]=\"true\"></li>\r\n\t\t}\r\n\t}\r\n</ul>\r\n" }]
+            args: [{ standalone: true, selector: 'app-menu', imports: [AppMenuItemComponent], template: "<ul class=\"layout-menu flex-wrap\">\n\t@for (item of menuService.menuItems(); track $index) {\n\t\t@if (item.separator) {\n\t\t\t<li class=\"menu-separator\"></li>\n\t\t} @else {\n\t\t\t<li app-menuitem [item]=\"item\" [index]=\"$index\" [root]=\"true\"></li>\n\t\t}\n\t}\n</ul>\n" }]
         }] });
 class AppSubMenuComponent {
     constructor() {
@@ -615,11 +615,11 @@ class AppSidebarComponent {
         this.layoutService.state.anchored = !this.layoutService.state.anchored;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppSidebarComponent, deps: [{ token: LayoutService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppSidebarComponent, isStandalone: true, selector: "app-sidebar", viewQueries: [{ propertyName: "menuContainer", first: true, predicate: ["menuContainer"], descendants: true }], ngImport: i0, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\r\n\t<div class=\"sidebar-header\">\r\n\t\t<a [routerLink]=\"['/']\" class=\"app-logo\">\r\n\t\t\t<svg viewBox=\"0 0 124 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"app-logo-normal\">\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M13.84 15.7927L16.2077 21.0016H11.7682L13.84 15.7927Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M9.04645 21.0016L6.67875 15.7927L4.60701 21.0016H9.04645Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M40.9033 14.5217H34.771L33.1753 18.0007H30.8467L37.9346 2.77661L44.772 18.0007H42.4062L40.9033 14.5217ZM40.022 12.49L37.8975 7.61938L35.6709 12.49H40.022Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M52.4927 12.1838V18.0007H50.3311V3.67651H52.7803C53.9802 3.67651 54.8862 3.76001 55.4985 3.927C56.117 4.09399 56.6613 4.40942 57.1314 4.87329C57.954 5.67733 58.3652 6.69165 58.3652 7.91626C58.3652 9.22746 57.9261 10.2665 57.0479 11.0334C56.1696 11.8004 54.9852 12.1838 53.4946 12.1838H52.4927ZM52.4927 10.1799H53.2998C55.2852 10.1799 56.2778 9.4161 56.2778 7.88843C56.2778 6.41024 55.2542 5.67114 53.207 5.67114H52.4927V10.1799Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M63.6367 10.7737C63.6367 8.75741 64.3758 7.02563 65.854 5.57837C67.326 4.1311 69.0949 3.40747 71.1607 3.40747C73.2017 3.40747 74.952 4.13729 76.4116 5.59692C77.8775 7.05656 78.6104 8.80998 78.6104 10.8572C78.6104 12.9167 77.8744 14.664 76.4024 16.0989C74.9242 17.54 73.1398 18.2605 71.0493 18.2605C69.2001 18.2605 67.5394 17.6204 66.0674 16.3401C64.447 14.9237 63.6367 13.0683 63.6367 10.7737ZM65.8169 10.8015C65.8169 12.3848 66.3488 13.6868 67.4126 14.7073C68.4702 15.7278 69.6918 16.238 71.0772 16.238C72.5801 16.238 73.848 15.7185 74.8809 14.6794C75.9138 13.628 76.4302 12.3477 76.4302 10.8386C76.4302 9.31095 75.9199 8.03068 74.8994 6.9978C73.8851 5.95874 72.6296 5.43921 71.1328 5.43921C69.6423 5.43921 68.3836 5.95874 67.357 6.9978C66.3303 8.0245 65.8169 9.2924 65.8169 10.8015Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M87.2495 3.67651V15.969H91.4615V18.0007H85.0879V3.67651H87.2495Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M99.4327 3.67651V15.969H103.645V18.0007H97.271V3.67651H99.4327Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M108.146 10.7737C108.146 8.75741 108.885 7.02563 110.363 5.57837C111.835 4.1311 113.604 3.40747 115.67 3.40747C117.711 3.40747 119.461 4.13729 120.921 5.59692C122.387 7.05656 123.12 8.80998 123.12 10.8572C123.12 12.9167 122.384 14.664 120.912 16.0989C119.433 17.54 117.649 18.2605 115.559 18.2605C113.709 18.2605 112.049 17.6204 110.577 16.3401C108.956 14.9237 108.146 13.0683 108.146 10.7737ZM110.326 10.8015C110.326 12.3848 110.858 13.6868 111.922 14.7073C112.98 15.7278 114.201 16.238 115.586 16.238C117.089 16.238 118.357 15.7185 119.39 14.6794C120.423 13.628 120.94 12.3477 120.94 10.8386C120.94 9.31095 120.429 8.03068 119.409 6.9978C118.394 5.95874 117.139 5.43921 115.642 5.43921C114.152 5.43921 112.893 5.95874 111.866 6.9978C110.84 8.0245 110.326 9.2924 110.326 10.8015Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t</svg>\r\n\t\t\t<svg\r\n\t\t\t\twidth=\"21\"\r\n\t\t\t\theight=\"22\"\r\n\t\t\t\tviewBox=\"0 0 21 22\"\r\n\t\t\t\tfill=\"none\"\r\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\r\n\t\t\t\tclass=\"app-logo-small\">\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M13.8399 15.793L16.2076 21.0019H11.7681L13.8399 15.793Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M9.04637 21.0019L6.67867 15.793L4.60693 21.0019H9.04637Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t</svg>\r\n\t\t</a>\r\n\t\t<button class=\"layout-sidebar-anchor p-link z-2 mb-2\" type=\"button\" (click)=\"anchor()\"></button>\r\n\t</div>\r\n\r\n\t<div #menuContainer class=\"layout-menu-container\">\r\n\t\t<app-menu></app-menu>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: AppMenuComponent, selector: "app-menu" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppSidebarComponent, isStandalone: true, selector: "app-sidebar", viewQueries: [{ propertyName: "menuContainer", first: true, predicate: ["menuContainer"], descendants: true }], ngImport: i0, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n\t<div class=\"sidebar-header\">\n\t\t<a [routerLink]=\"['/']\" class=\"app-logo\">\n\t\t\t<svg viewBox=\"0 0 124 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"app-logo-normal\">\n\t\t\t\t<path\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M13.84 15.7927L16.2077 21.0016H11.7682L13.84 15.7927Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M9.04645 21.0016L6.67875 15.7927L4.60701 21.0016H9.04645Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M40.9033 14.5217H34.771L33.1753 18.0007H30.8467L37.9346 2.77661L44.772 18.0007H42.4062L40.9033 14.5217ZM40.022 12.49L37.8975 7.61938L35.6709 12.49H40.022Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M52.4927 12.1838V18.0007H50.3311V3.67651H52.7803C53.9802 3.67651 54.8862 3.76001 55.4985 3.927C56.117 4.09399 56.6613 4.40942 57.1314 4.87329C57.954 5.67733 58.3652 6.69165 58.3652 7.91626C58.3652 9.22746 57.9261 10.2665 57.0479 11.0334C56.1696 11.8004 54.9852 12.1838 53.4946 12.1838H52.4927ZM52.4927 10.1799H53.2998C55.2852 10.1799 56.2778 9.4161 56.2778 7.88843C56.2778 6.41024 55.2542 5.67114 53.207 5.67114H52.4927V10.1799Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M63.6367 10.7737C63.6367 8.75741 64.3758 7.02563 65.854 5.57837C67.326 4.1311 69.0949 3.40747 71.1607 3.40747C73.2017 3.40747 74.952 4.13729 76.4116 5.59692C77.8775 7.05656 78.6104 8.80998 78.6104 10.8572C78.6104 12.9167 77.8744 14.664 76.4024 16.0989C74.9242 17.54 73.1398 18.2605 71.0493 18.2605C69.2001 18.2605 67.5394 17.6204 66.0674 16.3401C64.447 14.9237 63.6367 13.0683 63.6367 10.7737ZM65.8169 10.8015C65.8169 12.3848 66.3488 13.6868 67.4126 14.7073C68.4702 15.7278 69.6918 16.238 71.0772 16.238C72.5801 16.238 73.848 15.7185 74.8809 14.6794C75.9138 13.628 76.4302 12.3477 76.4302 10.8386C76.4302 9.31095 75.9199 8.03068 74.8994 6.9978C73.8851 5.95874 72.6296 5.43921 71.1328 5.43921C69.6423 5.43921 68.3836 5.95874 67.357 6.9978C66.3303 8.0245 65.8169 9.2924 65.8169 10.8015Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M87.2495 3.67651V15.969H91.4615V18.0007H85.0879V3.67651H87.2495Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M99.4327 3.67651V15.969H103.645V18.0007H97.271V3.67651H99.4327Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M108.146 10.7737C108.146 8.75741 108.885 7.02563 110.363 5.57837C111.835 4.1311 113.604 3.40747 115.67 3.40747C117.711 3.40747 119.461 4.13729 120.921 5.59692C122.387 7.05656 123.12 8.80998 123.12 10.8572C123.12 12.9167 122.384 14.664 120.912 16.0989C119.433 17.54 117.649 18.2605 115.559 18.2605C113.709 18.2605 112.049 17.6204 110.577 16.3401C108.956 14.9237 108.146 13.0683 108.146 10.7737ZM110.326 10.8015C110.326 12.3848 110.858 13.6868 111.922 14.7073C112.98 15.7278 114.201 16.238 115.586 16.238C117.089 16.238 118.357 15.7185 119.39 14.6794C120.423 13.628 120.94 12.3477 120.94 10.8386C120.94 9.31095 120.429 8.03068 119.409 6.9978C118.394 5.95874 117.139 5.43921 115.642 5.43921C114.152 5.43921 112.893 5.95874 111.866 6.9978C110.84 8.0245 110.326 9.2924 110.326 10.8015Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t</svg>\n\t\t\t<svg\n\t\t\t\twidth=\"21\"\n\t\t\t\theight=\"22\"\n\t\t\t\tviewBox=\"0 0 21 22\"\n\t\t\t\tfill=\"none\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tclass=\"app-logo-small\">\n\t\t\t\t<path\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M13.8399 15.793L16.2076 21.0019H11.7681L13.8399 15.793Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M9.04637 21.0019L6.67867 15.793L4.60693 21.0019H9.04637Z\" fill=\"var(--logo-color)\" />\n\t\t\t</svg>\n\t\t</a>\n\t\t<button class=\"layout-sidebar-anchor p-link z-2 mb-2\" type=\"button\" (click)=\"anchor()\"></button>\n\t</div>\n\n\t<div #menuContainer class=\"layout-menu-container\">\n\t\t<app-menu></app-menu>\n\t</div>\n</div>\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: AppMenuComponent, selector: "app-menu" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppSidebarComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'app-sidebar', imports: [RouterLink, AppMenuComponent], template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\r\n\t<div class=\"sidebar-header\">\r\n\t\t<a [routerLink]=\"['/']\" class=\"app-logo\">\r\n\t\t\t<svg viewBox=\"0 0 124 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"app-logo-normal\">\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M13.84 15.7927L16.2077 21.0016H11.7682L13.84 15.7927Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M9.04645 21.0016L6.67875 15.7927L4.60701 21.0016H9.04645Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M40.9033 14.5217H34.771L33.1753 18.0007H30.8467L37.9346 2.77661L44.772 18.0007H42.4062L40.9033 14.5217ZM40.022 12.49L37.8975 7.61938L35.6709 12.49H40.022Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M52.4927 12.1838V18.0007H50.3311V3.67651H52.7803C53.9802 3.67651 54.8862 3.76001 55.4985 3.927C56.117 4.09399 56.6613 4.40942 57.1314 4.87329C57.954 5.67733 58.3652 6.69165 58.3652 7.91626C58.3652 9.22746 57.9261 10.2665 57.0479 11.0334C56.1696 11.8004 54.9852 12.1838 53.4946 12.1838H52.4927ZM52.4927 10.1799H53.2998C55.2852 10.1799 56.2778 9.4161 56.2778 7.88843C56.2778 6.41024 55.2542 5.67114 53.207 5.67114H52.4927V10.1799Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M63.6367 10.7737C63.6367 8.75741 64.3758 7.02563 65.854 5.57837C67.326 4.1311 69.0949 3.40747 71.1607 3.40747C73.2017 3.40747 74.952 4.13729 76.4116 5.59692C77.8775 7.05656 78.6104 8.80998 78.6104 10.8572C78.6104 12.9167 77.8744 14.664 76.4024 16.0989C74.9242 17.54 73.1398 18.2605 71.0493 18.2605C69.2001 18.2605 67.5394 17.6204 66.0674 16.3401C64.447 14.9237 63.6367 13.0683 63.6367 10.7737ZM65.8169 10.8015C65.8169 12.3848 66.3488 13.6868 67.4126 14.7073C68.4702 15.7278 69.6918 16.238 71.0772 16.238C72.5801 16.238 73.848 15.7185 74.8809 14.6794C75.9138 13.628 76.4302 12.3477 76.4302 10.8386C76.4302 9.31095 75.9199 8.03068 74.8994 6.9978C73.8851 5.95874 72.6296 5.43921 71.1328 5.43921C69.6423 5.43921 68.3836 5.95874 67.357 6.9978C66.3303 8.0245 65.8169 9.2924 65.8169 10.8015Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M87.2495 3.67651V15.969H91.4615V18.0007H85.0879V3.67651H87.2495Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M99.4327 3.67651V15.969H103.645V18.0007H97.271V3.67651H99.4327Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M108.146 10.7737C108.146 8.75741 108.885 7.02563 110.363 5.57837C111.835 4.1311 113.604 3.40747 115.67 3.40747C117.711 3.40747 119.461 4.13729 120.921 5.59692C122.387 7.05656 123.12 8.80998 123.12 10.8572C123.12 12.9167 122.384 14.664 120.912 16.0989C119.433 17.54 117.649 18.2605 115.559 18.2605C113.709 18.2605 112.049 17.6204 110.577 16.3401C108.956 14.9237 108.146 13.0683 108.146 10.7737ZM110.326 10.8015C110.326 12.3848 110.858 13.6868 111.922 14.7073C112.98 15.7278 114.201 16.238 115.586 16.238C117.089 16.238 118.357 15.7185 119.39 14.6794C120.423 13.628 120.94 12.3477 120.94 10.8386C120.94 9.31095 120.429 8.03068 119.409 6.9978C118.394 5.95874 117.139 5.43921 115.642 5.43921C114.152 5.43921 112.893 5.95874 111.866 6.9978C110.84 8.0245 110.326 9.2924 110.326 10.8015Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t</svg>\r\n\t\t\t<svg\r\n\t\t\t\twidth=\"21\"\r\n\t\t\t\theight=\"22\"\r\n\t\t\t\tviewBox=\"0 0 21 22\"\r\n\t\t\t\tfill=\"none\"\r\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\r\n\t\t\t\tclass=\"app-logo-small\">\r\n\t\t\t\t<path\r\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\r\n\t\t\t\t\tfill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M13.8399 15.793L16.2076 21.0019H11.7681L13.8399 15.793Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t\t<path d=\"M9.04637 21.0019L6.67867 15.793L4.60693 21.0019H9.04637Z\" fill=\"var(--logo-color)\" />\r\n\t\t\t</svg>\r\n\t\t</a>\r\n\t\t<button class=\"layout-sidebar-anchor p-link z-2 mb-2\" type=\"button\" (click)=\"anchor()\"></button>\r\n\t</div>\r\n\r\n\t<div #menuContainer class=\"layout-menu-container\">\r\n\t\t<app-menu></app-menu>\r\n\t</div>\r\n</div>\r\n" }]
+            args: [{ standalone: true, selector: 'app-sidebar', imports: [RouterLink, AppMenuComponent], template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n\t<div class=\"sidebar-header\">\n\t\t<a [routerLink]=\"['/']\" class=\"app-logo\">\n\t\t\t<svg viewBox=\"0 0 124 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"app-logo-normal\">\n\t\t\t\t<path\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M13.84 15.7927L16.2077 21.0016H11.7682L13.84 15.7927Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M9.04645 21.0016L6.67875 15.7927L4.60701 21.0016H9.04645Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M40.9033 14.5217H34.771L33.1753 18.0007H30.8467L37.9346 2.77661L44.772 18.0007H42.4062L40.9033 14.5217ZM40.022 12.49L37.8975 7.61938L35.6709 12.49H40.022Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M52.4927 12.1838V18.0007H50.3311V3.67651H52.7803C53.9802 3.67651 54.8862 3.76001 55.4985 3.927C56.117 4.09399 56.6613 4.40942 57.1314 4.87329C57.954 5.67733 58.3652 6.69165 58.3652 7.91626C58.3652 9.22746 57.9261 10.2665 57.0479 11.0334C56.1696 11.8004 54.9852 12.1838 53.4946 12.1838H52.4927ZM52.4927 10.1799H53.2998C55.2852 10.1799 56.2778 9.4161 56.2778 7.88843C56.2778 6.41024 55.2542 5.67114 53.207 5.67114H52.4927V10.1799Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M63.6367 10.7737C63.6367 8.75741 64.3758 7.02563 65.854 5.57837C67.326 4.1311 69.0949 3.40747 71.1607 3.40747C73.2017 3.40747 74.952 4.13729 76.4116 5.59692C77.8775 7.05656 78.6104 8.80998 78.6104 10.8572C78.6104 12.9167 77.8744 14.664 76.4024 16.0989C74.9242 17.54 73.1398 18.2605 71.0493 18.2605C69.2001 18.2605 67.5394 17.6204 66.0674 16.3401C64.447 14.9237 63.6367 13.0683 63.6367 10.7737ZM65.8169 10.8015C65.8169 12.3848 66.3488 13.6868 67.4126 14.7073C68.4702 15.7278 69.6918 16.238 71.0772 16.238C72.5801 16.238 73.848 15.7185 74.8809 14.6794C75.9138 13.628 76.4302 12.3477 76.4302 10.8386C76.4302 9.31095 75.9199 8.03068 74.8994 6.9978C73.8851 5.95874 72.6296 5.43921 71.1328 5.43921C69.6423 5.43921 68.3836 5.95874 67.357 6.9978C66.3303 8.0245 65.8169 9.2924 65.8169 10.8015Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M87.2495 3.67651V15.969H91.4615V18.0007H85.0879V3.67651H87.2495Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M99.4327 3.67651V15.969H103.645V18.0007H97.271V3.67651H99.4327Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path\n\t\t\t\t\td=\"M108.146 10.7737C108.146 8.75741 108.885 7.02563 110.363 5.57837C111.835 4.1311 113.604 3.40747 115.67 3.40747C117.711 3.40747 119.461 4.13729 120.921 5.59692C122.387 7.05656 123.12 8.80998 123.12 10.8572C123.12 12.9167 122.384 14.664 120.912 16.0989C119.433 17.54 117.649 18.2605 115.559 18.2605C113.709 18.2605 112.049 17.6204 110.577 16.3401C108.956 14.9237 108.146 13.0683 108.146 10.7737ZM110.326 10.8015C110.326 12.3848 110.858 13.6868 111.922 14.7073C112.98 15.7278 114.201 16.238 115.586 16.238C117.089 16.238 118.357 15.7185 119.39 14.6794C120.423 13.628 120.94 12.3477 120.94 10.8386C120.94 9.31095 120.429 8.03068 119.409 6.9978C118.394 5.95874 117.139 5.43921 115.642 5.43921C114.152 5.43921 112.893 5.95874 111.866 6.9978C110.84 8.0245 110.326 9.2924 110.326 10.8015Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t</svg>\n\t\t\t<svg\n\t\t\t\twidth=\"21\"\n\t\t\t\theight=\"22\"\n\t\t\t\tviewBox=\"0 0 21 22\"\n\t\t\t\tfill=\"none\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tclass=\"app-logo-small\">\n\t\t\t\t<path\n\t\t\t\t\td=\"M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z\"\n\t\t\t\t\tfill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M13.8399 15.793L16.2076 21.0019H11.7681L13.8399 15.793Z\" fill=\"var(--logo-color)\" />\n\t\t\t\t<path d=\"M9.04637 21.0019L6.67867 15.793L4.60693 21.0019H9.04637Z\" fill=\"var(--logo-color)\" />\n\t\t\t</svg>\n\t\t</a>\n\t\t<button class=\"layout-sidebar-anchor p-link z-2 mb-2\" type=\"button\" (click)=\"anchor()\"></button>\n\t</div>\n\n\t<div #menuContainer class=\"layout-menu-container\">\n\t\t<app-menu></app-menu>\n\t</div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: LayoutService }, { type: i0.ElementRef }], propDecorators: { menuContainer: [{
                 type: ViewChild,
                 args: ['menuContainer']
@@ -652,11 +652,11 @@ class AppBreadcrumbComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppBreadcrumbComponent, deps: [{ token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppBreadcrumbComponent, isStandalone: true, selector: "app-breadcrumb", ngImport: i0, template: "<nav class=\"layout-breadcrumb\">\r\n\t<ol>\r\n\t\t@for (item of breadcrumbs$ | async; track item; let last = $last) {\r\n\t\t\t<li>{{ item.label }}</li>\r\n\t\t\t@if (!last) {\r\n\t\t\t\t<li class=\"layout-breadcrumb-chevron\">/</li>\r\n\t\t\t}\r\n\t\t}\r\n\t</ol>\r\n</nav>\r\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppBreadcrumbComponent, isStandalone: true, selector: "app-breadcrumb", ngImport: i0, template: "<nav class=\"layout-breadcrumb\">\n\t<ol>\n\t\t@for (item of breadcrumbs$ | async; track item; let last = $last) {\n\t\t\t<li>{{ item.label }}</li>\n\t\t\t@if (!last) {\n\t\t\t\t<li class=\"layout-breadcrumb-chevron\">/</li>\n\t\t\t}\n\t\t}\n\t</ol>\n</nav>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppBreadcrumbComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'app-breadcrumb', imports: [NgTemplateOutlet, AsyncPipe], template: "<nav class=\"layout-breadcrumb\">\r\n\t<ol>\r\n\t\t@for (item of breadcrumbs$ | async; track item; let last = $last) {\r\n\t\t\t<li>{{ item.label }}</li>\r\n\t\t\t@if (!last) {\r\n\t\t\t\t<li class=\"layout-breadcrumb-chevron\">/</li>\r\n\t\t\t}\r\n\t\t}\r\n\t</ol>\r\n</nav>\r\n" }]
+            args: [{ standalone: true, selector: 'app-breadcrumb', imports: [NgTemplateOutlet, AsyncPipe], template: "<nav class=\"layout-breadcrumb\">\n\t<ol>\n\t\t@for (item of breadcrumbs$ | async; track item; let last = $last) {\n\t\t\t<li>{{ item.label }}</li>\n\t\t\t@if (!last) {\n\t\t\t\t<li class=\"layout-breadcrumb-chevron\">/</li>\n\t\t\t}\n\t\t}\n\t</ol>\n</nav>\n" }]
         }], ctorParameters: () => [{ type: i2.Router }] });
 
 class AppTopbarComponent {
@@ -673,11 +673,11 @@ class AppTopbarComponent {
         this.layoutService.showConfigSidebar();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppTopbarComponent, deps: [{ token: LayoutService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppTopbarComponent, isStandalone: true, selector: "app-topbar", viewQueries: [{ propertyName: "menuButton", first: true, predicate: ["menubutton"], descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\r\n\t<div class=\"topbar-start\">\r\n\t\t<button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\r\n\t\t\t<i class=\"pi pi-bars\"></i>\r\n\t\t</button>\r\n\r\n\t\t<!-- <app-breadcrumb class=\"topbar-breadcrumb\"></app-breadcrumb> -->\r\n\t</div>\r\n\r\n\t<div class=\"topbar-end\">\r\n\t\t<ul class=\"topbar-menu\">\r\n\t\t\t<li class=\"topbar-search\">\r\n\t\t\t\t<span class=\"p-input-icon-left\">\r\n\t\t\t\t\t<i class=\"pi pi-search\"></i>\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\ttype=\"text\"\r\n\t\t\t\t\t\tpInputText\r\n\t\t\t\t\t\tplaceholder=\"Search\"\r\n\t\t\t\t\t\tclass=\"p-inputtext p-component p-element w-12rem sm:w-full\" />\r\n\t\t\t\t</span>\r\n\t\t\t</li>\r\n\t\t\t<!-- <li class=\"ml-3\">\r\n\t\t\t\t<button\r\n\t\t\t\t\tpButton\r\n\t\t\t\t\ttype=\"button\"\r\n\t\t\t\t\ticon=\"pi pi-cog\"\r\n\t\t\t\t\tclass=\"p-button-text p-button-secondary p-button-rounded flex-shrink-0\"\r\n\t\t\t\t\t(click)=\"onConfigButtonClick()\"></button>\r\n\t\t\t</li> -->\r\n\t\t\t<li class=\"topbar-profile\">\r\n\t\t\t\t<button type=\"button\" class=\"p-link\" (click)=\"onProfileButtonClick()\">\r\n\t\t\t\t\t<img src=\"assets/images/avatar.png\" alt=\"Profile\" />\r\n\t\t\t\t</button>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppTopbarComponent, isStandalone: true, selector: "app-topbar", viewQueries: [{ propertyName: "menuButton", first: true, predicate: ["menubutton"], descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n\t<div class=\"topbar-start\">\n\t\t<button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n\t\t\t<i class=\"pi pi-bars\"></i>\n\t\t</button>\n\n\t\t<!-- <app-breadcrumb class=\"topbar-breadcrumb\"></app-breadcrumb> -->\n\t</div>\n\n\t<div class=\"topbar-end\">\n\t\t<ul class=\"topbar-menu\">\n\t\t\t<li class=\"topbar-search\">\n\t\t\t\t<span class=\"p-input-icon-left\">\n\t\t\t\t\t<i class=\"pi pi-search\"></i>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tpInputText\n\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\tclass=\"p-inputtext p-component p-element w-12rem sm:w-full\" />\n\t\t\t\t</span>\n\t\t\t</li>\n\t\t\t<!-- <li class=\"ml-3\">\n\t\t\t\t<button\n\t\t\t\t\tpButton\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\ticon=\"pi pi-cog\"\n\t\t\t\t\tclass=\"p-button-text p-button-secondary p-button-rounded flex-shrink-0\"\n\t\t\t\t\t(click)=\"onConfigButtonClick()\"></button>\n\t\t\t</li> -->\n\t\t\t<li class=\"topbar-profile\">\n\t\t\t\t<button type=\"button\" class=\"p-link\" (click)=\"onProfileButtonClick()\">\n\t\t\t\t\t<img src=\"assets/images/avatar.png\" alt=\"Profile\" />\n\t\t\t\t</button>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppTopbarComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'app-topbar', imports: [ButtonModule, AppBreadcrumbComponent], template: "<div class=\"layout-topbar\">\r\n\t<div class=\"topbar-start\">\r\n\t\t<button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\r\n\t\t\t<i class=\"pi pi-bars\"></i>\r\n\t\t</button>\r\n\r\n\t\t<!-- <app-breadcrumb class=\"topbar-breadcrumb\"></app-breadcrumb> -->\r\n\t</div>\r\n\r\n\t<div class=\"topbar-end\">\r\n\t\t<ul class=\"topbar-menu\">\r\n\t\t\t<li class=\"topbar-search\">\r\n\t\t\t\t<span class=\"p-input-icon-left\">\r\n\t\t\t\t\t<i class=\"pi pi-search\"></i>\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\ttype=\"text\"\r\n\t\t\t\t\t\tpInputText\r\n\t\t\t\t\t\tplaceholder=\"Search\"\r\n\t\t\t\t\t\tclass=\"p-inputtext p-component p-element w-12rem sm:w-full\" />\r\n\t\t\t\t</span>\r\n\t\t\t</li>\r\n\t\t\t<!-- <li class=\"ml-3\">\r\n\t\t\t\t<button\r\n\t\t\t\t\tpButton\r\n\t\t\t\t\ttype=\"button\"\r\n\t\t\t\t\ticon=\"pi pi-cog\"\r\n\t\t\t\t\tclass=\"p-button-text p-button-secondary p-button-rounded flex-shrink-0\"\r\n\t\t\t\t\t(click)=\"onConfigButtonClick()\"></button>\r\n\t\t\t</li> -->\r\n\t\t\t<li class=\"topbar-profile\">\r\n\t\t\t\t<button type=\"button\" class=\"p-link\" (click)=\"onProfileButtonClick()\">\r\n\t\t\t\t\t<img src=\"assets/images/avatar.png\" alt=\"Profile\" />\r\n\t\t\t\t</button>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n</div>\r\n" }]
+            args: [{ standalone: true, selector: 'app-topbar', imports: [ButtonModule, AppBreadcrumbComponent], template: "<div class=\"layout-topbar\">\n\t<div class=\"topbar-start\">\n\t\t<button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n\t\t\t<i class=\"pi pi-bars\"></i>\n\t\t</button>\n\n\t\t<!-- <app-breadcrumb class=\"topbar-breadcrumb\"></app-breadcrumb> -->\n\t</div>\n\n\t<div class=\"topbar-end\">\n\t\t<ul class=\"topbar-menu\">\n\t\t\t<li class=\"topbar-search\">\n\t\t\t\t<span class=\"p-input-icon-left\">\n\t\t\t\t\t<i class=\"pi pi-search\"></i>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tpInputText\n\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\tclass=\"p-inputtext p-component p-element w-12rem sm:w-full\" />\n\t\t\t\t</span>\n\t\t\t</li>\n\t\t\t<!-- <li class=\"ml-3\">\n\t\t\t\t<button\n\t\t\t\t\tpButton\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\ticon=\"pi pi-cog\"\n\t\t\t\t\tclass=\"p-button-text p-button-secondary p-button-rounded flex-shrink-0\"\n\t\t\t\t\t(click)=\"onConfigButtonClick()\"></button>\n\t\t\t</li> -->\n\t\t\t<li class=\"topbar-profile\">\n\t\t\t\t<button type=\"button\" class=\"p-link\" (click)=\"onProfileButtonClick()\">\n\t\t\t\t\t<img src=\"assets/images/avatar.png\" alt=\"Profile\" />\n\t\t\t\t</button>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: LayoutService }], propDecorators: { menuButton: [{
                 type: ViewChild,
                 args: ['menubutton']
@@ -694,11 +694,11 @@ class AppProfileSidebarComponent {
         this.layoutService.state.profileSidebarVisible = _val;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppProfileSidebarComponent, deps: [{ token: LayoutService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppProfileSidebarComponent, isStandalone: true, selector: "app-profilemenu", ngImport: i0, template: "<p-sidebar\r\n\t[(visible)]=\"visible\"\r\n\tposition=\"right\"\r\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\r\n\tstyleClass=\"layout-profile-sidebar w-full sm:w-25rem\">\r\n\t<div class=\"flex flex-column mx-auto md:mx-0\">\r\n\t\t<span class=\"mb-2 font-semibold\">Welcome</span>\r\n\t\t<span class=\"text-color-secondary font-medium mb-5\">Isabella Andolini</span>\r\n\r\n\t\t<ul class=\"list-none m-0 p-0\">\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Profile</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Lorem ipsum date visale</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Billing</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Amet mimin m\u0131ollit</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-cog text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Settings</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Exercitation veniam</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-power-off text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Sign Out</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Sed ut perspiciatis</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n\r\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\r\n\t\t<span class=\"mb-2 font-semibold\">Notifications</span>\r\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have 3 notifications</span>\r\n\r\n\t\t<ul class=\"list-none m-0 p-0\">\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-comment text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has new comments</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">5 min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-trash text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has been deleted</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-folder text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Post has been updated</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n\r\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\r\n\t\t<span class=\"mb-2 font-semibold\">Messages</span>\r\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have new messages</span>\r\n\r\n\t\t<ul class=\"list-none m-0 p-0\">\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-m-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">James Robinson</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">10 min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<p-tag value=\"3\" class=\"ml-auto\"></p-tag>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Mary Watson</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<p-tag value=\"1\" class=\"ml-auto\"></p-tag>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-4.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Aisha Webb</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<p-tag value=\"2\" class=\"ml-auto\"></p-tag>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n</p-sidebar>\r\n", dependencies: [{ kind: "ngmodule", type: SidebarModule }, { kind: "component", type: i2$1.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i3.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppProfileSidebarComponent, isStandalone: true, selector: "app-profilemenu", ngImport: i0, template: "<p-sidebar\n\t[(visible)]=\"visible\"\n\tposition=\"right\"\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\n\tstyleClass=\"layout-profile-sidebar w-full sm:w-25rem\">\n\t<div class=\"flex flex-column mx-auto md:mx-0\">\n\t\t<span class=\"mb-2 font-semibold\">Welcome</span>\n\t\t<span class=\"text-color-secondary font-medium mb-5\">Isabella Andolini</span>\n\n\t\t<ul class=\"list-none m-0 p-0\">\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Profile</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Lorem ipsum date visale</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Billing</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Amet mimin m\u0131ollit</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-cog text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Settings</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Exercitation veniam</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-power-off text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Sign Out</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Sed ut perspiciatis</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\n\t\t<span class=\"mb-2 font-semibold\">Notifications</span>\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have 3 notifications</span>\n\n\t\t<ul class=\"list-none m-0 p-0\">\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-comment text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has new comments</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">5 min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-trash text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has been deleted</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-folder text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Post has been updated</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\n\t\t<span class=\"mb-2 font-semibold\">Messages</span>\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have new messages</span>\n\n\t\t<ul class=\"list-none m-0 p-0\">\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-m-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">James Robinson</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">10 min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<p-tag value=\"3\" class=\"ml-auto\"></p-tag>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Mary Watson</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<p-tag value=\"1\" class=\"ml-auto\"></p-tag>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-4.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Aisha Webb</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<p-tag value=\"2\" class=\"ml-auto\"></p-tag>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n</p-sidebar>\n", dependencies: [{ kind: "ngmodule", type: SidebarModule }, { kind: "component", type: i2$1.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i3.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppProfileSidebarComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'app-profilemenu', imports: [SidebarModule, TagModule], template: "<p-sidebar\r\n\t[(visible)]=\"visible\"\r\n\tposition=\"right\"\r\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\r\n\tstyleClass=\"layout-profile-sidebar w-full sm:w-25rem\">\r\n\t<div class=\"flex flex-column mx-auto md:mx-0\">\r\n\t\t<span class=\"mb-2 font-semibold\">Welcome</span>\r\n\t\t<span class=\"text-color-secondary font-medium mb-5\">Isabella Andolini</span>\r\n\r\n\t\t<ul class=\"list-none m-0 p-0\">\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Profile</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Lorem ipsum date visale</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Billing</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Amet mimin m\u0131ollit</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-cog text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Settings</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Exercitation veniam</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-power-off text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Sign Out</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Sed ut perspiciatis</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n\r\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\r\n\t\t<span class=\"mb-2 font-semibold\">Notifications</span>\r\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have 3 notifications</span>\r\n\r\n\t\t<ul class=\"list-none m-0 p-0\">\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-comment text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has new comments</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">5 min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-trash text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has been deleted</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<i class=\"pi pi-folder text-xl text-primary\"></i>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Post has been updated</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n\r\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\r\n\t\t<span class=\"mb-2 font-semibold\">Messages</span>\r\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have new messages</span>\r\n\r\n\t\t<ul class=\"list-none m-0 p-0\">\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-m-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">James Robinson</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">10 min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<p-tag value=\"3\" class=\"ml-auto\"></p-tag>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Mary Watson</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<p-tag value=\"1\" class=\"ml-auto\"></p-tag>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t\t<li>\r\n\t\t\t\t<a\r\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-4.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"ml-3\">\r\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Aisha Webb</span>\r\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<p-tag value=\"2\" class=\"ml-auto\"></p-tag>\r\n\t\t\t\t</a>\r\n\t\t\t</li>\r\n\t\t</ul>\r\n\t</div>\r\n</p-sidebar>\r\n" }]
+            args: [{ standalone: true, selector: 'app-profilemenu', imports: [SidebarModule, TagModule], template: "<p-sidebar\n\t[(visible)]=\"visible\"\n\tposition=\"right\"\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\n\tstyleClass=\"layout-profile-sidebar w-full sm:w-25rem\">\n\t<div class=\"flex flex-column mx-auto md:mx-0\">\n\t\t<span class=\"mb-2 font-semibold\">Welcome</span>\n\t\t<span class=\"text-color-secondary font-medium mb-5\">Isabella Andolini</span>\n\n\t\t<ul class=\"list-none m-0 p-0\">\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Profile</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Lorem ipsum date visale</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-user text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Billing</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Amet mimin m\u0131ollit</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-cog text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Settings</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Exercitation veniam</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-power-off text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Sign Out</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">Sed ut perspiciatis</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\n\t\t<span class=\"mb-2 font-semibold\">Notifications</span>\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have 3 notifications</span>\n\n\t\t<ul class=\"list-none m-0 p-0\">\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-comment text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has new comments</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">5 min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-trash text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Your post has been deleted</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<i class=\"pi pi-folder text-xl text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Post has been updated</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n\n\t<div class=\"flex flex-column mt-5 mx-auto md:mx-0\">\n\t\t<span class=\"mb-2 font-semibold\">Messages</span>\n\t\t<span class=\"text-color-secondary font-medium mb-5\">You have new messages</span>\n\n\t\t<ul class=\"list-none m-0 p-0\">\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-m-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">James Robinson</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">10 min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<p-tag value=\"3\" class=\"ml-auto\"></p-tag>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-8.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Mary Watson</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">15min ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<p-tag value=\"1\" class=\"ml-auto\"></p-tag>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<a\n\t\t\t\t\tclass=\"cursor-pointer flex surface-border mb-3 p-3 align-items-center border-1 surface-border border-round hover:surface-hover transition-colors transition-duration-150\">\n\t\t\t\t\t<span>\n\t\t\t\t\t\t<img src=\"assets/demo/images/avatar/circle/avatar-f-4.png\" alt=\"Avatar\" class=\"w-2rem h-2rem\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t\t<span class=\"mb-2 font-semibold\">Aisha Webb</span>\n\t\t\t\t\t\t<p class=\"text-color-secondary m-0\">3h ago</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<p-tag value=\"2\" class=\"ml-auto\"></p-tag>\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n</p-sidebar>\n" }]
         }], ctorParameters: () => [{ type: LayoutService }] });
 
 class AppConfigComponent {
@@ -809,11 +809,11 @@ class AppConfigComponent {
         this.scale++;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppConfigComponent, deps: [{ token: LayoutService }, { token: AppMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppConfigComponent, isStandalone: true, selector: "app-config", inputs: { minimal: "minimal" }, ngImport: i0, template: "<button class=\"layout-config-button p-link\" type=\"button\" (click)=\"onConfigButtonClick()\">\r\n\t<i class=\"pi pi-cog\"></i>\r\n</button>\r\n\r\n<p-sidebar\r\n\t[(visible)]=\"visible\"\r\n\tposition=\"right\"\r\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\r\n\tstyleClass=\"layout-config-sidebar w-18rem\">\r\n\t<h5>Themes</h5>\r\n\t<div class=\"flex flex-wrap row-gap-3\">\r\n\t\t@for (theme of componentThemes; track theme) {\r\n\t\t\t<div class=\"w-3\">\r\n\t\t\t\t<button\r\n\t\t\t\t\ttype=\"button\"\r\n\t\t\t\t\tclass=\"cursor-pointer p-link w-2rem h-2rem border-circle flex-shrink-0 flex align-items-center justify-content-center\"\r\n\t\t\t\t\t(click)=\"changeTheme(theme.name)\"\r\n\t\t\t\t\t[ngStyle]=\"{ 'background-color': theme.color }\">\r\n\t\t\t\t\t@if (theme.name == this.layoutService.config().theme) {\r\n\t\t\t\t\t\t<i class=\"pi pi-check text-white\"></i>\r\n\t\t\t\t\t}\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\t\t}\r\n\t</div>\r\n\r\n\t<h5>Scale</h5>\r\n\t<div class=\"flex align-items-center\">\r\n\t\t<button\r\n\t\t\ticon=\"pi pi-minus\"\r\n\t\t\ttype=\"button\"\r\n\t\t\tpButton\r\n\t\t\t(click)=\"decrementScale()\"\r\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem mr-2\"\r\n\t\t\t[disabled]=\"scale === scales[0]\"></button>\r\n\t\t<div class=\"flex gap-2 align-items-center\">\r\n\t\t\t@for (s of scales; track s) {\r\n\t\t\t\t<i class=\"pi pi-circle-fill text-300\" [ngClass]=\"{ 'text-primary-500': s === scale }\"></i>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t<button\r\n\t\t\ticon=\"pi pi-plus\"\r\n\t\t\ttype=\"button\"\r\n\t\t\tpButton\r\n\t\t\t(click)=\"incrementScale()\"\r\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem ml-2\"\r\n\t\t\t[disabled]=\"scale === scales[scales.length - 1]\"></button>\r\n\t</div>\r\n\r\n\t@if (!minimal) {\r\n\t\t<h5>Menu Type</h5>\r\n\t\t<div class=\"flex flex-wrap row-gap-3\">\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"static\" [(ngModel)]=\"menuMode\" inputId=\"mode1\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode1\">Static</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"overlay\" [(ngModel)]=\"menuMode\" inputId=\"mode2\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode2\">Overlay</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim\" [(ngModel)]=\"menuMode\" inputId=\"mode3\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode3\">Slim</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim-plus\" [(ngModel)]=\"menuMode\" inputId=\"mode4\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode3\">Slim +</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"reveal\" [(ngModel)]=\"menuMode\" inputId=\"mode6\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode5\">Reveal</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"drawer\" [(ngModel)]=\"menuMode\" inputId=\"mode7\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode6\">Drawer</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"horizontal\" [(ngModel)]=\"menuMode\" inputId=\"mode5\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode4\">Horizontal</label>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t<h5>Menu Theme</h5>\r\n\t\t<div class=\"field-radiobutton\">\r\n\t\t\t<p-radioButton\r\n\t\t\t\tname=\"menuTheme\"\r\n\t\t\t\tvalue=\"colorScheme\"\r\n\t\t\t\t[(ngModel)]=\"menuTheme\"\r\n\t\t\t\tinputId=\"menutheme-colorscheme\"></p-radioButton>\r\n\t\t\t<label for=\"menutheme-colorscheme\">Color Scheme</label>\r\n\t\t</div>\r\n\t\t<div class=\"field-radiobutton\">\r\n\t\t\t<p-radioButton\r\n\t\t\t\tname=\"menuTheme\"\r\n\t\t\t\tvalue=\"primaryColor\"\r\n\t\t\t\t[(ngModel)]=\"menuTheme\"\r\n\t\t\t\tinputId=\"menutheme-primarycolor\"></p-radioButton>\r\n\t\t\t<label for=\"menutheme-primarycolor\">Primary Color</label>\r\n\t\t</div>\r\n\t\t<div class=\"field-radiobutton\">\r\n\t\t\t<p-radioButton\r\n\t\t\t\tname=\"menuTheme\"\r\n\t\t\t\tvalue=\"transparent\"\r\n\t\t\t\t[(ngModel)]=\"menuTheme\"\r\n\t\t\t\tinputId=\"menutheme-transparent\"></p-radioButton>\r\n\t\t\t<label for=\"menutheme-transparent\">Transparent</label>\r\n\t\t</div>\r\n\t}\r\n\r\n\t<h5>Color Scheme</h5>\r\n\t<div class=\"field-radiobutton\">\r\n\t\t<p-radioButton name=\"colorScheme\" value=\"light\" [(ngModel)]=\"colorScheme\" inputId=\"mode-light\"></p-radioButton>\r\n\t\t<label for=\"mode-light\">Light</label>\r\n\t</div>\r\n\t<div class=\"field-radiobutton\">\r\n\t\t<p-radioButton name=\"colorScheme\" value=\"dim\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dim\"></p-radioButton>\r\n\t\t<label for=\"mode-dim\">Dim</label>\r\n\t</div>\r\n\t<div class=\"field-radiobutton\">\r\n\t\t<p-radioButton name=\"colorScheme\" value=\"dark\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dark\"></p-radioButton>\r\n\t\t<label for=\"mode-dark\">Dark</label>\r\n\t</div>\r\n\r\n\t@if (!minimal) {\r\n\t\t<h5>Input Style</h5>\r\n\t\t<div class=\"flex\">\r\n\t\t\t<div class=\"field-radiobutton flex-1\">\r\n\t\t\t\t<p-radioButton\r\n\t\t\t\t\tname=\"inputStyle\"\r\n\t\t\t\t\tvalue=\"outlined\"\r\n\t\t\t\t\t[(ngModel)]=\"inputStyle\"\r\n\t\t\t\t\tinputId=\"outlined_input\"></p-radioButton>\r\n\t\t\t\t<label for=\"outlined_input\">Outlined</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"field-radiobutton flex-1\">\r\n\t\t\t\t<p-radioButton name=\"inputStyle\" value=\"filled\" [(ngModel)]=\"inputStyle\" inputId=\"filled_input\"></p-radioButton>\r\n\t\t\t\t<label for=\"filled_input\">Filled</label>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t<h5>Ripple Effect</h5>\r\n\t\t<p-inputSwitch [(ngModel)]=\"ripple\"></p-inputSwitch>\r\n\t}\r\n</p-sidebar>\r\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SidebarModule }, { kind: "component", type: i2$1.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i5$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i7.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: AppConfigComponent, isStandalone: true, selector: "app-config", inputs: { minimal: "minimal" }, ngImport: i0, template: "<button class=\"layout-config-button p-link\" type=\"button\" (click)=\"onConfigButtonClick()\">\n\t<i class=\"pi pi-cog\"></i>\n</button>\n\n<p-sidebar\n\t[(visible)]=\"visible\"\n\tposition=\"right\"\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\n\tstyleClass=\"layout-config-sidebar w-18rem\">\n\t<h5>Themes</h5>\n\t<div class=\"flex flex-wrap row-gap-3\">\n\t\t@for (theme of componentThemes; track theme) {\n\t\t\t<div class=\"w-3\">\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"cursor-pointer p-link w-2rem h-2rem border-circle flex-shrink-0 flex align-items-center justify-content-center\"\n\t\t\t\t\t(click)=\"changeTheme(theme.name)\"\n\t\t\t\t\t[ngStyle]=\"{ 'background-color': theme.color }\">\n\t\t\t\t\t@if (theme.name == this.layoutService.config().theme) {\n\t\t\t\t\t\t<i class=\"pi pi-check text-white\"></i>\n\t\t\t\t\t}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t}\n\t</div>\n\n\t<h5>Scale</h5>\n\t<div class=\"flex align-items-center\">\n\t\t<button\n\t\t\ticon=\"pi pi-minus\"\n\t\t\ttype=\"button\"\n\t\t\tpButton\n\t\t\t(click)=\"decrementScale()\"\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem mr-2\"\n\t\t\t[disabled]=\"scale === scales[0]\"></button>\n\t\t<div class=\"flex gap-2 align-items-center\">\n\t\t\t@for (s of scales; track s) {\n\t\t\t\t<i class=\"pi pi-circle-fill text-300\" [ngClass]=\"{ 'text-primary-500': s === scale }\"></i>\n\t\t\t}\n\t\t</div>\n\t\t<button\n\t\t\ticon=\"pi pi-plus\"\n\t\t\ttype=\"button\"\n\t\t\tpButton\n\t\t\t(click)=\"incrementScale()\"\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem ml-2\"\n\t\t\t[disabled]=\"scale === scales[scales.length - 1]\"></button>\n\t</div>\n\n\t@if (!minimal) {\n\t\t<h5>Menu Type</h5>\n\t\t<div class=\"flex flex-wrap row-gap-3\">\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"static\" [(ngModel)]=\"menuMode\" inputId=\"mode1\"></p-radioButton>\n\t\t\t\t<label for=\"mode1\">Static</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"overlay\" [(ngModel)]=\"menuMode\" inputId=\"mode2\"></p-radioButton>\n\t\t\t\t<label for=\"mode2\">Overlay</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim\" [(ngModel)]=\"menuMode\" inputId=\"mode3\"></p-radioButton>\n\t\t\t\t<label for=\"mode3\">Slim</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim-plus\" [(ngModel)]=\"menuMode\" inputId=\"mode4\"></p-radioButton>\n\t\t\t\t<label for=\"mode3\">Slim +</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"reveal\" [(ngModel)]=\"menuMode\" inputId=\"mode6\"></p-radioButton>\n\t\t\t\t<label for=\"mode5\">Reveal</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"drawer\" [(ngModel)]=\"menuMode\" inputId=\"mode7\"></p-radioButton>\n\t\t\t\t<label for=\"mode6\">Drawer</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"horizontal\" [(ngModel)]=\"menuMode\" inputId=\"mode5\"></p-radioButton>\n\t\t\t\t<label for=\"mode4\">Horizontal</label>\n\t\t\t</div>\n\t\t</div>\n\t\t<h5>Menu Theme</h5>\n\t\t<div class=\"field-radiobutton\">\n\t\t\t<p-radioButton\n\t\t\t\tname=\"menuTheme\"\n\t\t\t\tvalue=\"colorScheme\"\n\t\t\t\t[(ngModel)]=\"menuTheme\"\n\t\t\t\tinputId=\"menutheme-colorscheme\"></p-radioButton>\n\t\t\t<label for=\"menutheme-colorscheme\">Color Scheme</label>\n\t\t</div>\n\t\t<div class=\"field-radiobutton\">\n\t\t\t<p-radioButton\n\t\t\t\tname=\"menuTheme\"\n\t\t\t\tvalue=\"primaryColor\"\n\t\t\t\t[(ngModel)]=\"menuTheme\"\n\t\t\t\tinputId=\"menutheme-primarycolor\"></p-radioButton>\n\t\t\t<label for=\"menutheme-primarycolor\">Primary Color</label>\n\t\t</div>\n\t\t<div class=\"field-radiobutton\">\n\t\t\t<p-radioButton\n\t\t\t\tname=\"menuTheme\"\n\t\t\t\tvalue=\"transparent\"\n\t\t\t\t[(ngModel)]=\"menuTheme\"\n\t\t\t\tinputId=\"menutheme-transparent\"></p-radioButton>\n\t\t\t<label for=\"menutheme-transparent\">Transparent</label>\n\t\t</div>\n\t}\n\n\t<h5>Color Scheme</h5>\n\t<div class=\"field-radiobutton\">\n\t\t<p-radioButton name=\"colorScheme\" value=\"light\" [(ngModel)]=\"colorScheme\" inputId=\"mode-light\"></p-radioButton>\n\t\t<label for=\"mode-light\">Light</label>\n\t</div>\n\t<div class=\"field-radiobutton\">\n\t\t<p-radioButton name=\"colorScheme\" value=\"dim\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dim\"></p-radioButton>\n\t\t<label for=\"mode-dim\">Dim</label>\n\t</div>\n\t<div class=\"field-radiobutton\">\n\t\t<p-radioButton name=\"colorScheme\" value=\"dark\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dark\"></p-radioButton>\n\t\t<label for=\"mode-dark\">Dark</label>\n\t</div>\n\n\t@if (!minimal) {\n\t\t<h5>Input Style</h5>\n\t\t<div class=\"flex\">\n\t\t\t<div class=\"field-radiobutton flex-1\">\n\t\t\t\t<p-radioButton\n\t\t\t\t\tname=\"inputStyle\"\n\t\t\t\t\tvalue=\"outlined\"\n\t\t\t\t\t[(ngModel)]=\"inputStyle\"\n\t\t\t\t\tinputId=\"outlined_input\"></p-radioButton>\n\t\t\t\t<label for=\"outlined_input\">Outlined</label>\n\t\t\t</div>\n\t\t\t<div class=\"field-radiobutton flex-1\">\n\t\t\t\t<p-radioButton name=\"inputStyle\" value=\"filled\" [(ngModel)]=\"inputStyle\" inputId=\"filled_input\"></p-radioButton>\n\t\t\t\t<label for=\"filled_input\">Filled</label>\n\t\t\t</div>\n\t\t</div>\n\t\t<h5>Ripple Effect</h5>\n\t\t<p-inputSwitch [(ngModel)]=\"ripple\"></p-inputSwitch>\n\t}\n</p-sidebar>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SidebarModule }, { kind: "component", type: i2$1.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i5$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i7.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppConfigComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'app-config', imports: [FormsModule, SidebarModule, RadioButtonModule, ButtonModule, InputSwitchModule, NgStyle, NgClass], template: "<button class=\"layout-config-button p-link\" type=\"button\" (click)=\"onConfigButtonClick()\">\r\n\t<i class=\"pi pi-cog\"></i>\r\n</button>\r\n\r\n<p-sidebar\r\n\t[(visible)]=\"visible\"\r\n\tposition=\"right\"\r\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\r\n\tstyleClass=\"layout-config-sidebar w-18rem\">\r\n\t<h5>Themes</h5>\r\n\t<div class=\"flex flex-wrap row-gap-3\">\r\n\t\t@for (theme of componentThemes; track theme) {\r\n\t\t\t<div class=\"w-3\">\r\n\t\t\t\t<button\r\n\t\t\t\t\ttype=\"button\"\r\n\t\t\t\t\tclass=\"cursor-pointer p-link w-2rem h-2rem border-circle flex-shrink-0 flex align-items-center justify-content-center\"\r\n\t\t\t\t\t(click)=\"changeTheme(theme.name)\"\r\n\t\t\t\t\t[ngStyle]=\"{ 'background-color': theme.color }\">\r\n\t\t\t\t\t@if (theme.name == this.layoutService.config().theme) {\r\n\t\t\t\t\t\t<i class=\"pi pi-check text-white\"></i>\r\n\t\t\t\t\t}\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\t\t}\r\n\t</div>\r\n\r\n\t<h5>Scale</h5>\r\n\t<div class=\"flex align-items-center\">\r\n\t\t<button\r\n\t\t\ticon=\"pi pi-minus\"\r\n\t\t\ttype=\"button\"\r\n\t\t\tpButton\r\n\t\t\t(click)=\"decrementScale()\"\r\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem mr-2\"\r\n\t\t\t[disabled]=\"scale === scales[0]\"></button>\r\n\t\t<div class=\"flex gap-2 align-items-center\">\r\n\t\t\t@for (s of scales; track s) {\r\n\t\t\t\t<i class=\"pi pi-circle-fill text-300\" [ngClass]=\"{ 'text-primary-500': s === scale }\"></i>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t<button\r\n\t\t\ticon=\"pi pi-plus\"\r\n\t\t\ttype=\"button\"\r\n\t\t\tpButton\r\n\t\t\t(click)=\"incrementScale()\"\r\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem ml-2\"\r\n\t\t\t[disabled]=\"scale === scales[scales.length - 1]\"></button>\r\n\t</div>\r\n\r\n\t@if (!minimal) {\r\n\t\t<h5>Menu Type</h5>\r\n\t\t<div class=\"flex flex-wrap row-gap-3\">\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"static\" [(ngModel)]=\"menuMode\" inputId=\"mode1\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode1\">Static</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"overlay\" [(ngModel)]=\"menuMode\" inputId=\"mode2\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode2\">Overlay</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim\" [(ngModel)]=\"menuMode\" inputId=\"mode3\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode3\">Slim</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim-plus\" [(ngModel)]=\"menuMode\" inputId=\"mode4\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode3\">Slim +</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"reveal\" [(ngModel)]=\"menuMode\" inputId=\"mode6\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode5\">Reveal</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"drawer\" [(ngModel)]=\"menuMode\" inputId=\"mode7\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode6\">Drawer</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\r\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"horizontal\" [(ngModel)]=\"menuMode\" inputId=\"mode5\"></p-radioButton>\r\n\t\t\t\t<label for=\"mode4\">Horizontal</label>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t<h5>Menu Theme</h5>\r\n\t\t<div class=\"field-radiobutton\">\r\n\t\t\t<p-radioButton\r\n\t\t\t\tname=\"menuTheme\"\r\n\t\t\t\tvalue=\"colorScheme\"\r\n\t\t\t\t[(ngModel)]=\"menuTheme\"\r\n\t\t\t\tinputId=\"menutheme-colorscheme\"></p-radioButton>\r\n\t\t\t<label for=\"menutheme-colorscheme\">Color Scheme</label>\r\n\t\t</div>\r\n\t\t<div class=\"field-radiobutton\">\r\n\t\t\t<p-radioButton\r\n\t\t\t\tname=\"menuTheme\"\r\n\t\t\t\tvalue=\"primaryColor\"\r\n\t\t\t\t[(ngModel)]=\"menuTheme\"\r\n\t\t\t\tinputId=\"menutheme-primarycolor\"></p-radioButton>\r\n\t\t\t<label for=\"menutheme-primarycolor\">Primary Color</label>\r\n\t\t</div>\r\n\t\t<div class=\"field-radiobutton\">\r\n\t\t\t<p-radioButton\r\n\t\t\t\tname=\"menuTheme\"\r\n\t\t\t\tvalue=\"transparent\"\r\n\t\t\t\t[(ngModel)]=\"menuTheme\"\r\n\t\t\t\tinputId=\"menutheme-transparent\"></p-radioButton>\r\n\t\t\t<label for=\"menutheme-transparent\">Transparent</label>\r\n\t\t</div>\r\n\t}\r\n\r\n\t<h5>Color Scheme</h5>\r\n\t<div class=\"field-radiobutton\">\r\n\t\t<p-radioButton name=\"colorScheme\" value=\"light\" [(ngModel)]=\"colorScheme\" inputId=\"mode-light\"></p-radioButton>\r\n\t\t<label for=\"mode-light\">Light</label>\r\n\t</div>\r\n\t<div class=\"field-radiobutton\">\r\n\t\t<p-radioButton name=\"colorScheme\" value=\"dim\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dim\"></p-radioButton>\r\n\t\t<label for=\"mode-dim\">Dim</label>\r\n\t</div>\r\n\t<div class=\"field-radiobutton\">\r\n\t\t<p-radioButton name=\"colorScheme\" value=\"dark\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dark\"></p-radioButton>\r\n\t\t<label for=\"mode-dark\">Dark</label>\r\n\t</div>\r\n\r\n\t@if (!minimal) {\r\n\t\t<h5>Input Style</h5>\r\n\t\t<div class=\"flex\">\r\n\t\t\t<div class=\"field-radiobutton flex-1\">\r\n\t\t\t\t<p-radioButton\r\n\t\t\t\t\tname=\"inputStyle\"\r\n\t\t\t\t\tvalue=\"outlined\"\r\n\t\t\t\t\t[(ngModel)]=\"inputStyle\"\r\n\t\t\t\t\tinputId=\"outlined_input\"></p-radioButton>\r\n\t\t\t\t<label for=\"outlined_input\">Outlined</label>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"field-radiobutton flex-1\">\r\n\t\t\t\t<p-radioButton name=\"inputStyle\" value=\"filled\" [(ngModel)]=\"inputStyle\" inputId=\"filled_input\"></p-radioButton>\r\n\t\t\t\t<label for=\"filled_input\">Filled</label>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t<h5>Ripple Effect</h5>\r\n\t\t<p-inputSwitch [(ngModel)]=\"ripple\"></p-inputSwitch>\r\n\t}\r\n</p-sidebar>\r\n" }]
+            args: [{ standalone: true, selector: 'app-config', imports: [FormsModule, SidebarModule, RadioButtonModule, ButtonModule, InputSwitchModule, NgStyle, NgClass], template: "<button class=\"layout-config-button p-link\" type=\"button\" (click)=\"onConfigButtonClick()\">\n\t<i class=\"pi pi-cog\"></i>\n</button>\n\n<p-sidebar\n\t[(visible)]=\"visible\"\n\tposition=\"right\"\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\n\tstyleClass=\"layout-config-sidebar w-18rem\">\n\t<h5>Themes</h5>\n\t<div class=\"flex flex-wrap row-gap-3\">\n\t\t@for (theme of componentThemes; track theme) {\n\t\t\t<div class=\"w-3\">\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"cursor-pointer p-link w-2rem h-2rem border-circle flex-shrink-0 flex align-items-center justify-content-center\"\n\t\t\t\t\t(click)=\"changeTheme(theme.name)\"\n\t\t\t\t\t[ngStyle]=\"{ 'background-color': theme.color }\">\n\t\t\t\t\t@if (theme.name == this.layoutService.config().theme) {\n\t\t\t\t\t\t<i class=\"pi pi-check text-white\"></i>\n\t\t\t\t\t}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t}\n\t</div>\n\n\t<h5>Scale</h5>\n\t<div class=\"flex align-items-center\">\n\t\t<button\n\t\t\ticon=\"pi pi-minus\"\n\t\t\ttype=\"button\"\n\t\t\tpButton\n\t\t\t(click)=\"decrementScale()\"\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem mr-2\"\n\t\t\t[disabled]=\"scale === scales[0]\"></button>\n\t\t<div class=\"flex gap-2 align-items-center\">\n\t\t\t@for (s of scales; track s) {\n\t\t\t\t<i class=\"pi pi-circle-fill text-300\" [ngClass]=\"{ 'text-primary-500': s === scale }\"></i>\n\t\t\t}\n\t\t</div>\n\t\t<button\n\t\t\ticon=\"pi pi-plus\"\n\t\t\ttype=\"button\"\n\t\t\tpButton\n\t\t\t(click)=\"incrementScale()\"\n\t\t\tclass=\"p-button-text p-button-rounded w-2rem h-2rem ml-2\"\n\t\t\t[disabled]=\"scale === scales[scales.length - 1]\"></button>\n\t</div>\n\n\t@if (!minimal) {\n\t\t<h5>Menu Type</h5>\n\t\t<div class=\"flex flex-wrap row-gap-3\">\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"static\" [(ngModel)]=\"menuMode\" inputId=\"mode1\"></p-radioButton>\n\t\t\t\t<label for=\"mode1\">Static</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"overlay\" [(ngModel)]=\"menuMode\" inputId=\"mode2\"></p-radioButton>\n\t\t\t\t<label for=\"mode2\">Overlay</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim\" [(ngModel)]=\"menuMode\" inputId=\"mode3\"></p-radioButton>\n\t\t\t\t<label for=\"mode3\">Slim</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"slim-plus\" [(ngModel)]=\"menuMode\" inputId=\"mode4\"></p-radioButton>\n\t\t\t\t<label for=\"mode3\">Slim +</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"reveal\" [(ngModel)]=\"menuMode\" inputId=\"mode6\"></p-radioButton>\n\t\t\t\t<label for=\"mode5\">Reveal</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"drawer\" [(ngModel)]=\"menuMode\" inputId=\"mode7\"></p-radioButton>\n\t\t\t\t<label for=\"mode6\">Drawer</label>\n\t\t\t</div>\n\t\t\t<div class=\"flex align-items-center gap-2 w-6\">\n\t\t\t\t<p-radioButton name=\"menuMode\" value=\"horizontal\" [(ngModel)]=\"menuMode\" inputId=\"mode5\"></p-radioButton>\n\t\t\t\t<label for=\"mode4\">Horizontal</label>\n\t\t\t</div>\n\t\t</div>\n\t\t<h5>Menu Theme</h5>\n\t\t<div class=\"field-radiobutton\">\n\t\t\t<p-radioButton\n\t\t\t\tname=\"menuTheme\"\n\t\t\t\tvalue=\"colorScheme\"\n\t\t\t\t[(ngModel)]=\"menuTheme\"\n\t\t\t\tinputId=\"menutheme-colorscheme\"></p-radioButton>\n\t\t\t<label for=\"menutheme-colorscheme\">Color Scheme</label>\n\t\t</div>\n\t\t<div class=\"field-radiobutton\">\n\t\t\t<p-radioButton\n\t\t\t\tname=\"menuTheme\"\n\t\t\t\tvalue=\"primaryColor\"\n\t\t\t\t[(ngModel)]=\"menuTheme\"\n\t\t\t\tinputId=\"menutheme-primarycolor\"></p-radioButton>\n\t\t\t<label for=\"menutheme-primarycolor\">Primary Color</label>\n\t\t</div>\n\t\t<div class=\"field-radiobutton\">\n\t\t\t<p-radioButton\n\t\t\t\tname=\"menuTheme\"\n\t\t\t\tvalue=\"transparent\"\n\t\t\t\t[(ngModel)]=\"menuTheme\"\n\t\t\t\tinputId=\"menutheme-transparent\"></p-radioButton>\n\t\t\t<label for=\"menutheme-transparent\">Transparent</label>\n\t\t</div>\n\t}\n\n\t<h5>Color Scheme</h5>\n\t<div class=\"field-radiobutton\">\n\t\t<p-radioButton name=\"colorScheme\" value=\"light\" [(ngModel)]=\"colorScheme\" inputId=\"mode-light\"></p-radioButton>\n\t\t<label for=\"mode-light\">Light</label>\n\t</div>\n\t<div class=\"field-radiobutton\">\n\t\t<p-radioButton name=\"colorScheme\" value=\"dim\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dim\"></p-radioButton>\n\t\t<label for=\"mode-dim\">Dim</label>\n\t</div>\n\t<div class=\"field-radiobutton\">\n\t\t<p-radioButton name=\"colorScheme\" value=\"dark\" [(ngModel)]=\"colorScheme\" inputId=\"mode-dark\"></p-radioButton>\n\t\t<label for=\"mode-dark\">Dark</label>\n\t</div>\n\n\t@if (!minimal) {\n\t\t<h5>Input Style</h5>\n\t\t<div class=\"flex\">\n\t\t\t<div class=\"field-radiobutton flex-1\">\n\t\t\t\t<p-radioButton\n\t\t\t\t\tname=\"inputStyle\"\n\t\t\t\t\tvalue=\"outlined\"\n\t\t\t\t\t[(ngModel)]=\"inputStyle\"\n\t\t\t\t\tinputId=\"outlined_input\"></p-radioButton>\n\t\t\t\t<label for=\"outlined_input\">Outlined</label>\n\t\t\t</div>\n\t\t\t<div class=\"field-radiobutton flex-1\">\n\t\t\t\t<p-radioButton name=\"inputStyle\" value=\"filled\" [(ngModel)]=\"inputStyle\" inputId=\"filled_input\"></p-radioButton>\n\t\t\t\t<label for=\"filled_input\">Filled</label>\n\t\t\t</div>\n\t\t</div>\n\t\t<h5>Ripple Effect</h5>\n\t\t<p-inputSwitch [(ngModel)]=\"ripple\"></p-inputSwitch>\n\t}\n</p-sidebar>\n" }]
         }], ctorParameters: () => [{ type: LayoutService }, { type: AppMenuService }], propDecorators: { minimal: [{
                 type: Input
             }] } });
@@ -916,7 +916,7 @@ class AppLayoutComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppLayoutComponent, deps: [{ token: AppMenuService }, { token: LayoutService }, { token: i0.Renderer2 }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppLayoutComponent, isStandalone: true, selector: "app-layout", viewQueries: [{ propertyName: "appSidebar", first: true, predicate: AppSidebarComponent, descendants: true }, { propertyName: "appTopbar", first: true, predicate: AppTopbarComponent, descendants: true }], ngImport: i0, template: "<div class=\"layout-container\" [ngClass]=\"containerClass\">\r\n\t<app-sidebar></app-sidebar>\r\n\t<div class=\"layout-content-wrapper\">\r\n\t\t<app-topbar></app-topbar>\r\n\t\t<!-- <app-breadcrumb class=\"content-breadcrumb\"></app-breadcrumb> -->\r\n\t\t<div class=\"layout-content\">\r\n\t\t\t<router-outlet></router-outlet>\r\n\t\t</div>\r\n\t</div>\r\n\t<app-profilemenu></app-profilemenu>\r\n\t<app-config></app-config>\r\n\t<div class=\"layout-mask\"></div>\r\n</div>\r\n\r\n<p-toast key=\"toast-root\"></p-toast>\r\n<p-dialog key=\"dialog-root\"></p-dialog>\r\n<p-messages key=\"messages-root\"></p-messages>\r\n<p-confirmPopup key=\"confirmPopup-root\"></p-confirmPopup>\r\n<p-confirmDialog key=\"confirmDialog-root\"></p-confirmDialog>\r\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i4$1.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: ConfirmPopupModule }, { kind: "component", type: i5$2.ConfirmPopup, selector: "p-confirmPopup", inputs: ["key", "defaultFocus", "showTransitionOptions", "hideTransitionOptions", "autoZIndex", "baseZIndex", "style", "styleClass", "visible"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i6$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i7$1.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i8.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "component", type: AppSidebarComponent, selector: "app-sidebar" }, { kind: "component", type: AppTopbarComponent, selector: "app-topbar" }, { kind: "component", type: AppProfileSidebarComponent, selector: "app-profilemenu" }, { kind: "component", type: AppConfigComponent, selector: "app-config", inputs: ["minimal"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: AppLayoutComponent, isStandalone: true, selector: "app-layout", viewQueries: [{ propertyName: "appSidebar", first: true, predicate: AppSidebarComponent, descendants: true }, { propertyName: "appTopbar", first: true, predicate: AppTopbarComponent, descendants: true }], ngImport: i0, template: "<div class=\"layout-container\" [ngClass]=\"containerClass\">\n\t<app-sidebar></app-sidebar>\n\t<div class=\"layout-content-wrapper\">\n\t\t<app-topbar></app-topbar>\n\t\t<!-- <app-breadcrumb class=\"content-breadcrumb\"></app-breadcrumb> -->\n\t\t<div class=\"layout-content\">\n\t\t\t<router-outlet></router-outlet>\n\t\t</div>\n\t</div>\n\t<app-profilemenu></app-profilemenu>\n\t<app-config></app-config>\n\t<div class=\"layout-mask\"></div>\n</div>\n\n<p-toast key=\"toast-root\"></p-toast>\n<p-dialog key=\"dialog-root\"></p-dialog>\n<p-messages key=\"messages-root\"></p-messages>\n<p-confirmPopup key=\"confirmPopup-root\"></p-confirmPopup>\n<p-confirmDialog key=\"confirmDialog-root\"></p-confirmDialog>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i4$1.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: ConfirmPopupModule }, { kind: "component", type: i5$2.ConfirmPopup, selector: "p-confirmPopup", inputs: ["key", "defaultFocus", "showTransitionOptions", "hideTransitionOptions", "autoZIndex", "baseZIndex", "style", "styleClass", "visible"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i6$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i7$1.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i8.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "component", type: AppSidebarComponent, selector: "app-sidebar" }, { kind: "component", type: AppTopbarComponent, selector: "app-topbar" }, { kind: "component", type: AppProfileSidebarComponent, selector: "app-profilemenu" }, { kind: "component", type: AppConfigComponent, selector: "app-config", inputs: ["minimal"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: AppLayoutComponent, decorators: [{
             type: Component,
@@ -933,7 +933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImpor
                         AppBreadcrumbComponent,
                         AppProfileSidebarComponent,
                         AppConfigComponent
-                    ], template: "<div class=\"layout-container\" [ngClass]=\"containerClass\">\r\n\t<app-sidebar></app-sidebar>\r\n\t<div class=\"layout-content-wrapper\">\r\n\t\t<app-topbar></app-topbar>\r\n\t\t<!-- <app-breadcrumb class=\"content-breadcrumb\"></app-breadcrumb> -->\r\n\t\t<div class=\"layout-content\">\r\n\t\t\t<router-outlet></router-outlet>\r\n\t\t</div>\r\n\t</div>\r\n\t<app-profilemenu></app-profilemenu>\r\n\t<app-config></app-config>\r\n\t<div class=\"layout-mask\"></div>\r\n</div>\r\n\r\n<p-toast key=\"toast-root\"></p-toast>\r\n<p-dialog key=\"dialog-root\"></p-dialog>\r\n<p-messages key=\"messages-root\"></p-messages>\r\n<p-confirmPopup key=\"confirmPopup-root\"></p-confirmPopup>\r\n<p-confirmDialog key=\"confirmDialog-root\"></p-confirmDialog>\r\n" }]
+                    ], template: "<div class=\"layout-container\" [ngClass]=\"containerClass\">\n\t<app-sidebar></app-sidebar>\n\t<div class=\"layout-content-wrapper\">\n\t\t<app-topbar></app-topbar>\n\t\t<!-- <app-breadcrumb class=\"content-breadcrumb\"></app-breadcrumb> -->\n\t\t<div class=\"layout-content\">\n\t\t\t<router-outlet></router-outlet>\n\t\t</div>\n\t</div>\n\t<app-profilemenu></app-profilemenu>\n\t<app-config></app-config>\n\t<div class=\"layout-mask\"></div>\n</div>\n\n<p-toast key=\"toast-root\"></p-toast>\n<p-dialog key=\"dialog-root\"></p-dialog>\n<p-messages key=\"messages-root\"></p-messages>\n<p-confirmPopup key=\"confirmPopup-root\"></p-confirmPopup>\n<p-confirmDialog key=\"confirmDialog-root\"></p-confirmDialog>\n" }]
         }], ctorParameters: () => [{ type: AppMenuService }, { type: LayoutService }, { type: i0.Renderer2 }, { type: i2.Router }], propDecorators: { appSidebar: [{
                 type: ViewChild,
                 args: [AppSidebarComponent]