@nettyapps/ntybase 0.0.1 → 0.0.3

package/fesm2022/nettyapps-ntybase.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, Injectable, inject, NgModule, Inject, signal, input, output, computed, effect, model, ViewContainerRef, ViewChild, Input, ViewEncapsulation, forwardRef, ChangeDetectionStrategy } from '@angular/core';
+import { Component, Injectable, inject, NgModule, Inject, signal, input, output, computed, effect, model, ViewChild, ViewContainerRef, Input, ViewEncapsulation, forwardRef, ChangeDetectionStrategy } from '@angular/core';
 import * as i1$2 from '@angular/common/http';
 import { HttpErrorResponse, HttpResponse, HTTP_INTERCEPTORS, HttpClient, HttpHeaders } from '@angular/common/http';
 import { of, throwError, lastValueFrom, map, catchError as catchError$1, Subject, finalize, take as take$1, takeUntil } from 'rxjs';
@@ -29,6 +29,7 @@ import * as i3$2 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import * as i3$3 from '@angular/material/menu';
 import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
+import * as XLSX from 'xlsx';
 import * as i1$3 from '@angular/forms';
 import { FormBuilder, Validators, FormsModule, ReactiveFormsModule, FormControl, NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i1$4 from '@angular/material/input';
@@ -458,8 +459,21 @@ class AlertService {
         });
     }
     // For error notifications
