aril 1.1.65 → 1.1.67

package/theme/layout/app/config/app.config.component.ts

@@ -1,143 +1,143 @@
-import { NgClass, NgStyle } from '@angular/common';
-import { Component, Input, OnInit } from '@angular/core';
-import { FormsModule } from '@angular/forms';
-
-import { ButtonModule } from 'primeng/button';
-import { InputSwitchModule } from 'primeng/inputswitch';
-import { RadioButtonModule } from 'primeng/radiobutton';
-import { SidebarModule } from 'primeng/sidebar';
-
-import { ColorScheme, LayoutService, MenuColorScheme, MenuMode } from '../../service/app.layout.service';
-import { AppMenuService } from '../../service/app.menu.service';
-
-@Component({
-	standalone: true,
-	selector: 'app-config',
-	imports: [FormsModule, SidebarModule, RadioButtonModule, ButtonModule, InputSwitchModule, NgStyle, NgClass],
-	templateUrl: './app.config.component.html'
-})
-export class AppConfigComponent implements OnInit {
-	@Input() minimal: boolean = false;
-
-	componentThemes: any[] = [];
-
-	scales: number[] = [12, 13, 14, 15, 16];
-
-	constructor(
-		public layoutService: LayoutService,
-		public menuService: AppMenuService
-	) {}
-
-	get visible(): boolean {
-		return this.layoutService.state.configSidebarVisible;
-	}
-	set visible(_val: boolean) {
-		this.layoutService.state.configSidebarVisible = _val;
-	}
-
-	get scale(): number {
-		return this.layoutService.config().scale;
-	}
-	set scale(_val: number) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			scale: _val
-		}));
-	}
-
-	get menuMode(): MenuMode {
-		return this.layoutService.config().menuMode;
-	}
-	set menuMode(_val: MenuMode) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			menuMode: _val
-		}));
-		if (this.layoutService.isSlimPlus() || this.layoutService.isSlim() || this.layoutService.isHorizontal()) {
-			this.menuService.reset();
-		}
-	}
-
-	get colorScheme(): ColorScheme {
-		return this.layoutService.config().colorScheme;
-	}
-	set colorScheme(_val: ColorScheme) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			colorScheme: _val
-		}));
-	}
-
-	get inputStyle(): string {
-		return this.layoutService.config().inputStyle;
-	}
-	set inputStyle(_val: string) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			inputStyle: _val
-		}));
-	}
-
-	get ripple(): boolean {
-		return this.layoutService.config().ripple;
-	}
-	set ripple(_val: boolean) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			ripple: _val
-		}));
-	}
-
-	get menuTheme(): MenuColorScheme {
-		return this.layoutService.config().menuTheme;
-	}
-	set menuTheme(_val: MenuColorScheme) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			menuTheme: _val
-		}));
-	}
-
-	get theme(): string {
-		return this.layoutService.config().theme;
-	}
-	set theme(_val: string) {
-		this.layoutService.config.update((config) => ({
-			...config,
-			theme: _val
-		}));
-	}
-
-	ngOnInit() {
-		this.componentThemes = [
-			{ name: 'indigo', color: '#6366F1' },
-			{ name: 'blue', color: '#3B82F6' },
-			{ name: 'purple', color: '#8B5CF6' },
-			{ name: 'teal', color: '#14B8A6' },
-			{ name: 'cyan', color: '#06b6d4' },
-			{ name: 'green', color: '#10b981' },
-			{ name: 'orange', color: '#f59e0b' },
-			{ name: 'pink', color: '#d946ef' }
-		];
-	}
-
-	onConfigButtonClick() {
-		this.layoutService.showConfigSidebar();
-	}
-
-	changeColorScheme(colorScheme: ColorScheme) {
-		this.colorScheme = colorScheme;
-	}
-
-	changeTheme(theme: string) {
-		this.theme = theme;
-	}
-
-	decrementScale() {
-		this.scale--;
-	}
-
-	incrementScale() {
-		this.scale++;
-	}
-}
+import { NgClass, NgStyle } from '@angular/common';
+import { Component, Input, OnInit } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+
+import { ButtonModule } from 'primeng/button';
+import { InputSwitchModule } from 'primeng/inputswitch';
+import { RadioButtonModule } from 'primeng/radiobutton';
+import { SidebarModule } from 'primeng/sidebar';
+
+import { ColorScheme, LayoutService, MenuColorScheme, MenuMode } from '../../service/app.layout.service';
+import { AppMenuService } from '../../service/app.menu.service';
+
+@Component({
+	standalone: true,
+	selector: 'app-config',
+	imports: [FormsModule, SidebarModule, RadioButtonModule, ButtonModule, InputSwitchModule, NgStyle, NgClass],
+	templateUrl: './app.config.component.html'
+})
+export class AppConfigComponent implements OnInit {
+	@Input() minimal: boolean = false;
+
+	componentThemes: any[] = [];
+
+	scales: number[] = [12, 13, 14, 15, 16];
+
+	constructor(
+		public layoutService: LayoutService,
+		public menuService: AppMenuService
+	) {}
+
+	get visible(): boolean {
+		return this.layoutService.state.configSidebarVisible;
+	}
+	set visible(_val: boolean) {
+		this.layoutService.state.configSidebarVisible = _val;
+	}
+
+	get scale(): number {
+		return this.layoutService.config().scale;
+	}
+	set scale(_val: number) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			scale: _val
+		}));
+	}
+
+	get menuMode(): MenuMode {
+		return this.layoutService.config().menuMode;
+	}
+	set menuMode(_val: MenuMode) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			menuMode: _val
+		}));
+		if (this.layoutService.isSlimPlus() || this.layoutService.isSlim() || this.layoutService.isHorizontal()) {
+			this.menuService.reset();
+		}
+	}
+
+	get colorScheme(): ColorScheme {
+		return this.layoutService.config().colorScheme;
+	}
+	set colorScheme(_val: ColorScheme) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			colorScheme: _val
+		}));
+	}
+
+	get inputStyle(): string {
+		return this.layoutService.config().inputStyle;
+	}
+	set inputStyle(_val: string) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			inputStyle: _val
+		}));
+	}
+
+	get ripple(): boolean {
+		return this.layoutService.config().ripple;
+	}
+	set ripple(_val: boolean) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			ripple: _val
+		}));
+	}
+
+	get menuTheme(): MenuColorScheme {
+		return this.layoutService.config().menuTheme;
+	}
+	set menuTheme(_val: MenuColorScheme) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			menuTheme: _val
+		}));
+	}
+
+	get theme(): string {
+		return this.layoutService.config().theme;
+	}
+	set theme(_val: string) {
+		this.layoutService.config.update((config) => ({
+			...config,
+			theme: _val
+		}));
+	}
+
+	ngOnInit() {
+		this.componentThemes = [
+			{ name: 'indigo', color: '#6366F1' },
+			{ name: 'blue', color: '#3B82F6' },
+			{ name: 'purple', color: '#8B5CF6' },
+			{ name: 'teal', color: '#14B8A6' },
+			{ name: 'cyan', color: '#06b6d4' },
+			{ name: 'green', color: '#10b981' },
+			{ name: 'orange', color: '#f59e0b' },
+			{ name: 'pink', color: '#d946ef' }
+		];
+	}
+
+	onConfigButtonClick() {
+		this.layoutService.showConfigSidebar();
+	}
+
+	changeColorScheme(colorScheme: ColorScheme) {
+		this.colorScheme = colorScheme;
+	}
+
+	changeTheme(theme: string) {
+		this.theme = theme;
+	}
+
+	decrementScale() {
+		this.scale--;
+	}
+
+	incrementScale() {
+		this.scale++;
+	}
+}

package/theme/layout/app/expandableMenu/expandable-menu.component.html

@@ -1,89 +1,89 @@
-<div class="new-layout-sidebar" >
-	<!-- Main sidebar (first level) -->
-	<div class="main-sidebar" style="position: relative;">
-		<div class="main-sidebar-content">
-			<ul class="main-menu">
-				@for(item of getMenuItems(); track item; let i = $index){
-					@if(!item.separator){
-						<li
-						[ngClass]="{'active': isActiveRoute(item) || isHaveSelectedChildItem(item)}"
-						(click)="selectMainItem(i, item)"
-						[pTooltip]="(item.label && activeLang() ? item.label[activeLang()!] || '' : '')"
-						tooltipPosition="right">
-						<div class="main-menu-item">
-							<i [ngClass]="item.icon" class="menu-icon"></i>
-							<!-- <small class="menu-label">{{ item.label && activeLang() ? item.label[activeLang()!] || '' : '' }}</small> -->
-						</div>
-					</li>
-					}
-				}
-			</ul>
-		</div>
-	</div>
-		 @if(selectedMainMenuItem && selectedMainMenuItem.items && selectedMainMenuItem.items.length > 0){
-
-			 <div class="sidebar-toggle-container">
-				 <button class="sidebar-circle-toggle-btn" (click)="toggleSidebar()">
-					 <i class="pi" [ngClass]="sidebarExpanded ? 'pi-angle-left' : 'pi-angle-right'"></i>
-				 </button>
-			 </div>
-		 }
-
-	<!-- Secondary sidebar (second level) -->
-	<div class="secondary-sidebar" [ngClass]="{'expanded': sidebarExpanded}">
-		<div class="secondary-content-wrapper" style="position: relative;">
-			<!-- Secondary sidebar content -->
-			<div class="secondary-sidebar-content">
-				@if(selectedMainMenuItem){
-					<ul class="secondary-menu">
-						@for(subItem of selectedMainMenuItem.items; track subItem; let i = $index){
-								<!-- Create menu item -->
-								<li class="secondary-menu-item" [ngClass]="{'active': isActiveRoute(subItem)}">
-									<a [routerLink]="subItem.routerLink" 
-										class="secondary-menu-link"
-										[pTooltip]="!isMobile() && isTextTruncated(subItem.label, activeLang(), 'secondary') ? (subItem.label && activeLang() ? subItem.label[activeLang()!] || '' : '') : ''"
-										tooltipPosition="right">
-										<i [ngClass]="subItem.icon" class="submenu-icon"></i>
-										<span class="submenu-label">{{ subItem.label && activeLang() ? subItem.label[activeLang()!] || '' : '' }}</span>
-									</a>
-									<!-- Always render submenu if it exists -->
-									 @if(subItem.items && subItem.items.length > 0){
-										 <ul class="tertiary-menu always-open">
-											@for(childItem of subItem.items; track childItem; let i = $index){
-												<li class="tertiary-menu-item" [ngClass]="{'active': isActiveRoute(childItem)}">
-													<a [routerLink]="childItem.routerLink" 
-														class="tertiary-menu-link"
-														[pTooltip]="!isMobile() && isTextTruncated(childItem.label, activeLang(), 'tertiary') ? (childItem.label && activeLang() ? childItem.label[activeLang()!] || '' : '') : ''"
-														tooltipPosition="right">
-														<span class="tertiary-label">{{ childItem.label && activeLang() ? childItem.label[activeLang()!] || '' : '' }}</span>
-													</a>
-													<!-- Always render deeper levels if they exist, also visible by default -->
-													@if(childItem.items && childItem.items.length > 0){
-														<ul class="nested-menu always-open">
-															@for(nestedItem of childItem.items; track nestedItem; let i = $index){
-																<li 
-																	class="nested-menu-item"
-																	[ngClass]="{'active': isActiveRoute(nestedItem)}">
-																	<a [routerLink]="nestedItem.routerLink" 
-																		class="nested-menu-link"
-																		[pTooltip]="!isMobile() && isTextTruncated(nestedItem.label, activeLang(), 'nested') ? (nestedItem.label && activeLang() ? nestedItem.label[activeLang()!] || '' : '') : ''"
-																		tooltipPosition="right">
-																		<span class="nested-label">{{ nestedItem.label && activeLang() ? nestedItem.label[activeLang()!] || '' : '' }}</span>
-																	</a>
-																</li>
-															}
-														</ul>
-													}
-												</li>
-											}
-										 </ul>
-									 }
-								</li>
-						}
-					</ul>
-				}
-			</div>
-		</div>
-	</div>
-	
-</div>
+<div class="new-layout-sidebar" >
+	<!-- Main sidebar (first level) -->
+	<div class="main-sidebar" style="position: relative;">
+		<div class="main-sidebar-content">
+			<ul class="main-menu">
+				@for(item of getMenuItems(); track item; let i = $index){
+					@if(!item.separator){
+						<li
+						[ngClass]="{'active': isActiveRoute(item) || isHaveSelectedChildItem(item)}"
+						(click)="selectMainItem(i, item)"
+						[pTooltip]="(item.label && activeLang() ? item.label[activeLang()!] || '' : '')"
+						tooltipPosition="right">
+						<div class="main-menu-item">
+							<i [ngClass]="item.icon" class="menu-icon"></i>
+							<!-- <small class="menu-label">{{ item.label && activeLang() ? item.label[activeLang()!] || '' : '' }}</small> -->
+						</div>
+					</li>
+					}
+				}
+			</ul>
+		</div>
+	</div>
+		 @if(selectedMainMenuItem && selectedMainMenuItem.items && selectedMainMenuItem.items.length > 0){
+
+			 <div class="sidebar-toggle-container">
+				 <button class="sidebar-circle-toggle-btn" (click)="toggleSidebar()">
+					 <i class="pi" [ngClass]="sidebarExpanded ? 'pi-angle-left' : 'pi-angle-right'"></i>
+				 </button>
+			 </div>
+		 }
+
+	<!-- Secondary sidebar (second level) -->
+	<div class="secondary-sidebar" [ngClass]="{'expanded': sidebarExpanded}">
+		<div class="secondary-content-wrapper" style="position: relative;">
+			<!-- Secondary sidebar content -->
+			<div class="secondary-sidebar-content">
+				@if(selectedMainMenuItem){
+					<ul class="secondary-menu">
+						@for(subItem of selectedMainMenuItem.items; track subItem; let i = $index){
+								<!-- Create menu item -->
+								<li class="secondary-menu-item" [ngClass]="{'active': isActiveRoute(subItem)}">
+									<a [routerLink]="subItem.routerLink" 
+										class="secondary-menu-link"
+										[pTooltip]="!isMobile() && isTextTruncated(subItem.label, activeLang(), 'secondary') ? (subItem.label && activeLang() ? subItem.label[activeLang()!] || '' : '') : ''"
+										tooltipPosition="right">
+										<i [ngClass]="subItem.icon" class="submenu-icon"></i>
+										<span class="submenu-label">{{ subItem.label && activeLang() ? subItem.label[activeLang()!] || '' : '' }}</span>
+									</a>
+									<!-- Always render submenu if it exists -->
+									 @if(subItem.items && subItem.items.length > 0){
+										 <ul class="tertiary-menu always-open">
+											@for(childItem of subItem.items; track childItem; let i = $index){
+												<li class="tertiary-menu-item" [ngClass]="{'active': isActiveRoute(childItem)}">
+													<a [routerLink]="childItem.routerLink" 
+														class="tertiary-menu-link"
+														[pTooltip]="!isMobile() && isTextTruncated(childItem.label, activeLang(), 'tertiary') ? (childItem.label && activeLang() ? childItem.label[activeLang()!] || '' : '') : ''"
+														tooltipPosition="right">
+														<span class="tertiary-label">{{ childItem.label && activeLang() ? childItem.label[activeLang()!] || '' : '' }}</span>
+													</a>
+													<!-- Always render deeper levels if they exist, also visible by default -->
+													@if(childItem.items && childItem.items.length > 0){
+														<ul class="nested-menu always-open">
+															@for(nestedItem of childItem.items; track nestedItem; let i = $index){
+																<li 
+																	class="nested-menu-item"
+																	[ngClass]="{'active': isActiveRoute(nestedItem)}">
+																	<a [routerLink]="nestedItem.routerLink" 
+																		class="nested-menu-link"
+																		[pTooltip]="!isMobile() && isTextTruncated(nestedItem.label, activeLang(), 'nested') ? (nestedItem.label && activeLang() ? nestedItem.label[activeLang()!] || '' : '') : ''"
+																		tooltipPosition="right">
+																		<span class="nested-label">{{ nestedItem.label && activeLang() ? nestedItem.label[activeLang()!] || '' : '' }}</span>
+																	</a>
+																</li>
+															}
+														</ul>
+													}
+												</li>
+											}
+										 </ul>
+									 }
+								</li>
+						}
+					</ul>
+				}
+			</div>
+		</div>
+	</div>
+	
+</div>