-    showError(message, duration = 5000) {
-        this.snackBar.open(this.translate.instant(message), this.translate.instant('@btnOK'), {
+    showError(error, duration = 5000) {
+        let errorMessage;
+        if (typeof error === 'string') {
+            errorMessage = error;
+        }
+        else if (error.message) {
+            errorMessage = error.message;
+        }
+        else if (error.error && typeof error.error === 'string') {
+            errorMessage = error.error;
+        }
+        else {
+            errorMessage = JSON.stringify(error);
+        }
+        this.snackBar.open(this.translate.instant(errorMessage), this.translate.instant('@btnOK'), {
             duration,
             panelClass: ['error-snackbar'],
             horizontalPosition: 'right',
@@ -477,14 +491,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
         }], ctorParameters: () => [{ type: i1$1.MatSnackBar }, { type: i1.MatDialog }, { type: i3$1.TranslateService }] });
 
 class CommonService {
+    // Services
     router = inject(Router);
     location = inject(Location);
     datePipe = inject(DatePipe);
     alertService = inject(AlertService);
+    dialog = inject(MatDialog);
+    // Right sidenav
     rightSidenavOpen = signal(false, ...(ngDevMode ? [{ debugName: "rightSidenavOpen" }] : []));
     toggleRightSidenav(open) {
         this.rightSidenavOpen.set(open);
     }
+    /**
+     * Normalizes Turkish text for search and comparison operations by converting
+     * Turkish special characters to their English equivalents and lowercasing.
+     *
+     */
     normalizeTurkish(text) {
         return text
             .toLocaleLowerCase('tr-TR')
@@ -500,9 +522,42 @@ class CommonService {
      */
     getCleanUrlPath() {
         const tree = this.router.parseUrl(this.router.url);
-        // Remove all fragments and query params
-        return (tree.root.children['primary']?.segments.map((s) => s.path).join('/') ||
-            '/');
+        const segments = tree.root.children['primary']?.segments || [];
+        if (segments.length >= 2) {
+            return segments
+                .slice(0, 2)
+                .map((s) => s.path)
+                .join('/');
+        }
+        return '/';
+    }
+    /**
+     * Clears the right sidenav outlet and resets the UI state.
+     * Removes the right sidenav route while keeping the main content and query parameters.
+     * Also collapses the sidenav and closes any open dialogs.
+     */
+    clearOutlet() {
+        const currentUrl = this.router.parseUrl(this.router.url);
+        const primaryOutlet = currentUrl.root.children['primary'];
+        const rightSidenavOutlet = currentUrl.root.children['rightSidenav'];
+        if (rightSidenavOutlet) {
+            this.router.navigate([
+                {
+                    outlets: {
+                        rightSidenav: null,
+                        primary: primaryOutlet ? primaryOutlet.toString() : null,
+                    },
+                },
+            ], {
+                queryParamsHandling: 'preserve',
+                replaceUrl: true,
+            });
+        }
+        this.toggleRightSidenav(false);
+        this.dialog.closeAll();
+    }
+    ngOnDestroy() {
+        this.clearOutlet();
     }
     /** Merge columns with the given seperator
      *
@@ -927,6 +982,152 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 }]
         }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: i2$1.EnvironmentProxy }] });
 
+class ButtonRenderer {
+    params = null;
+    label = '';
+    type = '';
+    toggleValue = null;
+    editValid = false;
+    historyValid = false;
+    lineValid = false;
+    popupSelectValid = false;
+    popupEditValid = false;
+    toggleValid = false;
+    toggle_icon = '';
+    none = false;
+    addValid = false;
+    deleteValid = false;
+    agInit(params) {
+        this.params = params;
+        this.type = this.params.type || null;
+        this.label = this.params.label || null;
+        this.toggleValue = this.params.value || null;
+        switch (this.toggleValue) {
+            case true:
+                this.toggle_icon = 'select_check_box';
+                break;
+            case false:
+                this.toggle_icon = 'check_box_outline_blank';
+                break;
+            default:
+                this.toggle_icon = '';
+                break;
+        }
+        this.resetValids();
+        switch (this.type.toLowerCase().trim()) {
+            case 'edit':
+                this.editValid = true;
+                break;
+            case 'log':
+                this.historyValid = true;
+                break;
+            case 'line':
+                this.lineValid = true;
+                break;
+            case 'popupselect':
+                this.popupSelectValid = true;
+                break;
+            case 'toggle':
+                this.toggleValid = true;
+                break;
+            case 'none':
+                this.none = true;
+                break;
+            case 'add':
+                this.addValid = true;
+                break;
+            case 'delete':
+                this.deleteValid = true;
+                break;
+            default:
+                this.popupEditValid = true;
+                break;
+        }
+    }
+    /** Refresh the display
+     *
+     * @param params
+     * @returns
+     */
+    refresh(params) {
+        return false;
+    }
+    resetValids() {
+        this.editValid = false;
+        this.historyValid = false;
+        this.lineValid = false;
+        this.popupSelectValid = false;
+        this.popupEditValid = false;
+        this.toggleValid = false;
+    }
+    onClick(event) {
+        if (this.params.onClick instanceof Function) {
+            // put anything into params u want pass into parents component
+            const params = {
+                event: event,
+                rowData: this.params.node.data,
+                type: this.type,
+                // ...something
+            };
+            this.params.onClick(params);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ButtonRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: ButtonRenderer, isStandalone: true, selector: "ntybase-button-renderer", ngImport: i0, template: "<mat-icon\n  *ngIf=\"(editValid || popupEditValid)\"\n  class=\"cursor center edit\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"4000\"\n  >edit</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center-log\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >log</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >history</mat-icon\n>\n<mat-icon\n  *ngIf=\"lineValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"popupSelectValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >content_copy</mat-icon\n>\n<mat-icon\n  *ngIf=\"toggleValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >{{toggleValue ? 'check_box' : 'check_box_outline_blank'}}</mat-icon\n>\n<mat-icon\n  *ngIf=\"none\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"addValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >playlist_add</mat-icon\n>\n<mat-icon\n  *ngIf=\"deleteValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >delete_outline</mat-icon\n>\n", styles: [".cursor{cursor:pointer}.center{display:flex;justify-content:center;align-items:center;width:100%}.center-log{display:flex;justify-content:center;align-items:center;margin-bottom:-12px}.edit{margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ButtonRenderer, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-button-renderer', imports: [MatIconModule, CommonModule, MatTooltipModule, MatMenuModule], template: "<mat-icon\n  *ngIf=\"(editValid || popupEditValid)\"\n  class=\"cursor center edit\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"4000\"\n  >edit</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center-log\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >log</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >history</mat-icon\n>\n<mat-icon\n  *ngIf=\"lineValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"popupSelectValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >content_copy</mat-icon\n>\n<mat-icon\n  *ngIf=\"toggleValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >{{toggleValue ? 'check_box' : 'check_box_outline_blank'}}</mat-icon\n>\n<mat-icon\n  *ngIf=\"none\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"addValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >playlist_add</mat-icon\n>\n<mat-icon\n  *ngIf=\"deleteValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >delete_outline</mat-icon\n>\n", styles: [".cursor{cursor:pointer}.center{display:flex;justify-content:center;align-items:center;width:100%}.center-log{display:flex;justify-content:center;align-items:center;margin-bottom:-12px}.edit{margin-top:8px}\n"] }]
+        }] });
+
+class CheckboxRenderer {
+    params = null;
+    label = '';
+    type = '';
+    supportClick = false;
+    checked = null;
+    agInit(params) {
+        this.onProcess(params);
+    }
+    refresh(params) {
+        if (params != null) {
+            this.onProcess(params);
+        }
+        return true;
+    }
+    onProcess(params) {
+        this.params = params;
+        this.checked = this.params.value ?? false;
+        this.type = this.params.type || null;
+        this.label = this.params.label || null;
+        if (this.type != null) {
+            if (this.type.toLowerCase().trim() == 'click') {
+                this.supportClick = true;
+            }
+        }
+    }
+    onClick(event) {
+        this.checked = !this.checked;
+        if (this.params.onClick instanceof Function) {
+            // put anything into params u want pass into parents component
+            const params = {
+                event: event,
+                rowData: this.params.node.data,
+                type: this.type,
+                checked: this.checked,
+                // ...something
+            };
+            this.params.onClick(params);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CheckboxRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CheckboxRenderer, isStandalone: true, selector: "ntybase-checkbox-renderer", ngImport: i0, template: "<input\n  *ngIf=\"supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"checked\"\n  (click)=\"onClick($event)\"\n/>\n<input\n  *ngIf=\"!supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"params.value\"\n  disabled\n/>\n<label for=\"checkbox\">{{label}}</label>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CheckboxRenderer, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-checkbox-renderer', imports: [CommonModule], template: "<input\n  *ngIf=\"supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"checked\"\n  (click)=\"onClick($event)\"\n/>\n<input\n  *ngIf=\"!supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"params.value\"\n  disabled\n/>\n<label for=\"checkbox\">{{label}}</label>\n" }]
+        }] });
+
 ModuleRegistry.registerModules([
     AllCommunityModule,
     StatusBarModule,
@@ -950,6 +1151,7 @@ class AgGridBase {
     popupFilterValid = input(false, ...(ngDevMode ? [{ debugName: "popupFilterValid" }] : []));
     popupValid = input(false, ...(ngDevMode ? [{ debugName: "popupValid" }] : []));
     params = input('', ...(ngDevMode ? [{ debugName: "params" }] : []));
+    parameters = input('', ...(ngDevMode ? [{ debugName: "parameters" }] : []));
     // Authentication
     authenticationList = [];
     // User access writes
@@ -1012,8 +1214,8 @@ class AgGridBase {
                 sortable: true,
                 resizable: true,
                 filter: true,
-                minWidth: 120,
-                maxWidth: 120,
+                minWidth: 60,
+                maxWidth: 60,
                 suppressSizeToFit: true,
                 colId: 'editColumn',
                 cellRenderer: 'buttonRenderer',
@@ -1231,6 +1433,37 @@ class AgGridBase {
             { statusPanel: 'agAggregationComponent' },
         ],
     };
+    /**
+     * Component initialization lifecycle hook
+     */
+    async ngOnInit() {
+        await this.setAccessRights();
+        const savedSearchValue = sessionStorage.getItem(this.searchValueName());
+        if (savedSearchValue) {
+            this.searchValue.set(savedSearchValue);
+            this.loadData(savedSearchValue);
+        }
+        else {
+            this.loadData();
+        }
+        // Load user grid preferences
+        await this.nettyAgGridService.copyGridUserPereferenceToLocal(this.preferenceType());
+    }
+    /**
+     * Handle input changes for route parameters
+     */
+    ngOnChanges(changes) {
+        if (changes['parameters']) {
+            const parameters = changes['parameters'].currentValue;
+            if (parameters) {
+                this.params =
+                    typeof parameters === 'string' ? JSON.parse(parameters) : parameters;
+            }
+            else {
+                this.commonService.clearOutlet();
+            }
+        }
+    }
     // Common grid ready handler
     onGridReady(params) {
         this.gridApi = params.api;
@@ -1277,32 +1510,6 @@ class AgGridBase {
     backClicked() {
         this.commonService.goBack();
     }
-    async deleteSelected() {
-        if (!this.gridApi)
-            return;
-        const selectedNodes = this.gridApi.getSelectedNodes();
-        if (selectedNodes.length === 0) {
-            await this.alertService.showAlert('@PleaseSelectRowToDelete');
-            return;
-        }
-        const confirmed = await this.alertService.showConfirm('@ConfirmDeleteSelectedRecords');
-        if (confirmed) {
-            const selectedRows = selectedNodes.map((node) => node.data);
-            this.deleteRows(selectedRows);
-        }
-    }
-    async refreshData() {
-        try {
-            const freshData = await this.loadFreshData();
-            if (this.gridApi?.setGridOption) {
-                this.gridApi.setGridOption('rowData', freshData);
-            }
-            await this.alertService.showAlert('@DataRefreshedSuccessfully');
-        }
-        catch (err) {
-            this.alertService.showError(err);
-        }
-    }
     gotoURL(routePrefix, rightSidenav = [], parameters, type, isNewTab = false, embedded = false, dialogComponent) {
         const navigationExtras = {
             queryParams: {
@@ -1333,7 +1540,7 @@ class AgGridBase {
                 .afterClosed()
                 .subscribe((result) => {
                 if (result === 'saved') {
-                    this.refreshData();
+                    this.updateRowInGrid;
                 }
             });
             return;
@@ -1377,6 +1584,10 @@ class AgGridBase {
      *   - The update type doesn't match
      */
     constructor() {
+        this.frameworkComponents = {
+            buttonRenderer: ButtonRenderer,
+            checkboxRenderer: CheckboxRenderer,
+        };
         effect(() => {
             const update = this.commonService.updates();
             if (!update || !this.gridApi)
@@ -1387,9 +1598,6 @@ class AgGridBase {
                     case 'update':
                         this.updateRowInGrid(update.data);
                         break;
-                    case 'delete':
-                        this.deleteRowFromGrid(update.data);
-                        break;
                 }
             }
         });
@@ -1414,12 +1622,28 @@ class AgGridBase {
             this.loadData(); // Reload all data if row not found
         }
     }
-    /**
-     * Delete a row from the grid
-     * @param rowData The row to delete
-     */
-    deleteRowFromGrid(rowData) {
-        this.gridApi.applyTransaction({ remove: [rowData] });
+    async deleteSelected() {
+        if (!this.gridApi)
+            return;
+        const selectedNodes = this.gridApi.getSelectedNodes();
+        if (selectedNodes.length === 0) {
+            await this.alertService.showAlert('@PleaseSelectRowToDelete');
+            return;
+        }
+        const confirmed = await this.alertService.showConfirm('@ConfirmDeleteSelectedRecords');
+        if (confirmed) {
+            const selectedRows = selectedNodes.map((node) => node.data);
+            this.deleteRows?.(selectedRows);
+        }
+    }
+    async refreshData() {
+        try {
+            this.loadData();
+            await this.alertService.showAlert('@DataRefreshedSuccessfully');
+        }
+        catch (err) {
+            this.alertService.showError(err);
+        }
     }
     async setAccessRights() {
         this.authenticationList = await lastValueFrom(this.sysFunctionProxy.getAuthentication(this.componentName())).catch((e) => {
@@ -1458,7 +1682,7 @@ class AgGridBase {
         return true;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AgGridBase, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AgGridBase, isStandalone: true, selector: "ntybase-ag-grid-base", inputs: { readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, popupFilterValid: { classPropertyName: "popupFilterValid", publicName: "popupFilterValid", isSignal: true, isRequired: false, transformFunction: null }, popupValid: { classPropertyName: "popupValid", publicName: "popupValid", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, filterField: { classPropertyName: "filterField", publicName: "filterField", isSignal: true, isRequired: false, transformFunction: null }, filterFieldValue: { classPropertyName: "filterFieldValue", publicName: "filterFieldValue", isSignal: true, isRequired: false, transformFunction: null }, filterFieldNumeric: { classPropertyName: "filterFieldNumeric", publicName: "filterFieldNumeric", isSignal: true, isRequired: false, transformFunction: null }, filterFieldEquality: { classPropertyName: "filterFieldEquality", publicName: "filterFieldEquality", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedElement: "selectedElement" }, ngImport: i0, template: "<p>ag-grid-base works!</p>\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AgGridBase, isStandalone: true, selector: "ntybase-ag-grid-base", inputs: { readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, popupFilterValid: { classPropertyName: "popupFilterValid", publicName: "popupFilterValid", isSignal: true, isRequired: false, transformFunction: null }, popupValid: { classPropertyName: "popupValid", publicName: "popupValid", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, parameters: { classPropertyName: "parameters", publicName: "parameters", isSignal: true, isRequired: false, transformFunction: null }, filterField: { classPropertyName: "filterField", publicName: "filterField", isSignal: true, isRequired: false, transformFunction: null }, filterFieldValue: { classPropertyName: "filterFieldValue", publicName: "filterFieldValue", isSignal: true, isRequired: false, transformFunction: null }, filterFieldNumeric: { classPropertyName: "filterFieldNumeric", publicName: "filterFieldNumeric", isSignal: true, isRequired: false, transformFunction: null }, filterFieldEquality: { classPropertyName: "filterFieldEquality", publicName: "filterFieldEquality", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedElement: "selectedElement" }, usesOnChanges: true, ngImport: i0, template: "<p>ag-grid-base works!</p>\n", styles: [""] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AgGridBase, decorators: [{
             type: Component,
@@ -1471,17 +1695,18 @@ class AgGridSaveBase {
     route = inject(ActivatedRoute);
     commonService = inject(CommonService);
     alertService = inject(AlertService);
+    viewMode = signal('sidenav', ...(ngDevMode ? [{ debugName: "viewMode" }] : []));
+    // Input signals
+    parameters = input('', ...(ngDevMode ? [{ debugName: "parameters" }] : []));
+    embedded = input(false, ...(ngDevMode ? [{ debugName: "embedded" }] : []));
     currentItem = signal({}, ...(ngDevMode ? [{ debugName: "currentItem" }] : []));
     initialItem = {};
     // Form tracking
     formChanged = false;
-    // Signals
-    viewMode = signal('sidenav', ...(ngDevMode ? [{ debugName: "viewMode" }] : []));
+    saveForm;
     // Dialog related properties
     dialogRef = inject((MatDialogRef), { optional: true });
     dialogData = inject(MAT_DIALOG_DATA, { optional: true });
-    // Embedded mode
-    embedded = input(false, ...(ngDevMode ? [{ debugName: "embedded" }] : []));
     // Controls whether the panel should automatically close after saving user data
     closeAfterSave = model(true, ...(ngDevMode ? [{ debugName: "closeAfterSave" }] : []));
     setCloseAfterSave(value) {
@@ -1507,6 +1732,29 @@ class AgGridSaveBase {
             this.viewMode.set('fullscreen');
         }
     }
+    /**
+     * Set data to the form while preserving any unsaved changes
+     * @param item - Data object of type T to populate the form
+     */
+    initializeFormData(item) {
+        // Merge incoming data with current form state to preserve unsaved changes
+        const currentItem = this.currentItem();
+        const updatedItem = { ...currentItem, ...item };
+        // Create a new instance using the factory method
+        const newItem = this.createItemInstance(updatedItem);
+        this.currentItem.set(newItem);
+        // Update initial item reference for change detection
+        this.initialItem = this.createItemInstance(updatedItem);
+        // Reset form changed flag
+        this.formChanged = false;
+    }
+    /**
+     * @param data - Data to populate the new instance
+     */
+    createItemInstance(data) {
+        // Default implementation - child classes can override this
+        return { ...data };
+    }
     /**
      * Check for form changes
      */
@@ -1525,6 +1773,25 @@ class AgGridSaveBase {
         }
         return true;
     }
+    getGuidFromParameters() {
+        if (this.viewMode() === 'dialog' && this.dialogData) {
+            return this.dialogData.parameters || '';
+        }
+        if (this.parameters) {
+            try {
+                return JSON.parse(this.parameters());
+            }
+            catch (e) {
+                return this.parameters();
+            }
+        }
+        return '';
+    }
+    ngOnChanges(changes) {
+        if (changes['parameters']) {
+            this.loadDetailData();
+        }
+    }
     /**
      * Close sidenav or navigate back
      */
@@ -1536,8 +1803,8 @@ class AgGridSaveBase {
             this.router.navigate([{ outlets: { rightSidenav: null } }]);
         }
         else {
-            this.router.navigate(['/sys/NettyUser']);
-            this.commonService.toggleRightSidenav(false);
+            const cleanPath = this.commonService.getCleanUrlPath();
+            this.router.navigate([cleanPath]);
         }
     }
     backClicked() {
@@ -1549,157 +1816,50 @@ class AgGridSaveBase {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AgGridSaveBase, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AgGridSaveBase, isStandalone: true, selector: "ntybase-ag-grid-save-base", inputs: { embedded: { classPropertyName: "embedded", publicName: "embedded", isSignal: true, isRequired: false, transformFunction: null }, closeAfterSave: { classPropertyName: "closeAfterSave", publicName: "closeAfterSave", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeAfterSave: "closeAfterSaveChange" }, ngImport: i0, template: "<p>ag-grid-save-base works!</p>\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AgGridSaveBase, isStandalone: true, selector: "ntybase-ag-grid-save-base", inputs: { parameters: { classPropertyName: "parameters", publicName: "parameters", isSignal: true, isRequired: false, transformFunction: null }, embedded: { classPropertyName: "embedded", publicName: "embedded", isSignal: true, isRequired: false, transformFunction: null }, closeAfterSave: { classPropertyName: "closeAfterSave", publicName: "closeAfterSave", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeAfterSave: "closeAfterSaveChange" }, viewQueries: [{ propertyName: "saveForm", first: true, predicate: ["saveForm"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p>ag-grid-save-base works!</p>\n", styles: [""] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AgGridSaveBase, decorators: [{
             type: Component,
             args: [{ selector: 'ntybase-ag-grid-save-base', imports: [], template: "<p>ag-grid-save-base works!</p>\n" }]
-        }] });
-
-class ButtonRenderer {
-    params = null;
-    label = '';
-    type = '';
-    toggleValue = null;
-    editValid = false;
-    historyValid = false;
-    lineValid = false;
-    popupSelectValid = false;
-    popupEditValid = false;
-    toggleValid = false;
-    toggle_icon = '';
-    none = false;
-    addValid = false;
-    deleteValid = false;
-    agInit(params) {
-        this.params = params;
-        this.type = this.params.type || null;
-        this.label = this.params.label || null;
-        this.toggleValue = this.params.value || null;
-        switch (this.toggleValue) {
-            case true:
-                this.toggle_icon = 'select_check_box';
-                break;
-            case false:
-                this.toggle_icon = 'check_box_outline_blank';
-                break;
-            default:
-                this.toggle_icon = '';
-                break;
-        }
-        this.resetValids();
-        switch (this.type.toLowerCase().trim()) {
-            case 'edit':
-                this.editValid = true;
-                break;
-            case 'log':
-                this.historyValid = true;
-                break;
-            case 'line':
-                this.lineValid = true;
-                break;
-            case 'popupselect':
-                this.popupSelectValid = true;
-                break;
-            case 'toggle':
-                this.toggleValid = true;
-                break;
-            case 'none':
-                this.none = true;
-                break;
-            case 'add':
-                this.addValid = true;
-                break;
-            case 'delete':
-                this.deleteValid = true;
-                break;
-            default:
-                this.popupEditValid = true;
-                break;
-        }
-    }
-    /** Refresh the display
-     *
-     * @param params
-     * @returns
-     */
-    refresh(params) {
-        return false;
-    }
-    resetValids() {
-        this.editValid = false;
-        this.historyValid = false;
-        this.lineValid = false;
-        this.popupSelectValid = false;
-        this.popupEditValid = false;
-        this.toggleValid = false;
-    }
-    onClick(event) {
-        if (this.params.onClick instanceof Function) {
-            // put anything into params u want pass into parents component
-            const params = {
-                event: event,
-                rowData: this.params.node.data,
-                type: this.type,
-                // ...something
-            };
-            this.params.onClick(params);
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ButtonRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: ButtonRenderer, isStandalone: true, selector: "ntybase-button-renderer", ngImport: i0, template: "<mat-icon\n  *ngIf=\"(editValid || popupEditValid)\"\n  class=\"cursor center edit\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"4000\"\n  >edit</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center-log\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >log</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >history</mat-icon\n>\n<mat-icon\n  *ngIf=\"lineValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"popupSelectValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >content_copy</mat-icon\n>\n<mat-icon\n  *ngIf=\"toggleValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >{{toggleValue ? 'check_box' : 'check_box_outline_blank'}}</mat-icon\n>\n<mat-icon\n  *ngIf=\"none\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"addValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >playlist_add</mat-icon\n>\n<mat-icon\n  *ngIf=\"deleteValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >delete_outline</mat-icon\n>\n", styles: [".cursor{cursor:pointer}.center{display:flex;justify-content:center;align-items:center;width:100%}.center-log{display:flex;justify-content:center;align-items:center;margin-bottom:-12px}.edit{margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ButtonRenderer, decorators: [{
-            type: Component,
-            args: [{ selector: 'ntybase-button-renderer', imports: [MatIconModule, CommonModule, MatTooltipModule, MatMenuModule], template: "<mat-icon\n  *ngIf=\"(editValid || popupEditValid)\"\n  class=\"cursor center edit\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"4000\"\n  >edit</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center-log\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >log</mat-icon\n>\n\n<mat-icon\n  *ngIf=\"historyValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >history</mat-icon\n>\n<mat-icon\n  *ngIf=\"lineValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"popupSelectValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >content_copy</mat-icon\n>\n<mat-icon\n  *ngIf=\"toggleValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >{{toggleValue ? 'check_box' : 'check_box_outline_blank'}}</mat-icon\n>\n<mat-icon\n  *ngIf=\"none\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  [matTooltipShowDelay]=\"3000\"\n  >menu_open</mat-icon\n>\n<mat-icon\n  *ngIf=\"addValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >playlist_add</mat-icon\n>\n<mat-icon\n  *ngIf=\"deleteValid\"\n  class=\"cursor center\"\n  matTooltip=\"{{label}}\"\n  (click)=\"onClick($event)\"\n  [matTooltipShowDelay]=\"3000\"\n  >delete_outline</mat-icon\n>\n", styles: [".cursor{cursor:pointer}.center{display:flex;justify-content:center;align-items:center;width:100%}.center-log{display:flex;justify-content:center;align-items:center;margin-bottom:-12px}.edit{margin-top:8px}\n"] }]
-        }] });
+        }], propDecorators: { saveForm: [{
+                type: ViewChild,
+                args: ['saveForm']
+            }] } });
 
-class CheckboxRenderer {
-    params = null;
-    label = '';
-    type = '';
-    supportClick = false;
-    checked = null;
-    agInit(params) {
-        this.onProcess(params);
-    }
-    refresh(params) {
-        if (params != null) {
-            this.onProcess(params);
-        }
-        return true;
-    }
-    onProcess(params) {
-        this.params = params;
-        this.checked = this.params.value ?? false;
-        this.type = this.params.type || null;
-        this.label = this.params.label || null;
-        if (this.type != null) {
-            if (this.type.toLowerCase().trim() == 'click') {
-                this.supportClick = true;
-            }
-        }
-    }
-    onClick(event) {
-        this.checked = !this.checked;
-        if (this.params.onClick instanceof Function) {
-            // put anything into params u want pass into parents component
-            const params = {
-                event: event,
-                rowData: this.params.node.data,
-                type: this.type,
-                checked: this.checked,
-                // ...something
-            };
-            this.params.onClick(params);
-        }
+class ExcelImportBase extends AgGridBase {
+    dataList = [];
+    wopts = { bookType: 'xlsx', type: 'array' };
+    fileName = 'PayrollJournalTrans.xlsx';
+    isDataValidated = false;
+    /*******************************
+     *** EXCEL UPLOAD FUNCTIONS  ***
+     *******************************/
+    onFileChange(evt) {
+        /* wire up file reader */
+        const target = evt.target;
+        if (target.files.length !== 1) {
+            throw new Error('Cannot use multiple files');
+        }
+        const reader = new FileReader();
+        reader.onload = (e) => {
+            /* read workbook */
+            const bstr = e.target.result;
+            const wb = XLSX.read(bstr, { type: 'binary' });
+            /* grab first sheet */
+            const wsname = wb.SheetNames[0];
+            const ws = wb.Sheets[wsname];
+            /* save data */
+            this.dataList = XLSX.utils.sheet_to_json(ws, { header: 1 });
+            console.log('dataList:', this.dataList);
+        };
+        reader.readAsBinaryString(target.files[0]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CheckboxRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CheckboxRenderer, isStandalone: true, selector: "ntybase-checkbox-renderer", ngImport: i0, template: "<input\n  *ngIf=\"supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"checked\"\n  (click)=\"onClick($event)\"\n/>\n<input\n  *ngIf=\"!supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"params.value\"\n  disabled\n/>\n<label for=\"checkbox\">{{label}}</label>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ExcelImportBase, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: ExcelImportBase, isStandalone: true, selector: "ntybase-excel-import-base", usesInheritance: true, ngImport: i0, template: "<p>excel-import-base works!</p>\n", styles: [""] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CheckboxRenderer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ExcelImportBase, decorators: [{
             type: Component,
-            args: [{ selector: 'ntybase-checkbox-renderer', imports: [CommonModule], template: "<input\n  *ngIf=\"supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"checked\"\n  (click)=\"onClick($event)\"\n/>\n<input\n  *ngIf=\"!supportClick\"\n  id=\"checkbox\"\n  type=\"checkbox\"\n  [checked]=\"params.value\"\n  disabled\n/>\n<label for=\"checkbox\">{{label}}</label>\n" }]
+            args: [{ selector: 'ntybase-excel-import-base', imports: [], template: "<p>excel-import-base works!</p>\n" }]
         }] });
 
 class AuthenticationGuard {
@@ -2636,7 +2796,7 @@ class LeftSidenav {
         this.searchTerm.set(term);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LeftSidenav, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: LeftSidenav, isStandalone: true, selector: "ntybase-left-sidenav", inputs: { isMinimized: { classPropertyName: "isMinimized", publicName: "isMinimized", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggleMinimize: "toggleMinimize" }, ngImport: i0, template: "<div class=\"sidenav-content-wrapper\">\n  <!-- Minimize Icon -->\n  <button mat-icon-button (click)=\"onToggleMinimize()\" class=\"minimize-button\">\n    <mat-icon class=\"minimize-icon\">\n      {{ isMinimized() ? \"chevron_right\" : \"chevron_left\" }}\n    </mat-icon>\n  </button>\n\n  <!-- Profile -->\n  <div class=\"profile-section\">\n    <button mat-button [matMenuTriggerFor]=\"profileMenu\" class=\"profile-button\">\n      <img\n        src=\"https://images.unsplash.com/photo-1654110455429-cf322b40a906?q=80&w=2080&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\"\n        alt=\"Profil Image\"\n        class=\"profile-image\"\n      />\n      <div class=\"profile-info\" *ngIf=\"!isMinimized()\">\n        <p class=\"profile-name\">Mustafa Samet \u00C7al\u0131\u015F\u0131r</p>\n      </div>\n    </button>\n\n    <mat-menu #profileMenu=\"matMenu\" xPosition=\"before\">\n      <button mat-menu-item>\n        <mat-icon>account_circle</mat-icon>\n        <span>{{ '@profile' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button (click)=\"logout()\">\n        <mat-icon>logout</mat-icon>\n        <span>{{ '@logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  </div>\n\n  <!-- Search Input -->\n  <ntyui-search-input\n    [label]=\"'@search' | translate\"\n    [placeholder]=\"'@placeholderSearch' | translate\"\n    [appearance]=\"'outline'\"\n    *ngIf=\"!isMinimized()\"\n    (search)=\"onSearch($event)\"\n  >\n  </ntyui-search-input>\n\n  <!-- Menu -->\n  <mat-nav-list *ngIf=\"!isMinimized()\">\n    <div class=\"sidebar\">\n      <ul>\n        <ng-container *ngFor=\"let item of filteredMenuItems()\">\n          <li>\n            <a\n              *ngIf=\"!item.children || item.children.length === 0\"\n              [routerLink]=\"item.link\"\n              routerLinkActive=\"active\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n            </a>\n\n            <a\n              *ngIf=\"item.children && item.children.length > 0\"\n              (click)=\"toggleSubMenu(item)\"\n              [class.expanded]=\"item.expanded\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n              <mat-icon [class.rotated]=\"item.expanded\">\n                {{ item.expanded ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </a>\n\n            <ul\n              *ngIf=\"item.children && item.children.length > 0 && item.expanded\"\n              class=\"submenu\"\n            >\n              <li *ngFor=\"let child of item.children\">\n                <a [routerLink]=\"child.link\" routerLinkActive=\"active\">\n                  <mat-icon>{{ child.icon }}</mat-icon>\n                  <span>{{ child.name }}</span>\n                </a>\n              </li>\n            </ul>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n  </mat-nav-list>\n\n  <!-- Footer -->\n  <div class=\"sidenav-footer\">\n    <button mat-button [matMenuTriggerFor]=\"footerMenu\" class=\"footer-button\">\n      <div class=\"footer-text\" *ngIf=\"!isMinimized()\">\n        <div class=\"company-name\">\n          <p>&copy; 2025 AXIS</p>\n        </div>\n      </div>\n    </button>\n    <div class=\"version\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n\n  <mat-menu #footerMenu=\"matMenu\" xPosition=\"before\">\n    <button mat-menu-item>\n      <mat-icon>swap_horiz</mat-icon>\n      {{ '@changeCompany' | translate }}\n    </button>\n    <button mat-menu-item mat-button (click)=\"logout()\">\n      <mat-icon>logout</mat-icon>\n      <span>{{ '@logout' | translate }}</span>\n    </button>\n  </mat-menu>\n</div>\n", styles: [".profile-section{text-align:center;border-bottom:1px solid #e0e0e0;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;flex-direction:column;position:relative}.profile-section:hover{transform:scale(.98)}.profile-section .profile-button{display:flex;flex-direction:column;align-items:center;background:none;border:none;padding:0;cursor:pointer;width:100%}.profile-image{width:80px;height:80px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:3px solid white;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.profile-name{font-weight:500;font-size:1rem;color:inherit;transition:opacity .3s ease;margin-top:8px}:host-context(.minimized) .profile-section{padding:10px 0}:host-context(.minimized) .profile-image{width:40px;height:40px;margin:0 auto}.sidenav-footer{position:static;bottom:0;left:0;right:0;padding:16px;color:inherit;font-size:12px;border-top:1px solid rgba(0,0,0,.1);transition:all .3s ease;display:flex;align-items:center;justify-content:space-between;margin-top:auto}.sidenav-footer .version{font-size:10px;margin-top:4px}.footer-button{border:none;background:none;cursor:pointer}:host-context(.minimized) .version{margin-right:7px}:host-context(.minimized) .sidenav-content-wrapper{overflow:hidden}.sidenav-content-wrapper{position:relative;height:100%;display:flex;flex-direction:column;overflow-x:hidden}.sidebar{flex:1;overflow:auto}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar li{margin-bottom:4px;position:relative}.sidebar li a{display:flex;align-items:center;padding:12px 0 0;border-radius:6px;color:var(--mat-sys-primary);text-decoration:none;transition:all .2s ease;position:relative;overflow:hidden}.sidebar li a:hover{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text)}.sidebar li a.active{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text);font-weight:500}.sidebar li a.active:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--mat-sys-user-info);border-radius:3px 0 0 3px}.sidebar mat-icon{font-size:20px;width:20px;height:20px;color:inherit}.sidebar span{font-size:.875rem;white-space:nowrap}.submenu{padding-left:12px;margin-top:4px}.submenu li a{padding:10px 16px 0 20px}.submenu mat-icon{font-size:18px}.sidebar li a mat-icon:last-child{margin-left:auto;margin-right:0;font-size:18px;color:#5f6368}:host-context(.minimized) .sidebar li a{justify-content:center;padding:12px 0}:host-context(.minimized) .sidebar mat-icon{margin-right:0}:host-context(.minimized) .sidebar span,:host-context(.minimized) .sidebar li a mat-icon:last-child{display:none}:host-context(.minimized) .submenu{display:none}.sidenav-content-wrapper button[mat-icon-button]{position:absolute;right:-8px;top:10%;z-index:5}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i3$4.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: SearchInput, selector: "ntyui-search-input", outputs: ["search"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: LeftSidenav, isStandalone: true, selector: "ntybase-left-sidenav", inputs: { isMinimized: { classPropertyName: "isMinimized", publicName: "isMinimized", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggleMinimize: "toggleMinimize" }, ngImport: i0, template: "<div class=\"sidenav-content-wrapper\">\n  <!-- Minimize Icon -->\n  <button mat-icon-button (click)=\"onToggleMinimize()\" class=\"minimize-button\">\n    <mat-icon class=\"minimize-icon\">\n      {{ isMinimized() ? \"chevron_right\" : \"chevron_left\" }}\n    </mat-icon>\n  </button>\n\n  <!-- Profile -->\n  <div class=\"profile-section\">\n    <button mat-button [matMenuTriggerFor]=\"profileMenu\" class=\"profile-button\">\n      <img\n        src=\"https://images.unsplash.com/photo-1654110455429-cf322b40a906?q=80&w=2080&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\"\n        alt=\"Profil Image\"\n        class=\"profile-image\"\n      />\n      <div class=\"profile-info\" *ngIf=\"!isMinimized()\">\n        <p class=\"profile-name\">Mustafa Samet \u00C7al\u0131\u015F\u0131r</p>\n      </div>\n    </button>\n\n    <mat-menu #profileMenu=\"matMenu\" xPosition=\"before\">\n      <button mat-menu-item disabled>\n        <mat-icon>account_circle</mat-icon>\n        <span>{{ '@profile' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button disabled>\n        <mat-icon>swap_horiz</mat-icon>\n        <span>{{ '@changeCompany' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button (click)=\"logout()\">\n        <mat-icon>logout</mat-icon>\n        <span>{{ '@logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  </div>\n\n  <!-- Search Input -->\n  <ntyui-search-input\n    [label]=\"'@search' | translate\"\n    [placeholder]=\"'@placeholderSearch' | translate\"\n    [appearance]=\"'outline'\"\n    *ngIf=\"!isMinimized()\"\n    (search)=\"onSearch($event)\"\n  >\n  </ntyui-search-input>\n\n  <!-- Menu -->\n  <mat-nav-list *ngIf=\"!isMinimized()\">\n    <div class=\"sidebar\">\n      <ul>\n        <ng-container *ngFor=\"let item of filteredMenuItems()\">\n          <li>\n            <a\n              *ngIf=\"!item.children || item.children.length === 0\"\n              [routerLink]=\"item.link\"\n              routerLinkActive=\"active\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n            </a>\n\n            <a\n              *ngIf=\"item.children && item.children.length > 0\"\n              (click)=\"toggleSubMenu(item)\"\n              [class.expanded]=\"item.expanded\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n              <mat-icon [class.rotated]=\"item.expanded\">\n                {{ item.expanded ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </a>\n\n            <ul\n              *ngIf=\"item.children && item.children.length > 0 && item.expanded\"\n              class=\"submenu\"\n            >\n              <li *ngFor=\"let child of item.children\">\n                <a [routerLink]=\"child.link\" routerLinkActive=\"active\">\n                  <mat-icon>{{ child.icon }}</mat-icon>\n                  <span>{{ child.name }}</span>\n                </a>\n              </li>\n            </ul>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n  </mat-nav-list>\n\n  <!-- Footer -->\n  <div class=\"sidenav-footer\">\n    <button mat-button [matMenuTriggerFor]=\"footerMenu\" class=\"footer-button\">\n      <div class=\"footer-text\" *ngIf=\"!isMinimized()\">\n        <div class=\"company-name\">\n          <p>&copy; 2025 AXIS</p>\n        </div>\n      </div>\n    </button>\n    <div class=\"version\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n\n  <mat-menu #footerMenu=\"matMenu\" xPosition=\"before\">\n    <button mat-menu-item disabled>\n      <mat-icon>swap_horiz</mat-icon>\n      {{ '@changeCompany' | translate }}\n    </button>\n    <button mat-menu-item mat-button (click)=\"logout()\">\n      <mat-icon>logout</mat-icon>\n      <span>{{ '@logout' | translate }}</span>\n    </button>\n  </mat-menu>\n</div>\n", styles: [".profile-section{text-align:center;border-bottom:1px solid #e0e0e0;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;flex-direction:column;position:relative}.profile-section:hover{transform:scale(.98)}.profile-section .profile-button{display:flex;flex-direction:column;align-items:center;background:none;border:none;padding:0;cursor:pointer;width:100%}.profile-image{width:80px;height:80px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:3px solid white;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.profile-name{font-weight:500;font-size:1rem;color:inherit;transition:opacity .3s ease;margin-top:8px}:host-context(.minimized) .profile-section{padding:10px 0}:host-context(.minimized) .profile-image{width:40px;height:40px;margin:0 auto}.sidenav-footer{position:static;bottom:0;left:0;right:0;padding:16px;color:inherit;font-size:12px;border-top:1px solid rgba(0,0,0,.1);transition:all .3s ease;display:flex;align-items:center;justify-content:space-between;margin-top:auto}.sidenav-footer .version{font-size:10px;margin-top:4px}.footer-button{border:none;background:none;cursor:pointer}:host-context(.minimized) .version{margin-right:7px}:host-context(.minimized) .sidenav-content-wrapper{overflow:hidden}.sidenav-content-wrapper{position:relative;height:100%;display:flex;flex-direction:column;overflow-x:hidden}.sidebar{flex:1;overflow:auto}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar li{margin-bottom:4px;position:relative}.sidebar li a{display:flex;align-items:center;padding:12px 0 0;border-radius:6px;color:var(--mat-sys-primary);text-decoration:none;transition:all .2s ease;position:relative;overflow:hidden}.sidebar li a:hover{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text)}.sidebar li a.active{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text);font-weight:500}.sidebar li a.active:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--mat-sys-user-info);border-radius:3px 0 0 3px}.sidebar mat-icon{font-size:20px;width:20px;height:20px;color:inherit}.sidebar span{font-size:.875rem;white-space:nowrap}.submenu{padding-left:12px;margin-top:4px}.submenu li a{padding:10px 16px 0 20px}.submenu mat-icon{font-size:18px}.sidebar li a mat-icon:last-child{margin-left:auto;margin-right:0;font-size:18px;color:#5f6368}:host-context(.minimized) .sidebar li a{justify-content:center;padding:12px 0}:host-context(.minimized) .sidebar mat-icon{margin-right:0}:host-context(.minimized) .sidebar span,:host-context(.minimized) .sidebar li a mat-icon:last-child{display:none}:host-context(.minimized) .submenu{display:none}.sidenav-content-wrapper button[mat-icon-button]{position:absolute;right:-8px;top:10%;z-index:5}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i3$4.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: SearchInput, selector: "ntyui-search-input", outputs: ["search"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LeftSidenav, decorators: [{
             type: Component,
@@ -2650,7 +2810,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                         RouterModule,
                         SearchInput,
                         TranslateModule,
-                    ], template: "<div class=\"sidenav-content-wrapper\">\n  <!-- Minimize Icon -->\n  <button mat-icon-button (click)=\"onToggleMinimize()\" class=\"minimize-button\">\n    <mat-icon class=\"minimize-icon\">\n      {{ isMinimized() ? \"chevron_right\" : \"chevron_left\" }}\n    </mat-icon>\n  </button>\n\n  <!-- Profile -->\n  <div class=\"profile-section\">\n    <button mat-button [matMenuTriggerFor]=\"profileMenu\" class=\"profile-button\">\n      <img\n        src=\"https://images.unsplash.com/photo-1654110455429-cf322b40a906?q=80&w=2080&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\"\n        alt=\"Profil Image\"\n        class=\"profile-image\"\n      />\n      <div class=\"profile-info\" *ngIf=\"!isMinimized()\">\n        <p class=\"profile-name\">Mustafa Samet \u00C7al\u0131\u015F\u0131r</p>\n      </div>\n    </button>\n\n    <mat-menu #profileMenu=\"matMenu\" xPosition=\"before\">\n      <button mat-menu-item>\n        <mat-icon>account_circle</mat-icon>\n        <span>{{ '@profile' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button (click)=\"logout()\">\n        <mat-icon>logout</mat-icon>\n        <span>{{ '@logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  </div>\n\n  <!-- Search Input -->\n  <ntyui-search-input\n    [label]=\"'@search' | translate\"\n    [placeholder]=\"'@placeholderSearch' | translate\"\n    [appearance]=\"'outline'\"\n    *ngIf=\"!isMinimized()\"\n    (search)=\"onSearch($event)\"\n  >\n  </ntyui-search-input>\n\n  <!-- Menu -->\n  <mat-nav-list *ngIf=\"!isMinimized()\">\n    <div class=\"sidebar\">\n      <ul>\n        <ng-container *ngFor=\"let item of filteredMenuItems()\">\n          <li>\n            <a\n              *ngIf=\"!item.children || item.children.length === 0\"\n              [routerLink]=\"item.link\"\n              routerLinkActive=\"active\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n            </a>\n\n            <a\n              *ngIf=\"item.children && item.children.length > 0\"\n              (click)=\"toggleSubMenu(item)\"\n              [class.expanded]=\"item.expanded\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n              <mat-icon [class.rotated]=\"item.expanded\">\n                {{ item.expanded ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </a>\n\n            <ul\n              *ngIf=\"item.children && item.children.length > 0 && item.expanded\"\n              class=\"submenu\"\n            >\n              <li *ngFor=\"let child of item.children\">\n                <a [routerLink]=\"child.link\" routerLinkActive=\"active\">\n                  <mat-icon>{{ child.icon }}</mat-icon>\n                  <span>{{ child.name }}</span>\n                </a>\n              </li>\n            </ul>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n  </mat-nav-list>\n\n  <!-- Footer -->\n  <div class=\"sidenav-footer\">\n    <button mat-button [matMenuTriggerFor]=\"footerMenu\" class=\"footer-button\">\n      <div class=\"footer-text\" *ngIf=\"!isMinimized()\">\n        <div class=\"company-name\">\n          <p>&copy; 2025 AXIS</p>\n        </div>\n      </div>\n    </button>\n    <div class=\"version\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n\n  <mat-menu #footerMenu=\"matMenu\" xPosition=\"before\">\n    <button mat-menu-item>\n      <mat-icon>swap_horiz</mat-icon>\n      {{ '@changeCompany' | translate }}\n    </button>\n    <button mat-menu-item mat-button (click)=\"logout()\">\n      <mat-icon>logout</mat-icon>\n      <span>{{ '@logout' | translate }}</span>\n    </button>\n  </mat-menu>\n</div>\n", styles: [".profile-section{text-align:center;border-bottom:1px solid #e0e0e0;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;flex-direction:column;position:relative}.profile-section:hover{transform:scale(.98)}.profile-section .profile-button{display:flex;flex-direction:column;align-items:center;background:none;border:none;padding:0;cursor:pointer;width:100%}.profile-image{width:80px;height:80px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:3px solid white;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.profile-name{font-weight:500;font-size:1rem;color:inherit;transition:opacity .3s ease;margin-top:8px}:host-context(.minimized) .profile-section{padding:10px 0}:host-context(.minimized) .profile-image{width:40px;height:40px;margin:0 auto}.sidenav-footer{position:static;bottom:0;left:0;right:0;padding:16px;color:inherit;font-size:12px;border-top:1px solid rgba(0,0,0,.1);transition:all .3s ease;display:flex;align-items:center;justify-content:space-between;margin-top:auto}.sidenav-footer .version{font-size:10px;margin-top:4px}.footer-button{border:none;background:none;cursor:pointer}:host-context(.minimized) .version{margin-right:7px}:host-context(.minimized) .sidenav-content-wrapper{overflow:hidden}.sidenav-content-wrapper{position:relative;height:100%;display:flex;flex-direction:column;overflow-x:hidden}.sidebar{flex:1;overflow:auto}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar li{margin-bottom:4px;position:relative}.sidebar li a{display:flex;align-items:center;padding:12px 0 0;border-radius:6px;color:var(--mat-sys-primary);text-decoration:none;transition:all .2s ease;position:relative;overflow:hidden}.sidebar li a:hover{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text)}.sidebar li a.active{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text);font-weight:500}.sidebar li a.active:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--mat-sys-user-info);border-radius:3px 0 0 3px}.sidebar mat-icon{font-size:20px;width:20px;height:20px;color:inherit}.sidebar span{font-size:.875rem;white-space:nowrap}.submenu{padding-left:12px;margin-top:4px}.submenu li a{padding:10px 16px 0 20px}.submenu mat-icon{font-size:18px}.sidebar li a mat-icon:last-child{margin-left:auto;margin-right:0;font-size:18px;color:#5f6368}:host-context(.minimized) .sidebar li a{justify-content:center;padding:12px 0}:host-context(.minimized) .sidebar mat-icon{margin-right:0}:host-context(.minimized) .sidebar span,:host-context(.minimized) .sidebar li a mat-icon:last-child{display:none}:host-context(.minimized) .submenu{display:none}.sidenav-content-wrapper button[mat-icon-button]{position:absolute;right:-8px;top:10%;z-index:5}\n"] }]
+                    ], template: "<div class=\"sidenav-content-wrapper\">\n  <!-- Minimize Icon -->\n  <button mat-icon-button (click)=\"onToggleMinimize()\" class=\"minimize-button\">\n    <mat-icon class=\"minimize-icon\">\n      {{ isMinimized() ? \"chevron_right\" : \"chevron_left\" }}\n    </mat-icon>\n  </button>\n\n  <!-- Profile -->\n  <div class=\"profile-section\">\n    <button mat-button [matMenuTriggerFor]=\"profileMenu\" class=\"profile-button\">\n      <img\n        src=\"https://images.unsplash.com/photo-1654110455429-cf322b40a906?q=80&w=2080&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\"\n        alt=\"Profil Image\"\n        class=\"profile-image\"\n      />\n      <div class=\"profile-info\" *ngIf=\"!isMinimized()\">\n        <p class=\"profile-name\">Mustafa Samet \u00C7al\u0131\u015F\u0131r</p>\n      </div>\n    </button>\n\n    <mat-menu #profileMenu=\"matMenu\" xPosition=\"before\">\n      <button mat-menu-item disabled>\n        <mat-icon>account_circle</mat-icon>\n        <span>{{ '@profile' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button disabled>\n        <mat-icon>swap_horiz</mat-icon>\n        <span>{{ '@changeCompany' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button (click)=\"logout()\">\n        <mat-icon>logout</mat-icon>\n        <span>{{ '@logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  </div>\n\n  <!-- Search Input -->\n  <ntyui-search-input\n    [label]=\"'@search' | translate\"\n    [placeholder]=\"'@placeholderSearch' | translate\"\n    [appearance]=\"'outline'\"\n    *ngIf=\"!isMinimized()\"\n    (search)=\"onSearch($event)\"\n  >\n  </ntyui-search-input>\n\n  <!-- Menu -->\n  <mat-nav-list *ngIf=\"!isMinimized()\">\n    <div class=\"sidebar\">\n      <ul>\n        <ng-container *ngFor=\"let item of filteredMenuItems()\">\n          <li>\n            <a\n              *ngIf=\"!item.children || item.children.length === 0\"\n              [routerLink]=\"item.link\"\n              routerLinkActive=\"active\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n            </a>\n\n            <a\n              *ngIf=\"item.children && item.children.length > 0\"\n              (click)=\"toggleSubMenu(item)\"\n              [class.expanded]=\"item.expanded\"\n            >\n              <mat-icon>{{ item.icon }}</mat-icon>\n              <span>{{ item.name }}</span>\n              <mat-icon [class.rotated]=\"item.expanded\">\n                {{ item.expanded ? 'expand_less' : 'expand_more' }}\n              </mat-icon>\n            </a>\n\n            <ul\n              *ngIf=\"item.children && item.children.length > 0 && item.expanded\"\n              class=\"submenu\"\n            >\n              <li *ngFor=\"let child of item.children\">\n                <a [routerLink]=\"child.link\" routerLinkActive=\"active\">\n                  <mat-icon>{{ child.icon }}</mat-icon>\n                  <span>{{ child.name }}</span>\n                </a>\n              </li>\n            </ul>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n  </mat-nav-list>\n\n  <!-- Footer -->\n  <div class=\"sidenav-footer\">\n    <button mat-button [matMenuTriggerFor]=\"footerMenu\" class=\"footer-button\">\n      <div class=\"footer-text\" *ngIf=\"!isMinimized()\">\n        <div class=\"company-name\">\n          <p>&copy; 2025 AXIS</p>\n        </div>\n      </div>\n    </button>\n    <div class=\"version\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n\n  <mat-menu #footerMenu=\"matMenu\" xPosition=\"before\">\n    <button mat-menu-item disabled>\n      <mat-icon>swap_horiz</mat-icon>\n      {{ '@changeCompany' | translate }}\n    </button>\n    <button mat-menu-item mat-button (click)=\"logout()\">\n      <mat-icon>logout</mat-icon>\n      <span>{{ '@logout' | translate }}</span>\n    </button>\n  </mat-menu>\n</div>\n", styles: [".profile-section{text-align:center;border-bottom:1px solid #e0e0e0;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;flex-direction:column;position:relative}.profile-section:hover{transform:scale(.98)}.profile-section .profile-button{display:flex;flex-direction:column;align-items:center;background:none;border:none;padding:0;cursor:pointer;width:100%}.profile-image{width:80px;height:80px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:3px solid white;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.profile-name{font-weight:500;font-size:1rem;color:inherit;transition:opacity .3s ease;margin-top:8px}:host-context(.minimized) .profile-section{padding:10px 0}:host-context(.minimized) .profile-image{width:40px;height:40px;margin:0 auto}.sidenav-footer{position:static;bottom:0;left:0;right:0;padding:16px;color:inherit;font-size:12px;border-top:1px solid rgba(0,0,0,.1);transition:all .3s ease;display:flex;align-items:center;justify-content:space-between;margin-top:auto}.sidenav-footer .version{font-size:10px;margin-top:4px}.footer-button{border:none;background:none;cursor:pointer}:host-context(.minimized) .version{margin-right:7px}:host-context(.minimized) .sidenav-content-wrapper{overflow:hidden}.sidenav-content-wrapper{position:relative;height:100%;display:flex;flex-direction:column;overflow-x:hidden}.sidebar{flex:1;overflow:auto}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar li{margin-bottom:4px;position:relative}.sidebar li a{display:flex;align-items:center;padding:12px 0 0;border-radius:6px;color:var(--mat-sys-primary);text-decoration:none;transition:all .2s ease;position:relative;overflow:hidden}.sidebar li a:hover{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text)}.sidebar li a.active{background-color:var(--mat-sys-user-info);color:var(--mat-sys-user-text);font-weight:500}.sidebar li a.active:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--mat-sys-user-info);border-radius:3px 0 0 3px}.sidebar mat-icon{font-size:20px;width:20px;height:20px;color:inherit}.sidebar span{font-size:.875rem;white-space:nowrap}.submenu{padding-left:12px;margin-top:4px}.submenu li a{padding:10px 16px 0 20px}.submenu mat-icon{font-size:18px}.sidebar li a mat-icon:last-child{margin-left:auto;margin-right:0;font-size:18px;color:#5f6368}:host-context(.minimized) .sidebar li a{justify-content:center;padding:12px 0}:host-context(.minimized) .sidebar mat-icon{margin-right:0}:host-context(.minimized) .sidebar span,:host-context(.minimized) .sidebar li a mat-icon:last-child{display:none}:host-context(.minimized) .submenu{display:none}.sidenav-content-wrapper button[mat-icon-button]{position:absolute;right:-8px;top:10%;z-index:5}\n"] }]
         }], ctorParameters: () => [] });
 
 class Theme {
@@ -2658,7 +2818,6 @@ class Theme {
     themes = [
         { name: 'light', icon: 'light_mode' },
         { name: 'dark', icon: 'dark_mode' },
-        { name: 'system', icon: 'desktop_windows' },
     ];
     selectedTheme = computed(() => this.themes.find((theme) => theme.name === this.appTheme()), ...(ngDevMode ? [{ debugName: "selectedTheme" }] : []));
     getThemes() {
@@ -2670,10 +2829,8 @@ class Theme {
     constructor() {
         effect(() => {
             const appTheme = this.appTheme();
-            const colorScheme = appTheme === 'system' ? 'light dark' : appTheme;
-            const agGridThemeMode = colorScheme === 'dark' ? 'dark' : 'light'; // AG Grid tema modunu belirle
-            document.body.style.setProperty('color-scheme', colorScheme);
-            document.body.setAttribute('data-ag-theme-mode', agGridThemeMode);
+            document.body.style.setProperty('color-scheme', appTheme);
+            document.body.setAttribute('data-ag-theme-mode', appTheme);
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Theme, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
@@ -2762,7 +2919,7 @@ class Toolbar {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Toolbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: Toolbar, isStandalone: true, selector: "ntybase-toolbar", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggleSidenav: "toggleSidenav", icon: "iconChange" }, ngImport: i0, template: "<mat-toolbar class=\"sidenav-header\">\n  <div class=\"left-section\">\n    <button mat-icon-button (click)=\"onToggleSidenav()\" class=\"menu-button\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span>Netty Admin Core</span>\n\n    <button><mat-icon>person</mat-icon></button>\n\n    <!-- Dil Se\u00E7me Butonu -->\n    <div class=\"language-toggle\">\n      <button\n        *ngIf=\"icon; else text\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      <ng-template #text>\n        <button\n          mat-raised-button\n          color=\"primary\"\n          [matMenuTriggerFor]=\"languageMenu\"\n        >\n          {{ currentLanguage }}\n        </button>\n      </ng-template>\n    </div>\n\n    <!-- Dil Men\u00FCs\u00FC -->\n    <mat-menu #languageMenu=\"matMenu\">\n      <button\n        mat-menu-item\n        *ngFor=\"let language of languages\"\n        (click)=\"setLanguage(language)\"\n      >\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n    </mat-menu>\n  </div>\n\n  <div class=\"spacer\"></div>\n\n  <div class=\"flex-stretch\"></div>\n  <button\n    mat-icon-button\n    [mat-menu-trigger-for]=\"themeMenu\"\n    class=\"theme-button\"\n  >\n    <mat-icon>{{ themeService.selectedTheme()?.icon }}</mat-icon>\n  </button>\n  <mat-menu #themeMenu=\"matMenu\">\n    @for (theme of themeService.getThemes(); track theme.name) {\n    <button\n      [class.selected-theme]=\"themeService.selectedTheme()?.name === theme.name\"\n      mat-menu-item\n      (click)=\"themeService.setTheme(theme.name)\"\n    >\n      <mat-icon>{{ theme.icon }}</mat-icon>\n      <span>{{ theme.name | titlecase }}</span>\n    </button>\n    }\n  </mat-menu>\n  <button\n    mat-icon-button\n    [matMenuTriggerFor]=\"customThemeMenu\"\n    class=\"custom-theme-button\"\n  >\n    <mat-icon>format_color_fill</mat-icon>\n  </button>\n  <mat-menu #customThemeMenu=\"matMenu\">\n    @for (customTheme of colorPaletteService.getThemes(); track customTheme.id)\n    {\n    <button\n      mat-menu-item\n      (click)=\"colorPaletteService.setTheme(customTheme.id)\"\n    >\n      <div class=\"theme-menu-item\">\n        <div\n          class=\"color-preview\"\n          [style.background-color]=\"customTheme.primary\"\n        ></div>\n        <span>{{ customTheme.displayName }}</span>\n      </div>\n    </button>\n    }\n  </mat-menu>\n</mat-toolbar>\n", styles: ["mat-toolbar{position:fixed;top:0;left:0;right:0;z-index:3;box-shadow:0 1px 5px #0000001a;display:flex;align-items:center}.sidenav-header{display:flex;justify-content:space-between;align-items:center;padding:16px;margin:0;font-weight:500}.sidenav-header .left-section{display:flex;align-items:center;gap:16px}.sidenav-header .spacer{flex:1 1 auto}.flex-stretch{flex:1 0 auto}.theme-menu-item{display:flex;align-items:center;gap:12px}.color-preview{width:24px;height:24px;border-radius:50%}::ng-deep .theme-button{border:none;background:none;margin-right:15px;cursor:pointer}::ng-deep .custom-theme-button{border:none;background:none;cursor:pointer}::ng-deep .menu-button{border:none;background:none;cursor:pointer}.language-button{margin:0 auto}::ng-deep button{border:none;background:none;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i3$5.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: Toolbar, isStandalone: true, selector: "ntybase-toolbar", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggleSidenav: "toggleSidenav", icon: "iconChange" }, ngImport: i0, template: "<mat-toolbar class=\"sidenav-header\">\n  <div class=\"left-section\">\n    <button mat-icon-button (click)=\"onToggleSidenav()\" class=\"menu-button\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span>Netty Admin Core</span>\n\n    <!-- Language Selection -->\n    <div class=\"language-toggle\">\n      <button\n        *ngIf=\"icon; else text\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      <ng-template #text>\n        <button\n          mat-raised-button\n          color=\"primary\"\n          [matMenuTriggerFor]=\"languageMenu\"\n        >\n          {{ currentLanguage }}\n        </button>\n      </ng-template>\n    </div>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      <button\n        mat-menu-item\n        *ngFor=\"let language of languages\"\n        (click)=\"setLanguage(language)\"\n      >\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n    </mat-menu>\n  </div>\n\n  <div class=\"spacer\"></div>\n\n  <div class=\"flex-stretch\"></div>\n  <button\n    mat-icon-button\n    [mat-menu-trigger-for]=\"themeMenu\"\n    class=\"theme-button\"\n  >\n    <mat-icon>{{ themeService.selectedTheme()?.icon }}</mat-icon>\n  </button>\n  <mat-menu #themeMenu=\"matMenu\">\n    @for (theme of themeService.getThemes(); track theme.name) {\n    <button\n      [class.selected-theme]=\"themeService.selectedTheme()?.name === theme.name\"\n      mat-menu-item\n      (click)=\"themeService.setTheme(theme.name)\"\n    >\n      <mat-icon>{{ theme.icon }}</mat-icon>\n      <span>{{ theme.name | titlecase }}</span>\n    </button>\n    }\n  </mat-menu>\n  <button\n    mat-icon-button\n    [matMenuTriggerFor]=\"customThemeMenu\"\n    class=\"custom-theme-button\"\n  >\n    <mat-icon>format_color_fill</mat-icon>\n  </button>\n  <mat-menu #customThemeMenu=\"matMenu\">\n    @for (customTheme of colorPaletteService.getThemes(); track customTheme.id)\n    {\n    <button\n      mat-menu-item\n      (click)=\"colorPaletteService.setTheme(customTheme.id)\"\n    >\n      <div class=\"theme-menu-item\">\n        <div\n          class=\"color-preview\"\n          [style.background-color]=\"customTheme.primary\"\n        ></div>\n        <span>{{ customTheme.displayName }}</span>\n      </div>\n    </button>\n    }\n  </mat-menu>\n</mat-toolbar>\n", styles: ["mat-toolbar{position:fixed;top:0;left:0;right:0;z-index:3;box-shadow:0 1px 5px #0000001a;display:flex;align-items:center}.sidenav-header{display:flex;justify-content:space-between;align-items:center;padding:16px;margin:0;font-weight:500}.sidenav-header .left-section{display:flex;align-items:center;gap:16px}.sidenav-header .spacer{flex:1 1 auto}.flex-stretch{flex:1 0 auto}.theme-menu-item{display:flex;align-items:center;gap:12px}.color-preview{width:24px;height:24px;border-radius:50%}::ng-deep .theme-button{border:none;background:none;margin-right:15px;cursor:pointer}::ng-deep .custom-theme-button{border:none;background:none;cursor:pointer}::ng-deep .menu-button{border:none;background:none;cursor:pointer}.language-button{margin:0 auto}::ng-deep button{border:none;background:none;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i3$5.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Toolbar, decorators: [{
             type: Component,
@@ -2772,7 +2929,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                         MatToolbarModule,
                         CommonModule,
                         TitleCasePipe,
-                    ], template: "<mat-toolbar class=\"sidenav-header\">\n  <div class=\"left-section\">\n    <button mat-icon-button (click)=\"onToggleSidenav()\" class=\"menu-button\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span>Netty Admin Core</span>\n\n    <button><mat-icon>person</mat-icon></button>\n\n    <!-- Dil Se\u00E7me Butonu -->\n    <div class=\"language-toggle\">\n      <button\n        *ngIf=\"icon; else text\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      <ng-template #text>\n        <button\n          mat-raised-button\n          color=\"primary\"\n          [matMenuTriggerFor]=\"languageMenu\"\n        >\n          {{ currentLanguage }}\n        </button>\n      </ng-template>\n    </div>\n\n    <!-- Dil Men\u00FCs\u00FC -->\n    <mat-menu #languageMenu=\"matMenu\">\n      <button\n        mat-menu-item\n        *ngFor=\"let language of languages\"\n        (click)=\"setLanguage(language)\"\n      >\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n    </mat-menu>\n  </div>\n\n  <div class=\"spacer\"></div>\n\n  <div class=\"flex-stretch\"></div>\n  <button\n    mat-icon-button\n    [mat-menu-trigger-for]=\"themeMenu\"\n    class=\"theme-button\"\n  >\n    <mat-icon>{{ themeService.selectedTheme()?.icon }}</mat-icon>\n  </button>\n  <mat-menu #themeMenu=\"matMenu\">\n    @for (theme of themeService.getThemes(); track theme.name) {\n    <button\n      [class.selected-theme]=\"themeService.selectedTheme()?.name === theme.name\"\n      mat-menu-item\n      (click)=\"themeService.setTheme(theme.name)\"\n    >\n      <mat-icon>{{ theme.icon }}</mat-icon>\n      <span>{{ theme.name | titlecase }}</span>\n    </button>\n    }\n  </mat-menu>\n  <button\n    mat-icon-button\n    [matMenuTriggerFor]=\"customThemeMenu\"\n    class=\"custom-theme-button\"\n  >\n    <mat-icon>format_color_fill</mat-icon>\n  </button>\n  <mat-menu #customThemeMenu=\"matMenu\">\n    @for (customTheme of colorPaletteService.getThemes(); track customTheme.id)\n    {\n    <button\n      mat-menu-item\n      (click)=\"colorPaletteService.setTheme(customTheme.id)\"\n    >\n      <div class=\"theme-menu-item\">\n        <div\n          class=\"color-preview\"\n          [style.background-color]=\"customTheme.primary\"\n        ></div>\n        <span>{{ customTheme.displayName }}</span>\n      </div>\n    </button>\n    }\n  </mat-menu>\n</mat-toolbar>\n", styles: ["mat-toolbar{position:fixed;top:0;left:0;right:0;z-index:3;box-shadow:0 1px 5px #0000001a;display:flex;align-items:center}.sidenav-header{display:flex;justify-content:space-between;align-items:center;padding:16px;margin:0;font-weight:500}.sidenav-header .left-section{display:flex;align-items:center;gap:16px}.sidenav-header .spacer{flex:1 1 auto}.flex-stretch{flex:1 0 auto}.theme-menu-item{display:flex;align-items:center;gap:12px}.color-preview{width:24px;height:24px;border-radius:50%}::ng-deep .theme-button{border:none;background:none;margin-right:15px;cursor:pointer}::ng-deep .custom-theme-button{border:none;background:none;cursor:pointer}::ng-deep .menu-button{border:none;background:none;cursor:pointer}.language-button{margin:0 auto}::ng-deep button{border:none;background:none;cursor:pointer}\n"] }]
+                    ], template: "<mat-toolbar class=\"sidenav-header\">\n  <div class=\"left-section\">\n    <button mat-icon-button (click)=\"onToggleSidenav()\" class=\"menu-button\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span>Netty Admin Core</span>\n\n    <!-- Language Selection -->\n    <div class=\"language-toggle\">\n      <button\n        *ngIf=\"icon; else text\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      <ng-template #text>\n        <button\n          mat-raised-button\n          color=\"primary\"\n          [matMenuTriggerFor]=\"languageMenu\"\n        >\n          {{ currentLanguage }}\n        </button>\n      </ng-template>\n    </div>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      <button\n        mat-menu-item\n        *ngFor=\"let language of languages\"\n        (click)=\"setLanguage(language)\"\n      >\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n    </mat-menu>\n  </div>\n\n  <div class=\"spacer\"></div>\n\n  <div class=\"flex-stretch\"></div>\n  <button\n    mat-icon-button\n    [mat-menu-trigger-for]=\"themeMenu\"\n    class=\"theme-button\"\n  >\n    <mat-icon>{{ themeService.selectedTheme()?.icon }}</mat-icon>\n  </button>\n  <mat-menu #themeMenu=\"matMenu\">\n    @for (theme of themeService.getThemes(); track theme.name) {\n    <button\n      [class.selected-theme]=\"themeService.selectedTheme()?.name === theme.name\"\n      mat-menu-item\n      (click)=\"themeService.setTheme(theme.name)\"\n    >\n      <mat-icon>{{ theme.icon }}</mat-icon>\n      <span>{{ theme.name | titlecase }}</span>\n    </button>\n    }\n  </mat-menu>\n  <button\n    mat-icon-button\n    [matMenuTriggerFor]=\"customThemeMenu\"\n    class=\"custom-theme-button\"\n  >\n    <mat-icon>format_color_fill</mat-icon>\n  </button>\n  <mat-menu #customThemeMenu=\"matMenu\">\n    @for (customTheme of colorPaletteService.getThemes(); track customTheme.id)\n    {\n    <button\n      mat-menu-item\n      (click)=\"colorPaletteService.setTheme(customTheme.id)\"\n    >\n      <div class=\"theme-menu-item\">\n        <div\n          class=\"color-preview\"\n          [style.background-color]=\"customTheme.primary\"\n        ></div>\n        <span>{{ customTheme.displayName }}</span>\n      </div>\n    </button>\n    }\n  </mat-menu>\n</mat-toolbar>\n", styles: ["mat-toolbar{position:fixed;top:0;left:0;right:0;z-index:3;box-shadow:0 1px 5px #0000001a;display:flex;align-items:center}.sidenav-header{display:flex;justify-content:space-between;align-items:center;padding:16px;margin:0;font-weight:500}.sidenav-header .left-section{display:flex;align-items:center;gap:16px}.sidenav-header .spacer{flex:1 1 auto}.flex-stretch{flex:1 0 auto}.theme-menu-item{display:flex;align-items:center;gap:12px}.color-preview{width:24px;height:24px;border-radius:50%}::ng-deep .theme-button{border:none;background:none;margin-right:15px;cursor:pointer}::ng-deep .custom-theme-button{border:none;background:none;cursor:pointer}::ng-deep .menu-button{border:none;background:none;cursor:pointer}.language-button{margin:0 auto}::ng-deep button{border:none;background:none;cursor:pointer}\n"] }]
         }] });
 
 class Guid {
@@ -2939,7 +3096,7 @@ class AutoCompletePopupMenu {
             return;
         // Split the component path into segments
         const pathSegments = this.componentPath.split('/').filter((p) => p);
-        this.GotoNewTab(pathSegments, '', 'new');
+        this.gotoNewTab(pathSegments, '', 'new');
         this.Result.emit('New');
     }
     gotoMain() {
@@ -2947,7 +3104,7 @@ class AutoCompletePopupMenu {
             return;
         // Split the component path into segments
         const pathSegments = this.componentPath.split('/').filter((p) => p);
-        this.GotoNewTab(pathSegments, this.recordGuid, 'edit');
+        this.gotoNewTab(pathSegments, this.recordGuid, 'edit');
         this.Result.emit('Main');
     }
     gotoLookup() {
@@ -2955,7 +3112,7 @@ class AutoCompletePopupMenu {
             this.Result.emit('Lookup');
         }
     }
-    GotoNewTab(target, params, type) {
+    gotoNewTab(target, params, type) {
         if (!target || target.length === 0)
             return;
         // Construct the URL directly in the format you want
@@ -3283,6 +3440,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 args: ['autoCompleteInput']
             }] } });
 
+class Filter {
+    value;
+    text;
+}
+
 /*
  * Public API Surface of ntybase
  */
@@ -3291,5 +3453,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AgGridBase, AgGridSaveBase, AlertService, AuthenticationGuard, AuthenticationInterceptor, AuthenticationService, AutoComplete, ButtonRenderer, CanDeactivateGuard, CheckboxRenderer, ColorPalette, CommonService, ConfirmDialog, CredentialsService, CurrentUserPreference, ForgotPassword, Guid, HttpError403, HttpError404, LeftSidenav, Login, LoginDto, MFACodeDto, MfaLogin, NettyAgGridService, NettyHelper, NettyMenuService, Ntybase, NtybaseModule, SelectionItem, Theme, Toolbar, UrlHelperService };
+export { AgGridBase, AgGridSaveBase, AlertService, AuthenticationGuard, AuthenticationInterceptor, AuthenticationService, AutoComplete, ButtonRenderer, CanDeactivateGuard, CheckboxRenderer, ColorPalette, CommonService, ConfirmDialog, CredentialsService, CurrentUserPreference, ExcelImportBase, Filter, ForgotPassword, Guid, HttpError403, HttpError404, LeftSidenav, Login, LoginDto, MFACodeDto, MfaLogin, NettyAgGridService, NettyHelper, NettyMenuService, Ntybase, NtybaseModule, SelectionItem, Theme, Toolbar, UrlHelperService };
 //# sourceMappingURL=nettyapps-ntybase.mjs.map