@nettyapps/ntybase 0.0.1

package/fesm2022/nettyapps-ntybase.mjs

@@ -0,0 +1,3295 @@
+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 * 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';
+import { catchError, map as map$1, take } from 'rxjs/operators';
+import * as i5 from '@angular/router';
+import { Router, ActivatedRoute, RouterLink, RouterModule } from '@angular/router';
+import * as i2$1 from '@nettyapps/ntycontract';
+import { EnvironmentProxy } from '@nettyapps/ntycontract';
+import * as i2$2 from '@angular/common';
+import { DatePipe, Location, CommonModule, TitleCasePipe } from '@angular/common';
+import * as i3$1 from '@ngx-translate/core';
+import { TranslateModule, TranslateService } from '@ngx-translate/core';
+import { Buffer } from 'buffer';
+import { marker } from '@biesbjerg/ngx-translate-extract-marker';
+import * as i1 from '@angular/material/dialog';
+import { MAT_DIALOG_DATA, MatDialogModule, MatDialog, MatDialogRef, MatDialogConfig } from '@angular/material/dialog';
+import * as i3 from '@angular/material/divider';
+import { MatDividerModule } from '@angular/material/divider';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i1$1 from '@angular/material/snack-bar';
+import { MatSnackBarModule } from '@angular/material/snack-bar';
+import { Mutex } from 'async-mutex';
+import { ModuleRegistry, AllCommunityModule, ClientSideRowModelModule, HighlightChangesModule, themeQuartz } from 'ag-grid-community';
+import { StatusBarModule, ClipboardModule, ExcelExportModule, ColumnMenuModule, ContextMenuModule, CellSelectionModule, RowSelectionModule } from 'ag-grid-enterprise';
+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 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';
+import { MatInputModule } from '@angular/material/input';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { I18nService } from '@nettyapps/ntyi18n';
+import * as i3$4 from '@angular/material/list';
+import { MatListModule } from '@angular/material/list';
+import { SearchInput, UiBase } from '@nettyapps/ntyui';
+import * as i3$5 from '@angular/material/toolbar';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import * as i3$6 from '@angular/material/autocomplete';
+import { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';
+import { ErrorStateMatcher } from '@angular/material/core';
+import { Clipboard } from '@angular/cdk/clipboard';
+
+class Ntybase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Ntybase, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: Ntybase, isStandalone: false, selector: "lib-ntybase", ngImport: i0, template: `
+    <p>
+      ntybase works!
+    </p>
+  `, isInline: true, styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Ntybase, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-ntybase', standalone: false, template: `
+    <p>
+      ntybase works!
+    </p>
+  ` }]
+        }] });
+
+const credentialsKey = 'credentials';
+class CredentialsService {
+    _credentials = null;
+    constructor() {
+        const savedCredentials = sessionStorage.getItem(credentialsKey) ||
+            localStorage.getItem(credentialsKey);
+        if (savedCredentials) {
+            this._credentials = JSON.parse(savedCredentials);
+        }
+    }
+    /**
+     * Checks is the user is authenticated.
+     * @return True if the user is authenticated.
+     */
+    isAuthenticated() {
+        return !!this.credentials;
+    }
+    /**
+     * Gets the user credentials.
+     * @return The user credentials or null if the user is not authenticated.
+     */
+    get credentials() {
+        return this._credentials;
+    }
+    get token() {
+        return this._credentials?.token ?? null;
+    }
+    /**
+     * Sets the user credentials.
+     * The credentials may be persisted across sessions by setting the `remember` parameter to true.
+     * Otherwise, the credentials are only persisted for the current session.
+     * @param credentials The user credentials.
+     * @param remember True to remember credentials across sessions.
+     */
+    setCredentials(credentials, remember) {
+        this._credentials = credentials || null;
+        if (credentials) {
+            const storage = remember ? localStorage : sessionStorage;
+            storage.setItem(credentialsKey, JSON.stringify(credentials));
+        }
+        else {
+            sessionStorage.removeItem(credentialsKey);
+            localStorage.removeItem(credentialsKey);
+        }
+    }
+    /** Get Credentials
+     *
+     * @returns
+     */
+    getCredentials() {
+        let _credentialsString = sessionStorage.getItem(credentialsKey);
+        if (_credentialsString == null || _credentialsString == '') {
+            _credentialsString = localStorage.getItem(credentialsKey);
+        }
+        return JSON.parse(_credentialsString ?? '');
+    }
+    /** Get the token if available otherwise return empty string
+     *
+     * @returns
+     */
+    getToken() {
+        try {
+            let _credentials = this.getCredentials();
+            return _credentials.token;
+        }
+        catch (error) {
+            return '';
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CredentialsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CredentialsService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CredentialsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class UrlHelperService {
+    router = inject(Router);
+    cleanUrl(url) {
+        let result = url
+            .replace('/mfalogin?redirect=', '')
+            .replace('/mfalogin?redirect=', '')
+            .replace('/mfalogin?redirect=', '')
+            .replace('/login?redirect=', '')
+            .replace('/login?redirect=', '')
+            .replace('/login?redirect=', '')
+            .replace(new RegExp('%25', 'g'), '%')
+            .replace(new RegExp('%25', 'g'), '%')
+            .replace(new RegExp('%25', 'g'), '%')
+            .replace(new RegExp('%25', 'g'), '%')
+            .replace(new RegExp('%25', 'g'), '%')
+            .replace(new RegExp('%25', 'g'), '%')
+            .replace(new RegExp('%22', 'g'), '"')
+            .replace(new RegExp('%3F', 'g'), '?')
+            .replace(new RegExp('%3D', 'g'), '=')
+            .replace(new RegExp('%2F', 'g'), '/')
+            .replace(new RegExp('%26', 'g'), '&')
+            .replace(new RegExp('/mfalogin?redirect=', 'g'), '')
+            .replace(new RegExp('/login?redirect=', 'g'), '');
+        console.log('url:', url);
+        console.log('result:', result);
+        // return url;
+        return result;
+    }
+    navigate(url) {
+        let urlParts = url.split('?');
+        if (urlParts.length == 1) {
+            return this.router.navigate(urlParts, { replaceUrl: true });
+        }
+        let parameters = urlParts[1].split('&');
+        return this.router.navigate([urlParts[0]], {
+            queryParams: {
+                parameters: parameters[0]?.replace('parameters=', '') ?? '',
+                type: parameters[1]?.replace('type=', '') ?? '',
+            },
+            replaceUrl: true,
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: UrlHelperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: UrlHelperService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: UrlHelperService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class AuthenticationInterceptor {
+    router = inject(Router);
+    credentialsService = inject(CredentialsService);
+    environmentProxy = inject(EnvironmentProxy);
+    urlHelperService = inject(UrlHelperService);
+    intercept(req, next) {
+        if (req.headers.get('No-Auth') == 'True')
+            return next.handle(req.clone());
+        let token = this.credentialsService.token;
+        if (token != null) {
+            let appName = this.environmentProxy.getApplicationName();
+            const clonedreq = req.clone({
+                headers: req.headers.set('Authorization', 'Bearer ' + token),
+                // .set("NettyAppName",appName)
+            });
+            return next.handle(clonedreq).pipe(catchError((error) => {
+                if (error instanceof HttpErrorResponse && error.status === 401) {
+                    // Handle 401 error, e.g., navigate to the login page
+                    this.router.navigate(['/login'], {
+                        queryParams: {
+                            redirect: this.urlHelperService.cleanUrl(this.router.url),
+                        },
+                        replaceUrl: true,
+                    });
+                    // Return an observable with a successful response
+                    return of(new HttpResponse({ status: 200, body: { message: 'Success' } }));
+                }
+                if (error instanceof HttpErrorResponse && error.status === 403) {
+                    this.router.navigate(['/forbidden'], {
+                        state: { attemptedUrl: this.router.url }, // Orijinal URL'i state olarak geçme
+                    });
+                    return of(new HttpResponse({ status: 200, body: { message: 'Success' } }));
+                }
+                if (error instanceof HttpErrorResponse && error.status === 428) {
+                    // Handle 428 error, e.g., navigate to the login page
+                    this.router.navigate(['/mfalogin'], {
+                        queryParams: {
+                            redirect: this.urlHelperService.cleanUrl(this.router.url),
+                        },
+                        replaceUrl: true,
+                    });
+                    // Return an observable with a successful response
+                    return of(new HttpResponse({ status: 200, body: { message: 'Success' } }));
+                }
+                // For other errors, re-throw the error to propagate it further
+                return throwError(() => error);
+            }));
+        }
+        else {
+            return next.handle(req.clone()).pipe(catchError((error) => {
+                if (error instanceof HttpErrorResponse && error.status === 401) {
+                    // Handle 401 error, e.g., navigate to the login page
+                    this.router.navigate(['/login'], {
+                        queryParams: {
+                            redirect: this.urlHelperService.cleanUrl(this.router.url),
+                        },
+                        replaceUrl: true,
+                    });
+                    // Return an observable with a successful response
+                    return of(new HttpResponse({ status: 200, body: { message: 'Success' } }));
+                }
+                if (error instanceof HttpErrorResponse && error.status === 403) {
+                    this.router.navigate(['/forbidden'], {
+                        state: { attemptedUrl: this.router.url }, // Orijinal URL'i state olarak geçme
+                    });
+                    return of(new HttpResponse({ status: 200, body: { message: 'Success' } }));
+                }
+                if (error instanceof HttpErrorResponse && error.status === 428) {
+                    // Handle 428 error, e.g., navigate to the login page
+                    this.router.navigate(['/mfalogin'], {
+                        queryParams: {
+                            redirect: this.urlHelperService.cleanUrl(this.router.url),
+                        },
+                        replaceUrl: true,
+                    });
+                    // Return an observable with a successful response
+                    return of(new HttpResponse({ status: 200, body: { message: 'Success' } }));
+                }
+                // For other errors, re-throw the error to propagate it further
+                return throwError(() => error);
+            }));
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationInterceptor, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationInterceptor });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationInterceptor, decorators: [{
+            type: Injectable
+        }] });
+
+class CanDeactivateGuard {
+    canDeactivate(component) {
+        return component.canDeactivate ? component.canDeactivate() : true;
+    }
+}
+
+class NtybaseModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NtybaseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: NtybaseModule, declarations: [Ntybase], exports: [Ntybase] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NtybaseModule, providers: [
+            {
+                provide: HTTP_INTERCEPTORS,
+                useClass: AuthenticationInterceptor,
+                multi: true,
+            },
+            [CanDeactivateGuard],
+            DatePipe,
+        ] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NtybaseModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [Ntybase],
+                    imports: [],
+                    exports: [Ntybase],
+                    providers: [
+                        {
+                            provide: HTTP_INTERCEPTORS,
+                            useClass: AuthenticationInterceptor,
+                            multi: true,
+                        },
+                        [CanDeactivateGuard],
+                        DatePipe,
+                    ],
+                }]
+        }] });
+
+class NettyHelper {
+    /**
+     * Returns null if fields are equal otherwise return second field
+     * @param firstField
+     * @param secondField
+     * @returns
+     */
+    static difference(firstField, secondField) {
+        if (firstField != secondField) {
+            return secondField;
+        }
+        return null;
+    }
+    /**
+     * Returns null if fields are equal otherwise return second field
+     * @param firstField
+     * @param secondField
+     * @param format
+     * @returns
+     */
+    static dateDifference(firstField, secondField, format) {
+        let culture = localStorage.getItem('languageApiCode') ?? 'tr-TR';
+        let datePipe = new DatePipe(culture);
+        if (datePipe.transform(firstField, format) !=
+            datePipe.transform(secondField, format)) {
+            return secondField;
+        }
+        return null;
+    }
+}
+
+class CurrentUserPreference {
+    coid = null;
+    nettyUserPreferenceGUID = null;
+    nettyUserGUID = null;
+    nettyUserName = null;
+    nettyUserFullName = null;
+    nettyPreferenceType = null;
+    nettyPreferenceData = null;
+    init() {
+        this.coid = null;
+        this.nettyUserPreferenceGUID = null;
+        this.nettyUserGUID = null;
+        this.nettyUserName = '';
+        this.nettyUserFullName = '';
+        this.nettyPreferenceType = '';
+        this.nettyPreferenceData = '';
+    }
+    initParameter(parameters) {
+        if (parameters == null || parameters == undefined) {
+            this.init();
+            return;
+        }
+        this.coid = parameters.coid;
+        this.nettyUserPreferenceGUID = parameters.nettyUserPreferenceGUID;
+        this.nettyUserGUID = parameters.nettyUserGUID;
+        this.nettyUserName = parameters.nettyUserName;
+        this.nettyUserFullName = parameters.nettyUserFullName;
+        this.nettyPreferenceType = parameters.nettyPreferenceType;
+        this.nettyPreferenceData = parameters.nettyPreferenceData;
+    }
+    compare(record) {
+        let newRecord = new CurrentUserPreference();
+        newRecord.init();
+        newRecord.coid = record.coid;
+        newRecord.nettyUserPreferenceGUID = record.nettyUserPreferenceGUID;
+        newRecord.nettyUserGUID = NettyHelper.difference(this.nettyUserGUID, record.nettyUserGUID);
+        newRecord.nettyPreferenceType = NettyHelper.difference(this.nettyPreferenceType, record.nettyPreferenceType);
+        newRecord.nettyPreferenceData = NettyHelper.difference(this.nettyPreferenceData, record.nettyPreferenceData);
+        return newRecord;
+    }
+}
+
+class ConfirmDialog {
+    dialogRef;
+    data;
+    constructor(dialogRef, data) {
+        this.dialogRef = dialogRef;
+        this.data = data;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ConfirmDialog, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: ConfirmDialog, isStandalone: true, selector: "ntybase-confirm-dialog", ngImport: i0, template: "<div class=\"dialog-container\">\n  <h2 mat-dialog-title class=\"dialog-title\">\n    <mat-icon color=\"warn\" class=\"warning-icon\">warning</mat-icon>\n    <span>{{data.title}}</span>\n  </h2>\n\n  <mat-divider class=\"divider\"></mat-divider>\n\n  <mat-dialog-content class=\"dialog-content\">\n    <p class=\"message\">{{data.message}}</p>\n  </mat-dialog-content>\n\n  <mat-dialog-actions align=\"end\" class=\"dialog-actions\">\n    <button mat-stroked-button [mat-dialog-close]=\"false\" class=\"btn-cancel\">\n      {{'@btnCancel' | translate}}\n    </button>\n    <button\n      mat-flat-button\n      color=\"warn\"\n      [mat-dialog-close]=\"true\"\n      class=\"btn-ok\"\n    >\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".dialog-container{display:flex;flex-direction:column;min-width:400px;max-width:90vw;padding:24px;border-radius:12px!important}.dialog-title{display:flex;align-items:center;margin:0 0 12px;padding:0;color:var(--mat-sys-primary)}.dialog-title span{margin-left:8px}.warning-icon{color:var(--mat-sys-primary);transform:scale(1.2)}.divider{margin:8px 0 16px;border-top-color:var(--mat-sys-primary)}.dialog-content{padding:8px 0 24px;margin:0;color:var(--mat-sys-primary);line-height:1.6}.dialog-content .message{margin:0;white-space:pre-wrap}.dialog-actions{padding:16px 0 0;margin:0;gap:8px}.btn-ok{padding:8px 16px;border-radius:6px;font-weight:500;background-color:var(--mat-sys-primary);color:var(--mat-sys-primary-container)}.btn-cancel{padding:8px 16px;border-radius:6px;color:var(--mat-sys-secondary-container);background-color:var(--mat-sys-secondary)}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { 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: ConfirmDialog, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-confirm-dialog', imports: [
+                        MatDialogModule,
+                        MatSnackBarModule,
+                        MatIconModule,
+                        MatDividerModule,
+                        TranslateModule,
+                    ], template: "<div class=\"dialog-container\">\n  <h2 mat-dialog-title class=\"dialog-title\">\n    <mat-icon color=\"warn\" class=\"warning-icon\">warning</mat-icon>\n    <span>{{data.title}}</span>\n  </h2>\n\n  <mat-divider class=\"divider\"></mat-divider>\n\n  <mat-dialog-content class=\"dialog-content\">\n    <p class=\"message\">{{data.message}}</p>\n  </mat-dialog-content>\n\n  <mat-dialog-actions align=\"end\" class=\"dialog-actions\">\n    <button mat-stroked-button [mat-dialog-close]=\"false\" class=\"btn-cancel\">\n      {{'@btnCancel' | translate}}\n    </button>\n    <button\n      mat-flat-button\n      color=\"warn\"\n      [mat-dialog-close]=\"true\"\n      class=\"btn-ok\"\n    >\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".dialog-container{display:flex;flex-direction:column;min-width:400px;max-width:90vw;padding:24px;border-radius:12px!important}.dialog-title{display:flex;align-items:center;margin:0 0 12px;padding:0;color:var(--mat-sys-primary)}.dialog-title span{margin-left:8px}.warning-icon{color:var(--mat-sys-primary);transform:scale(1.2)}.divider{margin:8px 0 16px;border-top-color:var(--mat-sys-primary)}.dialog-content{padding:8px 0 24px;margin:0;color:var(--mat-sys-primary);line-height:1.6}.dialog-content .message{margin:0;white-space:pre-wrap}.dialog-actions{padding:16px 0 0;margin:0;gap:8px}.btn-ok{padding:8px 16px;border-radius:6px;font-weight:500;background-color:var(--mat-sys-primary);color:var(--mat-sys-primary-container)}.btn-cancel{padding:8px 16px;border-radius:6px;color:var(--mat-sys-secondary-container);background-color:var(--mat-sys-secondary)}\n"] }]
+        }], ctorParameters: () => [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }] });
+
+// alert.service.ts
+class AlertService {
+    snackBar;
+    dialog;
+    translate;
+    constructor(snackBar, dialog, translate) {
+        this.snackBar = snackBar;
+        this.dialog = dialog;
+        this.translate = translate;
+    }
+    // For simple notifications
+    showAlert(message, action, duration = 3000) {
+        const actionText = action ? action : '@btnOK';
+        this.snackBar.open(this.translate.instant(message), this.translate.instant(actionText), { duration });
+    }
+    // For confirmation dialogs
+    showConfirm(message) {
+        return new Promise((resolve) => {
+            const dialogRef = this.dialog.open(ConfirmDialog, {
+                width: 'auto',
+                height: 'auto',
+                data: {
+                    message: this.translate.instant(message),
+                    title: this.translate.instant('@Confirmation'),
+                },
+            });
+            dialogRef.afterClosed().subscribe((result) => {
+                resolve(!!result);
+            });
+        });
+    }
+    // For success notifications
+    showSuccess(message, duration = 3000) {
+        this.snackBar.open(this.translate.instant(message), this.translate.instant('@btnOK'), {
+            duration,
+            panelClass: ['success-snackbar'],
+            horizontalPosition: 'right',
+            verticalPosition: 'bottom',
+        });
+    }
+    // For error notifications
+    showError(message, duration = 5000) {
+        this.snackBar.open(this.translate.instant(message), this.translate.instant('@btnOK'), {
+            duration,
+            panelClass: ['error-snackbar'],
+            horizontalPosition: 'right',
+            verticalPosition: 'bottom',
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AlertService, deps: [{ token: i1$1.MatSnackBar }, { token: i1.MatDialog }, { token: i3$1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AlertService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AlertService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: i1$1.MatSnackBar }, { type: i1.MatDialog }, { type: i3$1.TranslateService }] });
+
+class CommonService {
+    router = inject(Router);
+    location = inject(Location);
+    datePipe = inject(DatePipe);
+    alertService = inject(AlertService);
+    rightSidenavOpen = signal(false, ...(ngDevMode ? [{ debugName: "rightSidenavOpen" }] : []));
+    toggleRightSidenav(open) {
+        this.rightSidenavOpen.set(open);
+    }
+    normalizeTurkish(text) {
+        return text
+            .toLocaleLowerCase('tr-TR')
+            .replace(/[ıİ]/g, 'i')
+            .replace(/[ğĞ]/g, 'g')
+            .replace(/[üÜ]/g, 'u')
+            .replace(/[şŞ]/g, 's')
+            .replace(/[öÖ]/g, 'o')
+            .replace(/[çÇ]/g, 'c');
+    }
+    /**
+     * Gets the clean URL path without fragments or query params
+     */
+    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('/') ||
+            '/');
+    }
+    /** Merge columns with the given seperator
+     *
+     * @param columns string array to merge
+     * @param seperator seperator for the array. space if null
+     * @returns merged string
+     */
+    mergeColumns(columns, seperator = ' ') {
+        console.log('mergeColumns', columns);
+        let result = '';
+        columns.forEach((column) => {
+            if (!(column == undefined || column == null)) {
+                if (result.length > 0) {
+                    result += seperator;
+                }
+                result += column.trim();
+            }
+        });
+        return result.trim();
+    }
+    /** Go back to the last page or close the tab
+     *
+     */
+    goBack() {
+        if (!document.referrer) {
+            this.location.back();
+        }
+        else {
+            window.close();
+        }
+    }
+    // General Functions
+    //--------------------------------------
+    /** Delay for the given duration
+     *
+     * @param ms wait duration in ms
+     * @returns promise that waits for the duration
+     */
+    delay(ms) {
+        return new Promise((resolve) => setTimeout(resolve, ms));
+    }
+    // Base64 Functions
+    //--------------------------------------
+    /** Convert string to base64
+     *
+     * @param stringForConversion
+     * @returns
+     */
+    convertToBase64(stringForConversion) {
+        return Buffer.from(stringForConversion).toString('base64');
+        // return Base64.encode(stringForConversion);
+    }
+    /** Convert base64 string to normal string
+     *
+     * @param base64data
+     * @returns
+     */
+    convertFromBase64(base64data) {
+        //ascii
+        return Buffer.from(base64data, 'base64').toString();
+        // return Base64.decode(base64data);
+    }
+    // Formatters
+    //----------------------------------------
+    /** Compare dates. Designed for grid date filter
+     *
+     * @param filterValue user provided filtering date
+     * @param cellValue cell value to compare
+     * @returns -1 if cell date is smaller(earlier), 0 if dates are equal and 1 if cell date is bigger(later)
+     */
+    dateComparator(filterValue, cellValue) {
+        try {
+            let filterDate = this.datePipe.transform(filterValue, 'yyyyMMdd') ?? '';
+            let cellDate = this.datePipe.transform(cellValue, 'yyyyMMdd') ?? '';
+            if (cellDate < filterDate) {
+                return -1;
+            }
+            else if (cellDate > filterDate) {
+                return 1;
+            }
+            else {
+                return 0;
+            }
+        }
+        catch (error) {
+            return -1;
+        }
+    }
+    /** Format date into 'dd-MM-yyyy' format for grids
+     *
+     * @param dateValue
+     * @returns
+     */
+    dateFormatter(dateValue) {
+        return this.datePipe.transform(dateValue, 'dd-MM-yyyy') ?? '';
+    }
+    /** Reactive Signal state for tracking grid updates */
+    _updates = signal(null, ...(ngDevMode ? [{ debugName: "_updates" }] : []));
+    /** Read-only Signal for external components to observe updates */
+    updates = this._updates.asReadonly();
+    /** Broadcasts grid data changes to subscribers */
+    notifyUpdate(type, action, data) {
+        this._updates.set({ type, action, data });
+    }
+    // Security Functions
+    //--------------------------------------
+    /** User is not allowed to access the page
+     *
+     */
+    async userNotAllowedToRead(title = '', message = '') {
+        if (title == '') {
+            title = marker('Erişim Kısıtı');
+        }
+        // else {title = this.nettyAlertService.GetMessageText(title);}
+        if (message == '') {
+            message = marker('Kullanıcı bu ekrana erişemez!');
+        }
+        // else {message = this.nettyAlertService.GetMessageText(message);}
+        await this.alertService.showAlert(title, message);
+        this.goBack();
+    }
+    async userNotAllowedToAdd(title = '', message = '') {
+        if (title == '') {
+            title = marker('Erişim Kısıtı');
+        }
+        // else { title = this.nettyAlertService.GetMessageText(title); }
+        if (message == '') {
+            message = marker('Kullanıcı yeni kayıt ekleyemez!');
+        }
+        // else { message = this.nettyAlertService.GetMessageText(message); }
+        await this.alertService.showAlert(title, message);
+        this.goBack();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CommonService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CommonService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CommonService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class NettyAgGridService {
+    userPreferenceLock;
+    http = inject(HttpClient);
+    nettyAlertService = inject(AlertService);
+    environmentProxy = inject(EnvironmentProxy);
+    commonService = inject(CommonService);
+    constructor() {
+        this.userPreferenceLock = new Mutex();
+    }
+    // Restapi  functions
+    //--------------------------------------
+    /**
+     * Select user preference
+     * @param admuserpreference
+     * @returns
+     */
+    selectForUserAdmUserPreference(admuserpreference) {
+        let sysFunctionsURL = this.environmentProxy.getAdminLink('SelectForUser');
+        return this.http.post(sysFunctionsURL, admuserpreference);
+    }
+    /**
+     * Insert or update user preference
+     * @param admuserpreference
+     * @returns
+     */
+    insertOrUpdateAdmUserPreference(admuserpreference) {
+        let sysFunctionsURL = this.environmentProxy.getAdminLink('InsertOrUpdate');
+        return this.http.post(sysFunctionsURL, admuserpreference);
+    }
+    // AG Grid Preference Management
+    //--------------------------------------
+    /** Preference Save and Upload
+     *
+     * @param preferenceType component name or other uniqe identifier
+     * @param gridApi api for agGrid column management
+     * @returns nothing
+     */
+    async saveGridUserPreference(preferenceType, gridApi, defaultColDef) {
+        if (!gridApi)
+            return;
+        if (this.userPreferenceLock.isLocked())
+            return;
+        var releaseLock = await this.userPreferenceLock.acquire();
+        let columnState = gridApi?.getColumnState();
+        let jsonstring = JSON.stringify(columnState);
+        if (jsonstring == defaultColDef) {
+            releaseLock();
+            return;
+        }
+        let columnStateSaved = sessionStorage.getItem(preferenceType);
+        //If the column order identical then return
+        if (columnStateSaved && columnStateSaved == jsonstring) {
+            releaseLock();
+            return;
+        }
+        try {
+            sessionStorage.setItem(preferenceType, jsonstring);
+            await this.commonService.delay(100);
+            let admuserpreference = new CurrentUserPreference();
+            admuserpreference.nettyPreferenceType = preferenceType;
+            if (jsonstring != undefined) {
+                admuserpreference.nettyPreferenceData =
+                    this.commonService.convertToBase64(jsonstring);
+                await lastValueFrom(this.insertOrUpdateAdmUserPreference(admuserpreference));
+            }
+        }
+        catch (error) {
+            console.log(error);
+            this.nettyAlertService.showAlert('Error', error.Message);
+        }
+        finally {
+            releaseLock();
+        }
+    }
+    /** Get the user preference and update grid columns
+     *
+     * @param preferenceType component name or other uniqe identifier
+     * @param gridApi
+     * @returns
+     */
+    async loadGridUserPreference(preferenceType, gridApi) {
+        if (!gridApi)
+            return;
+        let columnState = sessionStorage.getItem(preferenceType) ?? '';
+        if (columnState.length > 0) {
+            if (this.userPreferenceLock.isLocked())
+                return;
+            var releaseLock = await this.userPreferenceLock.acquire();
+            try {
+                gridApi.applyColumnState({ state: JSON.parse(columnState) });
+            }
+            catch { }
+            this.commonService.delay(100).then(() => releaseLock());
+            return;
+        }
+        this.copyGridUserPereferenceToLocal(preferenceType).then(() => {
+            try {
+                let jsonstring = sessionStorage.getItem(preferenceType)?.trim() ?? '';
+                if (jsonstring.length > 0) {
+                    gridApi.applyColumnState(JSON.parse(jsonstring));
+                }
+            }
+            catch (error) { }
+        });
+    }
+    /** Download user preference and save to local
+     *
+     * @param preferenceType component name or other uniqe identifier
+     * @returns
+     */
+    async copyGridUserPereferenceToLocal(preferenceType) {
+        var relaseLock = await this.userPreferenceLock.acquire();
+        let columnState = sessionStorage.getItem(preferenceType);
+        if (columnState) {
+            relaseLock();
+            return;
+        }
+        try {
+            let admuserpreference = new CurrentUserPreference();
+            admuserpreference.nettyPreferenceType = preferenceType;
+            let data = (await lastValueFrom(this.selectForUserAdmUserPreference(admuserpreference)));
+            if (data != undefined &&
+                data != null &&
+                (data?.nettyPreferenceType?.length ?? 0) > 0) {
+                let jsonstring = this.commonService.convertFromBase64(data.nettyPreferenceType ?? '');
+                sessionStorage.setItem(preferenceType, jsonstring);
+                relaseLock();
+            }
+            else {
+                relaseLock();
+            }
+        }
+        catch (error) {
+            relaseLock();
+        }
+    }
+    /** Expand all Fit to screen all columns of the grid
+     *
+     * @param gridApi api of the aggrid to manage
+     * @param gridApi columns api of the grid to manage
+     * @param gridExpanded initial status of the grid
+     * @returns current status of the grid
+     */
+    expandCollapseGrid(gridApi, gridExpanded = false) {
+        let _gridExpanded = gridExpanded;
+        try {
+            if (gridExpanded) {
+                gridExpanded = false;
+                gridApi.sizeColumnsToFit();
+            }
+            else {
+                gridExpanded = true;
+                var allColumnIds = [];
+                gridApi.getColumns().forEach((column) => {
+                    allColumnIds.push(column.colId);
+                });
+                gridApi.autoSizeColumns(allColumnIds);
+            }
+        }
+        catch (error) {
+            console.log(error);
+            return _gridExpanded;
+        }
+        return gridExpanded;
+    }
+    /** Set the QuickFilter of the grid and save the entry in session storage
+     *
+     * @param searchValueName Component identifier
+     * @param searchValue Value to search
+     * @param gridApi api for the current aggrid
+     */
+    setGridQuickSearch(searchValueName, searchValue, gridApi) {
+        if (gridApi) {
+            gridApi.setQuickFilter(searchValue);
+        }
+        sessionStorage.setItem(searchValueName, searchValue);
+    }
+    /** Reapply the last search value from the session storage
+     *
+     * @param searchValueName Component identifier
+     * @param gridApi api for the current aggrid
+     * @returns
+     */
+    reapplyGridQuickSearch(searchValueName, gridApi) {
+        if (!gridApi)
+            return '';
+        // Reapply the last filter
+        let searchValue = sessionStorage.getItem(searchValueName) ?? '';
+        if (searchValue.length > 0) {
+            gridApi.setQuickFilter(searchValue);
+        }
+        return searchValue;
+    }
+    /** Get Grid Column Default parameters for the given component
+     *
+     * @param componentName Name of the component we are initializing
+     * @returns
+     */
+    getGridColumnDefault(componentName = '') {
+        return {
+            flex: 1,
+            filter: true,
+            resizable: true,
+            sortable: true,
+        };
+    }
+    /** Return excel style for ag-grid
+     *
+     * @returns
+     */
+    getExcelStyles() {
+        return [
+            { id: 'text-format', dataType: 'string' },
+            {
+                id: 'numberType',
+                dataType: 'number',
+                numberFormat: { format: '#,##0.00' },
+                alignment: { horizontal: 'right', vertical: 'Center' },
+            },
+            {
+                id: 'date-format',
+                dataType: 'dateTime',
+                numberFormat: { format: 'dd/mm/yyyy;@' },
+            },
+            {
+                id: 'dateTime-format',
+                dataType: 'dateTime',
+                numberFormat: { format: 'dd/mm/yyyy hh:MM:ss;@' },
+            },
+        ];
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NettyAgGridService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NettyAgGridService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NettyAgGridService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class SecurityDto {
+    coid = null;
+    userGUID = null;
+    application = '';
+    formCode = '';
+}
+
+class SysfunctionProxy {
+    http;
+    environmentProxy;
+    constructor(http, environmentProxy) {
+        this.http = http;
+        this.environmentProxy = environmentProxy;
+    }
+    /** Get the authentication list for the given form
+     *
+     * @param formCode
+     * @returns
+     */
+    getAuthentication(formCode) {
+        let sysFunctionsURL = this.environmentProxy.getAdminLink('getAuthentication');
+        let securityDto = new SecurityDto();
+        securityDto.formCode = formCode;
+        securityDto.application = this.environmentProxy.getApplicationName();
+        let call$ = this.http.post(sysFunctionsURL, securityDto);
+        return call$.pipe(map((result) => result), catchError$1((error) => {
+            let errorMessage = error.message; //.error.title;
+            return throwError(() => new Error(errorMessage ?? ''));
+        }));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SysfunctionProxy, deps: [{ token: i1$2.HttpClient }, { token: i2$1.EnvironmentProxy }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SysfunctionProxy, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SysfunctionProxy, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: i2$1.EnvironmentProxy }] });
+
+ModuleRegistry.registerModules([
+    AllCommunityModule,
+    StatusBarModule,
+    ClientSideRowModelModule,
+    ClipboardModule,
+    ExcelExportModule,
+    ColumnMenuModule,
+    ContextMenuModule,
+    CellSelectionModule,
+    HighlightChangesModule,
+    RowSelectionModule,
+]);
+// AgGrid Dark Mode Row Style
+const myTheme = themeQuartz.withParams({
+    backgroundColor: 'black',
+    browserColorScheme: 'dark',
+}, 'dark');
+class AgGridBase {
+    // Input signals
+    readOnly = input(false, ...(ngDevMode ? [{ debugName: "readOnly" }] : []));
+    popupFilterValid = input(false, ...(ngDevMode ? [{ debugName: "popupFilterValid" }] : []));
+    popupValid = input(false, ...(ngDevMode ? [{ debugName: "popupValid" }] : []));
+    params = input('', ...(ngDevMode ? [{ debugName: "params" }] : []));
+    // Authentication
+    authenticationList = [];
+    // User access writes
+    accessRightsProcessed = signal(false, ...(ngDevMode ? [{ debugName: "accessRightsProcessed" }] : []));
+    allowAdd = signal(false, ...(ngDevMode ? [{ debugName: "allowAdd" }] : []));
+    allowEdit = signal(false, ...(ngDevMode ? [{ debugName: "allowEdit" }] : []));
+    allowDelete = signal(false, ...(ngDevMode ? [{ debugName: "allowDelete" }] : []));
+    allowLog = signal(false, ...(ngDevMode ? [{ debugName: "allowLog" }] : []));
+    allowRead = signal(true, ...(ngDevMode ? [{ debugName: "allowRead" }] : []));
+    // Button action management variables
+    menuValid = signal(false, ...(ngDevMode ? [{ debugName: "menuValid" }] : []));
+    deleteValid = signal(false, ...(ngDevMode ? [{ debugName: "deleteValid" }] : []));
+    selectionValid = signal(false, ...(ngDevMode ? [{ debugName: "selectionValid" }] : []));
+    refreshButtonValid = signal(false, ...(ngDevMode ? [{ debugName: "refreshButtonValid" }] : []));
+    // Parameters for embeded components
+    selectedElement = output();
+    // Filter Parameters
+    filterField = input(null, ...(ngDevMode ? [{ debugName: "filterField" }] : []));
+    filterFieldValue = input(null, ...(ngDevMode ? [{ debugName: "filterFieldValue" }] : []));
+    filterFieldNumeric = input(false, ...(ngDevMode ? [{ debugName: "filterFieldNumeric" }] : []));
+    filterFieldEquality = input('=', ...(ngDevMode ? [{ debugName: "filterFieldEquality" }] : []));
+    // AG-Grid theme setting (dark mode)
+    theme = myTheme;
+    // Grid references
+    gridApi;
+    userGridApi;
+    excelStyles = null;
+    // Column definitions
+    columnDefs = signal(null, ...(ngDevMode ? [{ debugName: "columnDefs" }] : []));
+    userColumnDefs = signal(null, ...(ngDevMode ? [{ debugName: "userColumnDefs" }] : []));
+    groupMembersColumnDefs = signal(null, ...(ngDevMode ? [{ debugName: "groupMembersColumnDefs" }] : []));
+    // Framework components
+    frameworkComponents = null;
+    // Selection management
+    selectedRows = signal([], ...(ngDevMode ? [{ debugName: "selectedRows" }] : []));
+    isSingleRowSelected = computed(() => this.selectedRows().length === 1, ...(ngDevMode ? [{ debugName: "isSingleRowSelected" }] : []));
+    isMultipleRowSelected = computed(() => this.selectedRows().length > 0, ...(ngDevMode ? [{ debugName: "isMultipleRowSelected" }] : []));
+    // Component identifiers
+    gridExpanded = signal(false, ...(ngDevMode ? [{ debugName: "gridExpanded" }] : []));
+    componentName = signal('Invalid', ...(ngDevMode ? [{ debugName: "componentName" }] : []));
+    searchValueName = signal('Invalid_searchValue', ...(ngDevMode ? [{ debugName: "searchValueName" }] : []));
+    preferenceType = signal('Invalid_columnState', ...(ngDevMode ? [{ debugName: "preferenceType" }] : []));
+    searchValue = signal('', ...(ngDevMode ? [{ debugName: "searchValue" }] : []));
+    // Services
+    nettyAgGridService = inject(NettyAgGridService);
+    translateService = inject(TranslateService);
+    commonService = inject(CommonService);
+    router = inject(Router);
+    routerActive = inject(ActivatedRoute);
+    alertService = inject(AlertService);
+    dialog = inject(MatDialog);
+    sysFunctionProxy = inject(SysfunctionProxy);
+    initAgGrid_extension() {
+        if (this.allowEdit() == false && (this.popupValid() ?? false) == false) {
+            this.columnDefs().pop();
+            this.columnDefs().shift();
+            this.columnDefs().unshift({
+                headerName: '',
+                headerCheckboxSelection: true,
+                sortable: true,
+                resizable: true,
+                filter: true,
+                minWidth: 120,
+                maxWidth: 120,
+                suppressSizeToFit: true,
+                colId: 'editColumn',
+                cellRenderer: 'buttonRenderer',
+                cellRendererParams: {
+                    //onClick: this.onBtnClick.bind(this),
+                    label: '1',
+                    type: 'edit',
+                },
+            });
+            this.gridApi.setGridOption('rowSelection', {
+                mode: 'multiRow',
+                checkboxes: true,
+            });
+        }
+        if (this.popupValid() == true) {
+            this.columnDefs().pop();
+            this.columnDefs().shift();
+            if (this.popupFilterValid() == true) {
+                if (this.allowEdit()) {
+                    this.columnDefs().unshift({
+                        headerName: '',
+                        sortable: false,
+                        resizable: false,
+                        filter: false,
+                        minWidth: 50,
+                        maxWidth: 50,
+                        suppressSizeToFit: true,
+                        cellRenderer: 'buttonRenderer',
+                        cellRendererParams: {
+                            onClick: this.onBtnClick?.bind(this),
+                            label: this.translateService.instant('@Update'),
+                            type: 'popupEdit',
+                        },
+                    });
+                    this.gridApi.setGridOption('rowSelection', {
+                        mode: 'multiRow',
+                        checkboxes: true,
+                    });
+                }
+                else {
+                    this.columnDefs().unshift({
+                        headerName: '',
+                        sortable: false,
+                        resizable: false,
+                        filter: false,
+                        minWidth: 50,
+                        maxWidth: 50,
+                        suppressSizeToFit: true,
+                        cellStyle: { 'padding-top': '5px' },
+                    });
+                    this.gridApi.setGridOption('rowSelection', {
+                        mode: 'multiRow',
+                        checkboxes: true,
+                    });
+                }
+            }
+            else {
+                if (this.allowEdit() == false) {
+                    this.columnDefs().unshift({
+                        headerName: '',
+                        sortable: false,
+                        resizable: false,
+                        filter: false,
+                        minWidth: 50,
+                        maxWidth: 50,
+                        suppressSizeToFit: true,
+                        cellRenderer: 'buttonRenderer',
+                        cellRendererParams: {
+                            onClick: this.onBtnClick?.bind(this),
+                            label: this.translateService.instant('@Update'),
+                            type: 'popupEdit',
+                        },
+                    });
+                    this.gridApi.setGridOption('rowSelection', {
+                        mode: 'singleRow',
+                        checkboxes: false,
+                    });
+                }
+                if (!this.readOnly()) {
+                    this.columnDefs().unshift({
+                        headerName: this.translateService.instant('@select'),
+                        sortable: false,
+                        resizable: false,
+                        filter: false,
+                        minWidth: 80,
+                        maxWidth: 80,
+                        suppressSizeToFit: true,
+                        cellRenderer: 'buttonRenderer',
+                        cellStyle: { 'margin-top': '8px' },
+                        cellRendererParams: {
+                            onClick: this.onBtnClick?.bind(this),
+                            label: this.translateService.instant('@select'),
+                            type: 'popupSelect',
+                        },
+                    });
+                    this.gridApi.setGridOption('rowSelection', {
+                        mode: 'singleRow',
+                        checkboxes: false,
+                    });
+                }
+            }
+        }
+    }
+    // Grid configuration options
+    gridOptions = {
+        rowSelection: {
+            mode: 'multiRow',
+            checkboxes: true,
+            headerCheckbox: true,
+            selectAll: 'filtered',
+            hideDisabledCheckboxes: true,
+            suppressRowClickSelection: false,
+            enableCellChangeFlash: true,
+        },
+        localeText: {
+            // Status panel translate
+            totalRows: this.translateService.instant('AG_GRID.TOTAL_ROWS'),
+            filteredRows: this.translateService.instant('AG_GRID.FILTERED_ROWS'),
+            selectedRows: this.translateService.instant('AG_GRID.SELECTED_ROWS'),
+            noRowsToShow: this.translateService.instant('AG_GRID.NO_ROWS_TO_SHOW'),
+            loadingOoo: this.translateService.instant('AG_GRID.LOADING'),
+            // Context menu translations
+            copy: this.translateService.instant('AG_GRID.COPY'),
+            copyWithHeaders: this.translateService.instant('AG_GRID.COPY_WITH_HEADERS'),
+            copyWithGroupHeaders: this.translateService.instant('AG_GRID.COPY_WITH_GROUP_HEADERS'),
+            paste: this.translateService.instant('AG_GRID.PASTE'),
+            export: this.translateService.instant('AG_GRID.EXPORT'),
+            csvExport: this.translateService.instant('AG_GRID.CSV_EXPORT'),
+            excelExport: this.translateService.instant('AG_GRID.EXCEL_EXPORT'),
+            pinColumn: this.translateService.instant('AG_GRID.PIN_COLUMN'),
+            pinLeft: this.translateService.instant('AG_GRID.PIN_LEFT'),
+            pinRight: this.translateService.instant('AG_GRID.PIN_RIGHT'),
+            noPin: this.translateService.instant('AG_GRID.NO_PIN'),
+            sortAscending: this.translateService.instant('AG_GRID.SORT_ASCENDING'),
+            sortDescending: this.translateService.instant('AG_GRID.SORT_DESCENDING'),
+            autosizeThisColumn: this.translateService.instant('AG_GRID.AUTOSIZE_THIS_COLUMN'),
+            autosizeAllColumns: this.translateService.instant('AG_GRID.AUTOSIZE_ALL_COLUMNS'),
+            resetColumns: this.translateService.instant('AG_GRID.RESET_COLUMNS'),
+            expandAll: this.translateService.instant('AG_GRID.EXPAND_ALL'),
+            collapseAll: this.translateService.instant('AG_GRID.COLLAPSE_ALL'),
+            exportToExcel: this.translateService.instant('AG_GRID.EXPORT_TO_EXCEL'),
+            sheetName: this.translateService.instant('AG_GRID.SHEET_NAME'),
+            exportAsExcelTable: this.translateService.instant('AG_GRID.EXPORT_AS_EXCEL_TABLE'),
+            rangeSelectTo: this.translateService.instant('AG_GRID.RANGE_SELECT_TO'),
+            rangeSelectFrom: this.translateService.instant('AG_GRID.RANGE_SELECT_FROM'),
+            rangeSelectCopy: this.translateService.instant('AG_GRID.RANGE_SELECT_COPY'),
+            rangeSelectChart: this.translateService.instant('AG_GRID.RANGE_SELECT_CHART'),
+            pasteAll: this.translateService.instant('AG_GRID.CLIPBOARD_PASTE'),
+            pasteWithoutHeader: this.translateService.instant('AG_GRID.CLIPBOARD_PASTE_WITHOUT_HEADER'),
+            copyAll: this.translateService.instant('AG_GRID.CLIPBOARD_COPY'),
+            cut: this.translateService.instant('AG_GRID.CLIPBOARD_CUT'),
+            // Pagination translations
+            page: this.translateService.instant('AG_GRID.PAGE'),
+            more: this.translateService.instant('AG_GRID.MORE'),
+            to: this.translateService.instant('AG_GRID.TO'),
+            of: this.translateService.instant('AG_GRID.OF'),
+            next: this.translateService.instant('AG_GRID.NEXT'),
+            last: this.translateService.instant('AG_GRID.LAST'),
+            first: this.translateService.instant('AG_GRID.FIRST'),
+            previous: this.translateService.instant('AG_GRID.PREVIOUS'),
+            pageSizeSelectorLabel: this.translateService.instant('AG_GRID.PAGE_SIZE_SELECTOR_LABEL'),
+            // Set Filter
+            selectAll: this.translateService.instant('AG_GRID.SELECT_ALL'),
+            selectAllSearchResults: this.translateService.instant('AG_GRID.SELECT_ALL_SEARCH_RESULTS'),
+            searchOoo: this.translateService.instant('AG_GRID.SEARCH_OOO'),
+            blanks: this.translateService.instant('AG_GRID.BLANKS'),
+            noMatches: this.translateService.instant('AG_GRID.NO_MATCHES'),
+            // Number Filter & Text Filter
+            filterOoo: this.translateService.instant('AG_GRID.FILTER_OOO'),
+            equals: this.translateService.instant('AG_GRID.EQUALS'),
+            notEqual: this.translateService.instant('AG_GRID.NOT_EQUAL'),
+            blank: this.translateService.instant('AG_GRID.BLANK'),
+            notBlank: this.translateService.instant('AG_GRID.NOT_BLANK'),
+            empty: this.translateService.instant('AG_GRID.EMPTY'),
+            // Number Filter
+            lessThan: this.translateService.instant('AG_GRID.LESS_THAN'),
+            greaterThan: this.translateService.instant('AG_GRID.GREATER_THAN'),
+            lessThanOrEqual: this.translateService.instant('AG_GRID.LESS_THAN_OR_EQUAL'),
+            greaterThanOrEqual: this.translateService.instant('AG_GRID.GREATER_THAN_OR_EQUAL'),
+            inRange: this.translateService.instant('AG_GRID.IN_RANGE'),
+            inRangeStart: this.translateService.instant('AG_GRID.IN_RANGE_START'),
+            inRangeEnd: this.translateService.instant('AG_GRID.IN_RANGE_END'),
+            // Text Filter
+            contains: this.translateService.instant('AG_GRID.CONTAINS'),
+            notContains: this.translateService.instant('AG_GRID.NOT_CONTAINS'),
+            startsWith: this.translateService.instant('AG_GRID.STARTS_WITH'),
+            endsWith: this.translateService.instant('AG_GRID.ENDS_WITH'),
+            // Date Filter
+            dateFormatOoo: this.translateService.instant('AG_GRID.DATE_FORMAT_OOO'),
+            // Filter Conditions
+            andCondition: this.translateService.instant('AG_GRID.AND_CONDITION'),
+            orCondition: this.translateService.instant('AG_GRID.OR_CONDITION'),
+            // Filter Buttons
+            applyFilter: this.translateService.instant('AG_GRID.APPLY_FILTER'),
+            resetFilter: this.translateService.instant('AG_GRID.RESET_FILTER'),
+            clearFilter: this.translateService.instant('AG_GRID.CLEAR_FILTER'),
+            cancelFilter: this.translateService.instant('AG_GRID.CANCEL_FILTER'),
+            // Filter Titles
+            textFilter: this.translateService.instant('AG_GRID.TEXT_FILTER'),
+            numberFilter: this.translateService.instant('AG_GRID.NUMBER_FILTER'),
+            dateFilter: this.translateService.instant('AG_GRID.DATE_FILTER'),
+            setFilter: this.translateService.instant('AG_GRID.SET_FILTER'),
+        },
+    };
+    // Statusbar
+    statusBar = {
+        statusPanels: [
+            {
+                statusPanel: 'agTotalRowCountComponent',
+                align: 'left',
+                key: 'rowCount',
+            },
+            { statusPanel: 'agFilteredRowCountComponent' },
+            { statusPanel: 'agSelectedRowCountComponent' },
+            { statusPanel: 'agAggregationComponent' },
+        ],
+    };
+    // Common grid ready handler
+    onGridReady(params) {
+        this.gridApi = params.api;
+        this.gridApi.addEventListener('selectionChanged', () => {
+            const selectedNodes = this.gridApi.getSelectedNodes();
+            this.selectedRows.set(selectedNodes.map((node) => node.data));
+        });
+        // Apply the saved filter when the grid is ready
+        if (this.searchValue()) {
+            this.gridApi.setGridOption('quickFilterText', this.searchValue());
+        }
+    }
+    onFirstDataRendered(params) {
+        //TODO: Fix this
+        try {
+            this.nettyAgGridService.loadGridUserPreference(this.preferenceType(), this.gridApi);
+            this.expandCollapse();
+        }
+        catch (error) {
+            console.log('OnFirstDataRendered error:', error);
+        }
+    }
+    // Save the user parameters
+    saveGrid(params) {
+        const gridState = {
+            columnState: this.gridApi.getColumnState(),
+        };
+        this.nettyAgGridService.saveGridUserPreference(this.preferenceType(), this.gridApi, JSON.stringify(gridState));
+    }
+    // Grid utilities
+    expandCollapse() {
+        this.gridExpanded.set(this.nettyAgGridService.expandCollapseGrid(this.gridApi, this.gridExpanded()));
+    }
+    quickSearch(searchStr = '') {
+        this.searchValue.set(searchStr);
+        if (this.gridApi) {
+            this.gridApi.setGridOption('quickFilterText', this.searchValue());
+        }
+        sessionStorage.setItem(this.searchValueName(), this.searchValue());
+    }
+    /**
+     * Handle back button click
+     */
+    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: {
+                parameters: JSON.stringify(parameters),
+                ...(type && { type }),
+                isNewTab: isNewTab || undefined,
+            },
+            queryParamsHandling: 'merge',
+        };
+        if (isNewTab) {
+            const fullUrl = this.router
+                .createUrlTree([...routePrefix, ...rightSidenav], navigationExtras)
+                .toString();
+            window.open(fullUrl, '_blank');
+            return;
+        }
+        if (embedded && dialogComponent) {
+            this.dialog
+                .open(dialogComponent, {
+                data: {
+                    parameters: parameters,
+                    mode: type || 'edit',
+                    embedded: true,
+                },
+                maxWidth: '100vw',
+                disableClose: true,
+            })
+                .afterClosed()
+                .subscribe((result) => {
+                if (result === 'saved') {
+                    this.refreshData();
+                }
+            });
+            return;
+        }
+        // Log control
+        if (rightSidenav[0] === 'log') {
+            this.router.navigate([...routePrefix, ...rightSidenav], navigationExtras);
+            return;
+        }
+        // In all other cases, open the side menu
+        this.router
+            .navigate([
+            {
+                outlets: {
+                    primary: routePrefix,
+                    rightSidenav: [...routePrefix, ...rightSidenav],
+                },
+            },
+        ], navigationExtras)
+            .then(() => {
+            // Ensure sidenav is opened after navigation
+            this.commonService.toggleRightSidenav(true);
+        });
+    }
+    popupGotoURL(urlSegments) {
+        this.router.navigate([
+            {
+                outlets: {
+                    primary: urlSegments,
+                    rightSidenav: null,
+                },
+            },
+        ]);
+    }
+    /**
+     * Listens for update events from CommonService and refreshes the grid accordingly.
+     * - For 'add' or 'update' actions: Updates the relevant row
+     * - For 'delete' action: Removes the row
+     * - Performs no action if:
+     *   - Grid API is not ready, or
+     *   - The update type doesn't match
+     */
+    constructor() {
+        effect(() => {
+            const update = this.commonService.updates();
+            if (!update || !this.gridApi)
+                return;
+            if (update.type === this.getEntityType?.()) {
+                switch (update.action) {
+                    case 'add':
+                    case 'update':
+                        this.updateRowInGrid(update.data);
+                        break;
+                    case 'delete':
+                        this.deleteRowFromGrid(update.data);
+                        break;
+                }
+            }
+        });
+    }
+    /**
+     * Update a single row in the grid
+     * @param rowData The updated row data
+     * @param idField The field name that serves as unique identifier (default: 'id')
+     */
+    updateRowInGrid(rowData, idField = 'id') {
+        const rowNode = this.gridApi.getRowNode(rowData[idField]);
+        if (rowNode) {
+            rowNode.setData(rowData);
+            const params = {
+                rowNodes: [rowNode],
+                force: true,
+                suppressFlash: false,
+            };
+            this.gridApi.refreshCells(params);
+        }
+        else {
+            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 setAccessRights() {
+        this.authenticationList = await lastValueFrom(this.sysFunctionProxy.getAuthentication(this.componentName())).catch((e) => {
+            return throwError(() => new Error(e));
+        });
+        try {
+            this.allowRead.set(this.authenticationList.find((f) => f.action == 'read')?.allow ?? false);
+            if (this.allowRead() == false) {
+                this.commonService.userNotAllowedToRead();
+                return false;
+            }
+            if (this.allowRead() == true && !this.readOnly()) {
+                this.allowAdd.set(this.authenticationList.find((f) => f.action == 'add')?.allow ?? false);
+                this.allowEdit.set(this.authenticationList.find((f) => f.action == 'edit')?.allow ??
+                    false);
+                this.allowDelete.set(this.authenticationList.find((f) => f.action == 'delete')?.allow ??
+                    false);
+                this.allowLog.set(this.authenticationList.find((f) => f.action == 'logAccess')?.allow ??
+                    false);
+            }
+            else {
+                this.allowAdd.set(false);
+                this.allowEdit.set(false);
+                this.allowDelete.set(false);
+                this.allowLog.set(false);
+            }
+        }
+        catch (error) {
+            this.allowAdd.set(false);
+            this.allowEdit.set(false);
+            this.allowDelete.set(false);
+            this.allowLog.set(false);
+            return false;
+        }
+        this.accessRightsProcessed.set(true);
+        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: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AgGridBase, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-ag-grid-base', imports: [], template: "<p>ag-grid-base works!</p>\n" }]
+        }], ctorParameters: () => [] });
+
+class AgGridSaveBase {
+    // Services
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    commonService = inject(CommonService);
+    alertService = inject(AlertService);
+    currentItem = signal({}, ...(ngDevMode ? [{ debugName: "currentItem" }] : []));
+    initialItem = {};
+    // Form tracking
+    formChanged = false;
+    // Signals
+    viewMode = signal('sidenav', ...(ngDevMode ? [{ debugName: "viewMode" }] : []));
+    // 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) {
+        this.closeAfterSave.set(value);
+    }
+    // Controls the visibility of additional editable fields (e.g., password, extra settings)
+    // When true, certain input fields become visible for editing
+    updateValid = signal(false, ...(ngDevMode ? [{ debugName: "updateValid" }] : []));
+    setUpdateValid(value) {
+        this.updateValid.set(value);
+    }
+    /**
+     * Determine view mode based on current route
+     */
+    determineViewMode() {
+        if (this.embedded() || this.dialogData?.embedded) {
+            this.viewMode.set('dialog');
+        }
+        else if (this.router.url.includes('(rightSidenav:')) {
+            this.viewMode.set('sidenav');
+        }
+        else {
+            this.viewMode.set('fullscreen');
+        }
+    }
+    /**
+     * Check for form changes
+     */
+    ngDoCheck() {
+        this.formChanged = !this.isEqual(this.currentItem(), this.initialItem);
+    }
+    isEqual(item1, item2) {
+        return JSON.stringify(item1) === JSON.stringify(item2);
+    }
+    /**
+     * Check if can deactivate component
+     */
+    async canDeactivate() {
+        if (this.formChanged) {
+            return await this.alertService.showConfirm('@UnsavedChangesConfirm');
+        }
+        return true;
+    }
+    /**
+     * Close sidenav or navigate back
+     */
+    closeSidenav() {
+        if (this.viewMode() === 'dialog' && this.dialogRef) {
+            this.dialogRef.close('saved');
+        }
+        else if (this.viewMode() === 'sidenav') {
+            this.router.navigate([{ outlets: { rightSidenav: null } }]);
+        }
+        else {
+            this.router.navigate(['/sys/NettyUser']);
+            this.commonService.toggleRightSidenav(false);
+        }
+    }
+    backClicked() {
+        if (this.viewMode() === 'dialog' && this.dialogRef) {
+            this.dialogRef.close('back');
+        }
+        else {
+            this.commonService.goBack();
+        }
+    }
+    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: [""] });
+}
+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"] }]
+        }] });
+
+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" }]
+        }] });
+
+class AuthenticationGuard {
+    router = inject(Router);
+    credentialsService = inject(CredentialsService);
+    canActivate(route, state) {
+        if (this.credentialsService.isAuthenticated()) {
+            return true;
+        }
+        if (state.url.includes('login')) {
+            this.router.navigate([state.url], { replaceUrl: false });
+        }
+        else {
+            this.router.navigate(['/login'], {
+                queryParams: { redirect: state.url },
+                replaceUrl: true,
+            });
+        }
+        return false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationGuard, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationGuard, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationGuard, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class LoginDto {
+    userName = '';
+    password = '';
+    application = '';
+    constructor(_userName, _password, _application) {
+        this.userName = _userName ?? '';
+        this.password = _password ?? '';
+        this.application = _application ?? '';
+    }
+}
+
+class MFACodeDto {
+    sid = '';
+    mfacode = '';
+    constructor(_sid, _mfacode) {
+        this.sid = _sid;
+        this.mfacode = _mfacode;
+    }
+}
+
+class AuthenticationService {
+    credentialsService = inject(CredentialsService);
+    environmentProxy = inject(EnvironmentProxy);
+    http = inject(HttpClient);
+    static counter = 0;
+    /**
+     * Authenticates the user.
+     * @param context The login parameters.
+     * @return The user credentials.
+     */
+    login(context) {
+        // Prepare Connection URL
+        let loginUrl = this.environmentProxy.getAdminLink('Login');
+        let loginDto = new LoginDto(context.username, context.password, this.environmentProxy.getApplicationName());
+        let reqHeader = new HttpHeaders({
+            'Content-Type': 'application/json',
+            'No-Auth': 'True',
+        });
+        let loginCall$ = this.http.post(loginUrl, loginDto, {
+            headers: reqHeader,
+        });
+        // Return an observable for the connection which has pipes to
+        // process the incoming data before passing it to the caller
+        // This process maps the incoming data into Credentials format
+        // and saves the credentials into localstorage
+        return loginCall$.pipe(map$1((record) => {
+            let token = record.toString();
+            let decodedToken = this.decodeToken(token);
+            let data = {
+                username: context.username,
+                token: token,
+                role: this.getClaim(decodedToken, 'http://schemas.microsoft.com/ws/2008/06/identity/claims/role'),
+                authenticationMethod: this.getClaim(decodedToken, 'http://schemas.microsoft.com/ws/2008/06/identity/claims/authenticationmethod'),
+                sid: this.getClaim(decodedToken, 'http://schemas.xmlsoap.org/ws/2005/05/identity/claims/sid'),
+            };
+            // Parse JWT
+            this.credentialsService.setCredentials(data, context.remember);
+            return data;
+        }), take(1), catchError((error) => {
+            let errorMessage = '';
+            switch (error.status) {
+                case '404':
+                    if (AuthenticationService.counter == 0) {
+                        AuthenticationService.counter++;
+                        return this.login(context);
+                    }
+                    break;
+                case '415':
+                case '500':
+                    errorMessage =
+                        error.status + ' ' + (error.error?.detail ?? error.message ?? '');
+                    break;
+                default:
+                    errorMessage =
+                        error.status +
+                            ' ' +
+                            (error?.error?.title ?? error?.message ?? error ?? 'Error.');
+                    break;
+            }
+            return throwError(() => new Error(errorMessage ?? ''));
+        }));
+    }
+    /** Parse the claim sections of the given JWT token
+     *
+     * @param token Token to parse
+     * @returns
+     */
+    decodeToken(token) {
+        let parts = token.split('.');
+        let decodedTokenStr = Buffer.from(parts[1], 'base64').toString();
+        let decodedToken = JSON.parse(decodedTokenStr);
+        // console.log('decoded Token:', decodedToken);
+        return decodedToken;
+    }
+    /** Get the claim data from the given token claim json
+     *
+     * @param decodedToken
+     * @param claimKey
+     * @returns
+     */
+    getClaim(decodedToken, claimKey) {
+        try {
+            return decodedToken ? decodedToken[claimKey] : null;
+        }
+        catch (error) {
+            return null;
+        }
+    }
+    mfaLogin(context) {
+        // Prepare Connection URL
+        let mfaCodeUrl = this.environmentProxy.getAdminLink('ValidateMFACode');
+        let credentials = this.credentialsService.getCredentials();
+        let mfaCodeDto = new MFACodeDto(credentials.sid, context.mfaCode);
+        let reqHeader = new HttpHeaders({
+            'Content-Type': 'application/json',
+            'No-Auth': 'True',
+        });
+        let mfaCodeCall$ = this.http.post(mfaCodeUrl, mfaCodeDto, {
+            headers: reqHeader,
+        });
+        return mfaCodeCall$.pipe(map$1((message) => {
+            return message;
+        }), take(1), catchError((error) => {
+            let errorMessage = '';
+            errorMessage =
+                error.status +
+                    ' ' +
+                    (error?.error?.title ?? error?.message ?? error ?? 'Error.');
+            return throwError(() => new Error(errorMessage ?? ''));
+        }));
+    }
+    resendMFACode(context) {
+        // Prepare Connection URL
+        let mfaCodeUrl = this.environmentProxy.getAdminLink('ResendMFACode');
+        let credentials = this.credentialsService.getCredentials();
+        let mfaCodeDto = new MFACodeDto(credentials.sid, context.mfaCode);
+        let reqHeader = new HttpHeaders({
+            'Content-Type': 'application/json',
+            'No-Auth': 'True',
+        });
+        let resendMFACodeCall$ = this.http.post(mfaCodeUrl, mfaCodeDto, {
+            headers: reqHeader,
+        });
+        console.log('mfaCodeUrl', mfaCodeUrl);
+        return resendMFACodeCall$.pipe(map$1((message) => {
+            return message;
+        }), take(1), catchError((error) => {
+            let errorMessage = '';
+            errorMessage =
+                error.status +
+                    ' ' +
+                    (error?.error?.title ?? error?.message ?? error ?? 'Error.');
+            return throwError(() => new Error(errorMessage ?? ''));
+        }));
+    }
+    /**
+     * Logs out the user and clear credentials.
+     * @return True if the user was logged out successfully.
+     */
+    logout() {
+        // Customize credentials invalidation here
+        this.credentialsService.setCredentials();
+        localStorage.clear();
+        return of(true);
+    }
+    /** Send a pasword reset e-mail
+     *
+     * @param context
+     * @returns
+     */
+    forgotPassword(context) {
+        // Prepare Connection URL
+        let loginUrl = this.environmentProxy.getAdminLink('ForgotPassword');
+        let loginDto = new LoginDto(context.username, '', this.environmentProxy.getApplicationName());
+        let reqHeader = new HttpHeaders({
+            'Content-Type': 'application/json',
+            'No-Auth': 'True',
+        });
+        let loginCall$ = this.http.post(loginUrl, loginDto, { headers: reqHeader });
+        // Return an observable for the connection which has pipes to
+        // process the incoming data before passing it to the caller
+        // This process maps the incoming data into Credentials format
+        // and saves the credentials into localstorage
+        return loginCall$.pipe(map$1((message) => {
+            return message;
+        }), take(1), catchError((error) => {
+            let errorMessage = '';
+            errorMessage =
+                error.status +
+                    ' ' +
+                    (error?.error?.title ?? error?.message ?? error ?? 'Error.');
+            return throwError(() => new Error(errorMessage ?? ''));
+        }));
+    }
+    getAdminLink(path = '') {
+        return this.environmentProxy.getAdminLink(path);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthenticationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class AuthBase {
+    // Inject dependencies
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    environmentProxy = inject(EnvironmentProxy);
+    i18nService = inject(I18nService);
+    alertService = inject(AlertService);
+    urlHelperService = inject(UrlHelperService);
+    onDestroy$ = new Subject();
+    ngOnDestroy() {
+        //Called once, before the instance is destroyed.
+        //Add 'implements OnDestroy' to the class.
+        this.onDestroy$.next();
+        this.onDestroy$.complete();
+    }
+    // Language
+    icon = model(false, ...(ngDevMode ? [{ debugName: "icon" }] : []));
+    get currentLanguage() {
+        return this.i18nService.language;
+    }
+    get languages() {
+        return this.i18nService.supportedLanguages;
+    }
+    setLanguage(language) {
+        this.i18nService.language = language;
+        window.location.reload();
+    }
+    getCurrentLanguageIcon() {
+        switch (this.i18nService.language) {
+            case 'Türkçe':
+                return 'fi fi-tr';
+            case 'English':
+                return 'fi fi-us';
+            default:
+                return 'fi fi-tr';
+        }
+    }
+    getLanguageIcon(language) {
+        switch (language) {
+            case 'Türkçe':
+                return 'fi fi-tr';
+            case 'English':
+                return 'fi fi-us';
+            default:
+                return 'fi fi-tr';
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthBase, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AuthBase, isStandalone: true, selector: "ntybase-auth-base", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { icon: "iconChange" }, ngImport: i0, template: "<p>auth-base works!</p>\n", styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AuthBase, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-auth-base', imports: [], template: "<p>auth-base works!</p>\n" }]
+        }] });
+
+class Login extends AuthBase {
+    // Inject dependencies
+    authService = inject(AuthenticationService);
+    formBuilder = inject(FormBuilder);
+    loginForm = this.formBuilder.group({
+        username: ['', Validators.required],
+        password: ['', Validators.required],
+        remember: [false],
+    });
+    version = this.environmentProxy.version();
+    isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    error = signal(undefined, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    credentials = {
+        username: '',
+        password: '',
+        remember: false,
+    };
+    ngOnInit() {
+        this.authService.getAdminLink('Login');
+        this.timeout(500).then(() => this.authService.getAdminLink('Login'));
+    }
+    timeout(ms) {
+        return new Promise((resolve) => setTimeout(resolve, ms));
+    }
+    login() {
+        this.isLoading.set(true);
+        // Get the form values
+        const formValues = this.loginForm.value;
+        this.authService
+            .login(formValues) // Use the form values directly
+            .pipe(finalize(() => {
+            this.isLoading.set(false);
+            this.loginForm.markAsPristine();
+        }))
+            .subscribe({
+            next: (credentials) => {
+                try {
+                    let redirectUrl = '/mfalogin';
+                    if (credentials.authenticationMethod === 'NONE') {
+                        redirectUrl = this.route.snapshot.queryParams['redirect'] || '/';
+                        redirectUrl = this.urlHelperService.cleanUrl(redirectUrl);
+                    }
+                    this.urlHelperService
+                        .navigate(redirectUrl)
+                        .catch(() => this.router.navigate(['/'], { replaceUrl: true }));
+                }
+                catch (error) {
+                    this.router.navigate(['/'], { replaceUrl: true });
+                }
+            },
+            error: (error) => {
+                const errorMessage = error.message || '@LoginFailed';
+                this.error.set(errorMessage); // Set the error signal
+                this.alertService.showError(errorMessage);
+            },
+        });
+    }
+    onForgotPassword() {
+        this.isLoading.set(true);
+        const forgotPassword$ = this.authService.forgotPassword(this.loginForm.value);
+        forgotPassword$
+            .pipe(finalize(() => {
+            this.loginForm.markAsPristine();
+            this.isLoading.set(false);
+        }))
+            .subscribe({
+            next: (message) => {
+                this.alertService.showSuccess(message);
+            },
+            error: (error) => {
+                this.error.set(error.message);
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Login, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: Login, isStandalone: true, selector: "ntybase-login", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\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    <h2>Netty Admin Core</h2>\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\n    <form\n      (ngSubmit)=\"login()\"\n      [formGroup]=\"loginForm\"\n      *ngIf=\"!isLoading(); else loading\"\n      novalidate\n    >\n      <div class=\"error-message\" *ngIf=\"error()\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          formControlName=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          required\n        />\n        <mat-error\n          class=\"validation-error\"\n          *ngIf=\"loginForm.controls['username'].invalid && loginForm.controls['username'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Username is required' | translate }}\n        </mat-error>\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"password\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"password\"\n          formControlName=\"password\"\n          [placeholder]=\"'@password' | translate\"\n          required\n        />\n        <div\n          class=\"validation-error\"\n          *ngIf=\"loginForm.controls['password'].invalid && loginForm.controls['password'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Password is required' | translate }}\n        </div>\n      </div>\n\n      <div class=\"form-group remember\">\n        <input type=\"checkbox\" id=\"remember\" formControlName=\"remember\" />\n        <label for=\"remember\">{{ '@rememberMe' | translate }}</label>\n        <a class=\"forgot-password\" (click)=\"onForgotPassword()\"\n          >{{ '@forgotPassword' | translate }}</a\n        >\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n    </form>\n\n    <ng-template #loading>\n      <div class=\"loading-spinner\">\n        <span>{{ '@loggingIn' | translate }}</span>\n      </div>\n    </ng-template>\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media (max-width: 768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { 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: Login, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-login', imports: [
+                        FormsModule,
+                        ReactiveFormsModule,
+                        CommonModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        MatInputModule,
+                        MatFormFieldModule,
+                        TranslateModule,
+                    ], template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\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    <h2>Netty Admin Core</h2>\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\n    <form\n      (ngSubmit)=\"login()\"\n      [formGroup]=\"loginForm\"\n      *ngIf=\"!isLoading(); else loading\"\n      novalidate\n    >\n      <div class=\"error-message\" *ngIf=\"error()\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          formControlName=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          required\n        />\n        <mat-error\n          class=\"validation-error\"\n          *ngIf=\"loginForm.controls['username'].invalid && loginForm.controls['username'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Username is required' | translate }}\n        </mat-error>\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"password\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"password\"\n          formControlName=\"password\"\n          [placeholder]=\"'@password' | translate\"\n          required\n        />\n        <div\n          class=\"validation-error\"\n          *ngIf=\"loginForm.controls['password'].invalid && loginForm.controls['password'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Password is required' | translate }}\n        </div>\n      </div>\n\n      <div class=\"form-group remember\">\n        <input type=\"checkbox\" id=\"remember\" formControlName=\"remember\" />\n        <label for=\"remember\">{{ '@rememberMe' | translate }}</label>\n        <a class=\"forgot-password\" (click)=\"onForgotPassword()\"\n          >{{ '@forgotPassword' | translate }}</a\n        >\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n    </form>\n\n    <ng-template #loading>\n      <div class=\"loading-spinner\">\n        <span>{{ '@loggingIn' | translate }}</span>\n      </div>\n    </ng-template>\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media (max-width: 768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+        }] });
+
+class MfaLogin extends AuthBase {
+    // Inject dependencies
+    authService = inject(AuthenticationService);
+    formBuilder = inject(FormBuilder);
+    // Component state
+    version = this.environmentProxy.version();
+    isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    error = signal(undefined, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    resendable = signal(false, ...(ngDevMode ? [{ debugName: "resendable" }] : []));
+    startFrom = signal(120, ...(ngDevMode ? [{ debugName: "startFrom" }] : []));
+    remainingTime = signal(0, ...(ngDevMode ? [{ debugName: "remainingTime" }] : []));
+    countdownInterval;
+    loginForm = this.formBuilder.group({
+        mfaCode: ['', Validators.required],
+    });
+    ngOnInit() {
+        this.startCountdown(this.startFrom());
+    }
+    // Yeni: Geri sayım fonksiyonu
+    startCountdown(seconds) {
+        clearInterval(this.countdownInterval);
+        this.remainingTime.set(seconds);
+        this.resendable.set(false);
+        this.countdownInterval = setInterval(() => {
+            this.remainingTime.update((t) => {
+                const newTime = t - 1;
+                if (newTime <= 0) {
+                    clearInterval(this.countdownInterval);
+                    this.resendable.set(true);
+                    return 0;
+                }
+                return newTime;
+            });
+        }, 1000);
+    }
+    // Yeni: Formatlı zaman gösterimi
+    getFormattedTime() {
+        const mins = Math.floor(this.remainingTime() / 60);
+        const secs = this.remainingTime() % 60;
+        return `${mins}:${secs < 10 ? '0' + secs : secs}`;
+    }
+    login() {
+        if (this.resendable()) {
+            this.error.set('MFACode expired. Please request a new one.');
+            return;
+        }
+        this.isLoading.set(true);
+        this.authService
+            .mfaLogin(this.loginForm.value)
+            .pipe(finalize(() => {
+            this.isLoading.set(false);
+            this.loginForm.markAsPristine();
+        }))
+            .subscribe({
+            next: (credentials) => {
+                if (credentials) {
+                    try {
+                        let redirectUrl = this.route.snapshot.queryParams['redirect'] || '/';
+                        redirectUrl = this.urlHelperService.cleanUrl(redirectUrl);
+                        this.urlHelperService
+                            .navigate(redirectUrl)
+                            .catch(() => this.router.navigate(['/'], { replaceUrl: true }));
+                    }
+                    catch (error) {
+                        this.router.navigate(['/'], { replaceUrl: true });
+                    }
+                }
+            },
+            error: (error) => {
+                this.error.set(error.message);
+            },
+        });
+    }
+    onResendMFACode() {
+        this.startFrom.set(121);
+        this.authService
+            .resendMFACode(this.loginForm.value)
+            .pipe(finalize(() => {
+            this.isLoading.set(false);
+            this.loginForm.markAsPristine();
+            this.startCountdown(120);
+        }))
+            .subscribe({
+            next: (message) => {
+                this.startFrom.set(120);
+                if (message.length > 0) {
+                    this.alertService.showAlert('', message);
+                }
+            },
+            error: (error) => {
+                this.error.set(error.message);
+            },
+        });
+    }
+    ngOnDestroy() {
+        clearInterval(this.countdownInterval);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: MfaLogin, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: MfaLogin, isStandalone: true, selector: "ntybase-mfa-login", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\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    <h2>Netty Admin Core</h2>\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\n    <form\n      (ngSubmit)=\"login()\"\n      [formGroup]=\"loginForm\"\n      *ngIf=\"!isLoading(); else loading\"\n      novalidate\n    >\n      <div class=\"error-message\" *ngIf=\"error()\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"mfaCode\">{{'MFACode' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"mfaCode\"\n          formControlName=\"mfaCode\"\n          [placeholder]=\"'MFACode' | translate\"\n          required\n        />\n        <div\n          class=\"validation-error\"\n          *ngIf=\"loginForm.controls['mfaCode'].invalid && loginForm.controls['mfaCode'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'MFACode is required' | translate }}\n        </div>\n        <!-- Time -->\n        <div class=\"time-remaining\" *ngIf=\"!resendable()\">\n          {{ '@TokenCount' | translate }}: {{ getFormattedTime() }}\n        </div>\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading() || !resendable()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n\n      <div class=\"resend-container\" *ngIf=\"resendable()\">\n        <span (click)=\"onResendMFACode()\" class=\"resend-link\">\n          {{ 'Resend MFACode' | translate }}\n        </span>\n      </div>\n    </form>\n\n    <ng-template #loading>\n      <div class=\"loading-spinner\">\n        <span>{{ '@loggingIn' | translate }}</span>\n      </div>\n    </ng-template>\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--mfa-login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}.invalid-input{border:1px solid #dc3545!important}.invalid-input:focus{box-shadow:0 0 0 .2rem #dc354540}.resend-container{margin-top:15px;text-align:center}.resend-container .resend-link{color:#007bff;cursor:pointer;text-decoration:underline;font-size:13px}.resend-container .resend-link:hover{color:#0056b3}.time-remaining{margin-top:16px;font-size:1rem;color:#f5f5f5}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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: MatIconModule }, { 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: MfaLogin, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-mfa-login', imports: [
+                        FormsModule,
+                        ReactiveFormsModule,
+                        CommonModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        TranslateModule,
+                    ], template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\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    <h2>Netty Admin Core</h2>\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\n    <form\n      (ngSubmit)=\"login()\"\n      [formGroup]=\"loginForm\"\n      *ngIf=\"!isLoading(); else loading\"\n      novalidate\n    >\n      <div class=\"error-message\" *ngIf=\"error()\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"mfaCode\">{{'MFACode' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"mfaCode\"\n          formControlName=\"mfaCode\"\n          [placeholder]=\"'MFACode' | translate\"\n          required\n        />\n        <div\n          class=\"validation-error\"\n          *ngIf=\"loginForm.controls['mfaCode'].invalid && loginForm.controls['mfaCode'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'MFACode is required' | translate }}\n        </div>\n        <!-- Time -->\n        <div class=\"time-remaining\" *ngIf=\"!resendable()\">\n          {{ '@TokenCount' | translate }}: {{ getFormattedTime() }}\n        </div>\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading() || !resendable()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n\n      <div class=\"resend-container\" *ngIf=\"resendable()\">\n        <span (click)=\"onResendMFACode()\" class=\"resend-link\">\n          {{ 'Resend MFACode' | translate }}\n        </span>\n      </div>\n    </form>\n\n    <ng-template #loading>\n      <div class=\"loading-spinner\">\n        <span>{{ '@loggingIn' | translate }}</span>\n      </div>\n    </ng-template>\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--mfa-login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}.invalid-input{border:1px solid #dc3545!important}.invalid-input:focus{box-shadow:0 0 0 .2rem #dc354540}.resend-container{margin-top:15px;text-align:center}.resend-container .resend-link{color:#007bff;cursor:pointer;text-decoration:underline;font-size:13px}.resend-container .resend-link:hover{color:#0056b3}.time-remaining{margin-top:16px;font-size:1rem;color:#f5f5f5}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}\n"] }]
+        }] });
+
+class PasswordProxy {
+    noAuthReqHeader;
+    http = inject(HttpClient);
+    environmentProxy = inject(EnvironmentProxy);
+    constructor() {
+        this.noAuthReqHeader = new HttpHeaders({
+            'Content-Type': 'application/json',
+            'No-Auth': 'True',
+        });
+    }
+    /** Get forgot password record with the given recordGUID, if its still valid.
+     *
+     * @param recordGUID
+     * @returns
+     */
+    getForgotPasswordRecord(recordGUID) {
+        let functionUrl = this.environmentProxy.getAdminLink('GetForgotPasswordRecord');
+        return this.http.get(functionUrl + '/' + recordGUID, {
+            headers: this.noAuthReqHeader,
+        });
+    }
+    /** Send reset password request for password change
+     *
+     * @param newPasswordDto
+     * @returns
+     */
+    resetPassword(newPasswordDto) {
+        let resetPasswordUrl = this.environmentProxy.getAdminLink('UpdatePassword');
+        let resertPasswordCall$ = this.http.post(resetPasswordUrl, newPasswordDto, {
+            headers: this.noAuthReqHeader,
+        });
+        return resertPasswordCall$.pipe(map((message) => {
+            return message;
+        }), take$1(1), catchError$1((error) => {
+            let errorMessage = '';
+            errorMessage =
+                error.status +
+                    ' ' +
+                    (error?.error?.title ?? error?.message ?? error ?? 'Error.');
+            return throwError(() => new Error(errorMessage ?? ''));
+        }));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: PasswordProxy, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: PasswordProxy, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: PasswordProxy, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class ForgotPasswordDto {
+    nettyPasswordChangeGUID = null;
+    nettyUserGUID = null;
+    nettyUserName = null;
+    nettyUserFullName = null;
+    nettyValidUntil = null;
+    nettyEMailParametersGUID = null;
+    nettyIsUsed = null;
+    nettyUsedDate = null;
+    init() {
+        this.nettyPasswordChangeGUID = null;
+        this.nettyUserGUID = null;
+        this.nettyUserName = '';
+        this.nettyUserFullName = '';
+        this.nettyValidUntil = null;
+        this.nettyEMailParametersGUID = null;
+        this.nettyIsUsed = true;
+        this.nettyUsedDate = null;
+    }
+}
+
+class NewPasswordDto {
+    nettyPasswordChangeGUID = null;
+    nettyUserGUID = null;
+    nettyUserName = '';
+    password = '';
+    passwordCheck = '';
+    init() {
+        this.nettyPasswordChangeGUID = null;
+        this.nettyUserGUID = null;
+        this.nettyUserName = '';
+        this.password = '';
+        this.passwordCheck = '';
+    }
+    constructor() { }
+    static create(_nettyUserGUID, _nettyPasswordChangeGUID, _password, _passwordCheck) {
+        let obj = new NewPasswordDto();
+        obj.nettyUserGUID = _nettyUserGUID;
+        obj.nettyPasswordChangeGUID = _nettyPasswordChangeGUID;
+        obj.password = _password;
+        obj.passwordCheck = _passwordCheck;
+        return obj;
+    }
+}
+
+class ForgotPassword extends AuthBase {
+    // Inject dependencies
+    formBuilder = inject(FormBuilder);
+    passwordService = inject(PasswordProxy);
+    version = this.environmentProxy.version();
+    isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    error = signal(undefined, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    updatePasswordForm;
+    //URL parameters
+    urlOption = null;
+    forgotPasswordRecord = new ForgotPasswordDto();
+    constructor() {
+        super();
+        this.updatePasswordForm = this.formBuilder.group({
+            username: [{ value: '', disabled: true }, Validators.required],
+            newPassword: ['', Validators.required],
+            newPasswordCheck: ['', Validators.required],
+        });
+    }
+    ngOnInit() {
+        this.route.paramMap.pipe(takeUntil(this.onDestroy$)).subscribe((params) => {
+            this.urlOption = params.get('requestguid');
+            this.getData();
+        });
+    }
+    getData() {
+        this.isLoading.set(true);
+        this.passwordService
+            .getForgotPasswordRecord(this.urlOption)
+            .pipe(finalize(() => {
+            this.isLoading.set(false);
+        }))
+            .subscribe({
+            next: (data) => {
+                this.isLoading.set(false);
+                this.updatePasswordForm.get('username')?.setValue(data.nettyUserName);
+                this.forgotPasswordRecord = data;
+            },
+            error: (error) => {
+                this.alertService.showError(error.message);
+            },
+        });
+    }
+    updatePassword() {
+        let newPasswordDto = NewPasswordDto.create(this.forgotPasswordRecord.nettyUserGUID, this.forgotPasswordRecord.nettyPasswordChangeGUID, this.updatePasswordForm.get('newPassword')?.value, this.updatePasswordForm.get('newPasswordCheck')?.value);
+        this.isLoading.set(true);
+        this.passwordService
+            .resetPassword(newPasswordDto)
+            .pipe(finalize(() => {
+            this.isLoading.set(false);
+        }))
+            .subscribe({
+            next: (result) => {
+                if (result) {
+                    this.alertService.showSuccess('@PasswordChangeSuccess');
+                    this.router.navigate(['/login']);
+                }
+            },
+            error: (error) => {
+                this.error.set(error.message);
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ForgotPassword, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: ForgotPassword, isStandalone: true, selector: "ntybase-forgot-password", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\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    <h2>Netty Admin Core</h2>\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\n    <form\n      (ngSubmit)=\"updatePassword()\"\n      [formGroup]=\"updatePasswordForm\"\n      *ngIf=\"!isLoading(); else loading\"\n      novalidate\n    >\n      <div class=\"error-message\" *ngIf=\"error()\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          formControlName=\"username\"\n          required\n        />\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPassword\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPassword\"\n          [placeholder]=\"'@password' | translate\"\n          formControlName=\"newPassword\"\n          required\n        />\n        <mat-error\n          class=\"validation-error\"\n          *ngIf=\"updatePasswordForm.controls['newPassword'].invalid && updatePasswordForm.controls['newPassword'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Password is required' | translate }}\n        </mat-error>\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPasswordCheck\">{{'@passwordCheck' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPasswordCheck\"\n          [placeholder]=\"'@passwordCheck' | translate\"\n          formControlName=\"newPasswordCheck\"\n          required\n        />\n        <mat-error\n          class=\"validation-error\"\n          *ngIf=\"updatePasswordForm.controls['newPasswordCheck'].invalid && updatePasswordForm.controls['newPasswordCheck'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Password is required' | translate }}\n        </mat-error>\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"updatePasswordForm.invalid\"\n      >\n        {{ '@setPassword' | translate }}\n      </button>\n    </form>\n\n    <ng-template #loading>\n      <div class=\"loading-spinner\">\n        <span>{{ '@updatingPassword' | translate }}</span>\n      </div>\n    </ng-template>\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--forgot-password-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media (max-width: 768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { 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: ForgotPassword, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-forgot-password', imports: [
+                        FormsModule,
+                        ReactiveFormsModule,
+                        CommonModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        MatInputModule,
+                        MatFormFieldModule,
+                        TranslateModule,
+                    ], template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\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    <h2>Netty Admin Core</h2>\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\n    <form\n      (ngSubmit)=\"updatePassword()\"\n      [formGroup]=\"updatePasswordForm\"\n      *ngIf=\"!isLoading(); else loading\"\n      novalidate\n    >\n      <div class=\"error-message\" *ngIf=\"error()\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          formControlName=\"username\"\n          required\n        />\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPassword\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPassword\"\n          [placeholder]=\"'@password' | translate\"\n          formControlName=\"newPassword\"\n          required\n        />\n        <mat-error\n          class=\"validation-error\"\n          *ngIf=\"updatePasswordForm.controls['newPassword'].invalid && updatePasswordForm.controls['newPassword'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Password is required' | translate }}\n        </mat-error>\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPasswordCheck\">{{'@passwordCheck' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPasswordCheck\"\n          [placeholder]=\"'@passwordCheck' | translate\"\n          formControlName=\"newPasswordCheck\"\n          required\n        />\n        <mat-error\n          class=\"validation-error\"\n          *ngIf=\"updatePasswordForm.controls['newPasswordCheck'].invalid && updatePasswordForm.controls['newPasswordCheck'].touched\"\n        >\n          <span class=\"error-icon\">!</span>\n          {{ 'Password is required' | translate }}\n        </mat-error>\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"updatePasswordForm.invalid\"\n      >\n        {{ '@setPassword' | translate }}\n      </button>\n    </form>\n\n    <ng-template #loading>\n      <div class=\"loading-spinner\">\n        <span>{{ '@updatingPassword' | translate }}</span>\n      </div>\n    </ng-template>\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--forgot-password-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media (max-width: 768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+        }], ctorParameters: () => [] });
+
+class HttpError403 {
+    attemptedUrl = '';
+    routeSubscription;
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    location = inject(Location);
+    commonService = inject(CommonService);
+    constructor() {
+        // Router'dan state'i al
+        const navigation = this.router.getCurrentNavigation();
+        this.attemptedUrl = navigation?.extras.state?.['attemptedUrl'] || '';
+        // Eğer state'ten gelmediyse, mevcut URL'i temizleyerek kullan
+        if (!this.attemptedUrl) {
+            this.attemptedUrl = this.getCleanUrlPath();
+        }
+        this.routeSubscription = this.router.events.subscribe(() => {
+            this.updateAttemptedUrl();
+        });
+    }
+    ngOnInit() {
+        // 1. URL'deki secondary outlet'leri temizle (örneğin: "(rightSidenav:...)")
+        this.cleanUrlFromFragments();
+        // 2. Hata mesajı için attemptedUrl'i güncelle
+        this.updateAttemptedUrl();
+        // 3. Right sidenav'ı kapat
+        this.commonService.toggleRightSidenav(false);
+    }
+    ngOnDestroy() {
+        if (this.routeSubscription) {
+            this.routeSubscription.unsubscribe();
+        }
+    }
+    /**
+     * URL'deki fragment ve outlet'leri temizler.
+     * Örnek: "/sys/NettyUserGroup(rightSidenav:...)" → "/sys/NettyUserGroup"
+     */
+    cleanUrlFromFragments() {
+        const currentUrl = this.router.url;
+        const cleanUrl = currentUrl.split('(')[0]; // "(" sonrasını sil
+        if (currentUrl !== cleanUrl) {
+            // URL'yi temizlenmiş haliyle değiştir (tarayıcı geçmişine eklemeden)
+            this.router.navigateByUrl(cleanUrl, {
+                replaceUrl: true,
+                skipLocationChange: false,
+            });
+        }
+    }
+    /**
+     * attemptedUrl'i güncel router URL'ine göre günceller
+     */
+    updateAttemptedUrl() {
+        this.attemptedUrl = this.getCleanUrlPath();
+    }
+    /**
+     * Temizlenmiş URL yolunu döndürür (queryParams ve fragment olmadan).
+     */
+    getCleanUrlPath() {
+        return this.router.url.split('?')[0].split('(')[0];
+    }
+    goHome() {
+        this.router.navigate(['/'], { replaceUrl: true });
+        this.commonService.toggleRightSidenav(false);
+    }
+    goBack() {
+        this.location.back();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: HttpError403, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: HttpError403, isStandalone: true, selector: "ntybase-http-error403", ngImport: i0, template: "<div class=\"error-container\">\n  <div class=\"error-page\">\n    <h1>403 - Eri\u015Fim Engellendi</h1>\n\n    <p>\n      <strong>\u00DCzg\u00FCn\u00FCz, {{ attemptedUrl }}</strong> sayfas\u0131na eri\u015Fim izniniz\n      bulunmamaktad\u0131r.\n    </p>\n\n    <p class=\"error-detail\">\n      Bu sayfay\u0131 g\u00F6r\u00FCnt\u00FClemek i\u00E7in gerekli yetkilere sahip de\u011Filsiniz. E\u011Fer bu\n      bir hata oldu\u011Funu d\u00FC\u015F\u00FCn\u00FCyorsan\u0131z, l\u00FCtfen sistem y\u00F6neticinizle ileti\u015Fime\n      ge\u00E7in.\n    </p>\n    <button mat-raised-button (click)=\"goHome()\" color=\"primary\" routerLink=\"/\">\n      Ana Sayfaya D\u00F6n\n    </button>\n    <button mat-raised-button (click)=\"goBack()\" color=\"primary\" routerLink=\"/\">\n      Geri D\u00F6n\n    </button>\n  </div>\n</div>\n", styles: [".error-container{background-image:var(--httperror403-bg-image, linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)), url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-blend-mode:overlay;height:100vh;width:100%;background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.error-page{text-align:center;padding:3rem;max-width:650px;margin:0 auto;background-color:#000000b3;border-radius:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 32px #0000004d;animation:fadeIn .8s ease-in-out}.error-page h1{font-size:6rem;margin:0;color:var(--mat-sys-primary-container);text-shadow:0 4px 8px rgba(0,0,0,.3);font-weight:700}.error-page h3{font-size:1.8rem;margin-top:0;margin-bottom:1.5rem;color:#f8f9fa}.error-page p{margin:1.5rem 0;font-size:1.1rem;line-height:1.6;color:#e9ecef}.error-page strong{word-break:break-all;color:#ff6b6b;font-weight:500}button{margin:.5rem;padding:.8rem 2rem;font-size:1rem;font-weight:500;border-radius:50px;transition:all .3s ease;background-color:var(--mat-sys-primary);color:var(--mat-sys-on-primary)}button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){.error-page{padding:2rem;width:90%}.error-page h1{font-size:4rem}.error-page h3{font-size:1.5rem}button{display:block;width:100%;margin:.5rem 0}}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: HttpError403, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-http-error403', imports: [], template: "<div class=\"error-container\">\n  <div class=\"error-page\">\n    <h1>403 - Eri\u015Fim Engellendi</h1>\n\n    <p>\n      <strong>\u00DCzg\u00FCn\u00FCz, {{ attemptedUrl }}</strong> sayfas\u0131na eri\u015Fim izniniz\n      bulunmamaktad\u0131r.\n    </p>\n\n    <p class=\"error-detail\">\n      Bu sayfay\u0131 g\u00F6r\u00FCnt\u00FClemek i\u00E7in gerekli yetkilere sahip de\u011Filsiniz. E\u011Fer bu\n      bir hata oldu\u011Funu d\u00FC\u015F\u00FCn\u00FCyorsan\u0131z, l\u00FCtfen sistem y\u00F6neticinizle ileti\u015Fime\n      ge\u00E7in.\n    </p>\n    <button mat-raised-button (click)=\"goHome()\" color=\"primary\" routerLink=\"/\">\n      Ana Sayfaya D\u00F6n\n    </button>\n    <button mat-raised-button (click)=\"goBack()\" color=\"primary\" routerLink=\"/\">\n      Geri D\u00F6n\n    </button>\n  </div>\n</div>\n", styles: [".error-container{background-image:var(--httperror403-bg-image, linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)), url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-blend-mode:overlay;height:100vh;width:100%;background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.error-page{text-align:center;padding:3rem;max-width:650px;margin:0 auto;background-color:#000000b3;border-radius:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 32px #0000004d;animation:fadeIn .8s ease-in-out}.error-page h1{font-size:6rem;margin:0;color:var(--mat-sys-primary-container);text-shadow:0 4px 8px rgba(0,0,0,.3);font-weight:700}.error-page h3{font-size:1.8rem;margin-top:0;margin-bottom:1.5rem;color:#f8f9fa}.error-page p{margin:1.5rem 0;font-size:1.1rem;line-height:1.6;color:#e9ecef}.error-page strong{word-break:break-all;color:#ff6b6b;font-weight:500}button{margin:.5rem;padding:.8rem 2rem;font-size:1rem;font-weight:500;border-radius:50px;transition:all .3s ease;background-color:var(--mat-sys-primary);color:var(--mat-sys-on-primary)}button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){.error-page{padding:2rem;width:90%}.error-page h1{font-size:4rem}.error-page h3{font-size:1.5rem}button{display:block;width:100%;margin:.5rem 0}}\n"] }]
+        }], ctorParameters: () => [] });
+
+class HttpError404 {
+    attemptedUrl = '';
+    routeSubscription;
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    location = inject(Location);
+    commonService = inject(CommonService);
+    constructor() {
+        this.routeSubscription = this.router.events.subscribe(() => {
+            this.updateAttemptedUrl();
+        });
+    }
+    ngOnInit() {
+        // 1. URL'deki secondary outlet'leri temizle (örneğin: "(rightSidenav:...)")
+        this.cleanUrlFromFragments();
+        // 2. Hata mesajı için attemptedUrl'i güncelle
+        this.updateAttemptedUrl();
+        // 3. Right sidenav'ı kapat
+        this.commonService.toggleRightSidenav(false);
+    }
+    ngOnDestroy() {
+        if (this.routeSubscription) {
+            this.routeSubscription.unsubscribe();
+        }
+    }
+    /**
+     * URL'deki fragment ve outlet'leri temizler.
+     * Örnek: "/sys/NettyUserGroup(rightSidenav:...)" → "/sys/NettyUserGroup"
+     */
+    cleanUrlFromFragments() {
+        const currentUrl = this.router.url;
+        const cleanUrl = currentUrl.split('(')[0]; // "(" sonrasını sil
+        if (currentUrl !== cleanUrl) {
+            // URL'yi temizlenmiş haliyle değiştir (tarayıcı geçmişine eklemeden)
+            this.router.navigateByUrl(cleanUrl, {
+                replaceUrl: true,
+                skipLocationChange: false,
+            });
+        }
+    }
+    /**
+     * Temizlenmiş URL yolunu döndürür (queryParams ve fragment olmadan).
+     */
+    getCleanUrlPath() {
+        return this.router.url.split('?')[0].split('(')[0];
+    }
+    /**
+     * attemptedUrl'i güncel router URL'ine göre günceller
+     */
+    updateAttemptedUrl() {
+        this.attemptedUrl = this.getCleanUrlPath();
+    }
+    goHome() {
+        this.router.navigate(['/'], { replaceUrl: true });
+        this.commonService.toggleRightSidenav(false);
+    }
+    goBack() {
+        this.location.back();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: HttpError404, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: HttpError404, isStandalone: true, selector: "ntybase-http-error404", ngImport: i0, template: "<div class=\"error-container\">\n  <div class=\"error-page\">\n    <h1>404</h1>\n    <h3>Sayfa Bulunamad\u0131</h3>\n    <p><strong>{{ attemptedUrl }}</strong> adresi bulunamad\u0131.</p>\n    <p>Bu i\u00E7erik ta\u015F\u0131nm\u0131\u015F veya silinmi\u015F olabilir.</p>\n    <button mat-raised-button (click)=\"goHome()\" color=\"primary\" routerLink=\"/\">\n      Ana Sayfaya D\u00F6n\n    </button>\n    <button mat-raised-button (click)=\"goBack()\" color=\"primary\" routerLink=\"/\">\n      Geri D\u00F6n\n    </button>\n  </div>\n</div>\n", styles: [".error-container{background-image:var(--httperror404-bg-image, linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)), url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-blend-mode:overlay;height:100vh;width:100%;background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.error-page{text-align:center;padding:3rem;max-width:650px;margin:0 auto;background-color:#000000b3;border-radius:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 32px #0000004d;animation:fadeIn .8s ease-in-out}.error-page h1{font-size:6rem;margin:0;color:var(--mat-sys-primary-container);text-shadow:0 4px 8px rgba(0,0,0,.3);font-weight:700}.error-page h3{font-size:1.8rem;margin-top:0;margin-bottom:1.5rem;color:#f8f9fa}.error-page p{margin:1.5rem 0;font-size:1.1rem;line-height:1.6;color:#e9ecef}.error-page strong{word-break:break-all;color:#ff6b6b;font-weight:500}button{margin:.5rem;padding:.8rem 2rem;font-size:1rem;font-weight:500;border-radius:50px;transition:all .3s ease;background-color:var(--mat-sys-primary);color:var(--mat-sys-on-primary)}button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){.error-page{padding:2rem;width:90%}.error-page h1{font-size:4rem}.error-page h3{font-size:1.5rem}button{display:block;width:100%;margin:.5rem 0}}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: HttpError404, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-http-error404', imports: [], template: "<div class=\"error-container\">\n  <div class=\"error-page\">\n    <h1>404</h1>\n    <h3>Sayfa Bulunamad\u0131</h3>\n    <p><strong>{{ attemptedUrl }}</strong> adresi bulunamad\u0131.</p>\n    <p>Bu i\u00E7erik ta\u015F\u0131nm\u0131\u015F veya silinmi\u015F olabilir.</p>\n    <button mat-raised-button (click)=\"goHome()\" color=\"primary\" routerLink=\"/\">\n      Ana Sayfaya D\u00F6n\n    </button>\n    <button mat-raised-button (click)=\"goBack()\" color=\"primary\" routerLink=\"/\">\n      Geri D\u00F6n\n    </button>\n  </div>\n</div>\n", styles: [".error-container{background-image:var(--httperror404-bg-image, linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)), url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-blend-mode:overlay;height:100vh;width:100%;background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.error-page{text-align:center;padding:3rem;max-width:650px;margin:0 auto;background-color:#000000b3;border-radius:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 32px #0000004d;animation:fadeIn .8s ease-in-out}.error-page h1{font-size:6rem;margin:0;color:var(--mat-sys-primary-container);text-shadow:0 4px 8px rgba(0,0,0,.3);font-weight:700}.error-page h3{font-size:1.8rem;margin-top:0;margin-bottom:1.5rem;color:#f8f9fa}.error-page p{margin:1.5rem 0;font-size:1.1rem;line-height:1.6;color:#e9ecef}.error-page strong{word-break:break-all;color:#ff6b6b;font-weight:500}button{margin:.5rem;padding:.8rem 2rem;font-size:1rem;font-weight:500;border-radius:50px;transition:all .3s ease;background-color:var(--mat-sys-primary);color:var(--mat-sys-on-primary)}button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){.error-page{padding:2rem;width:90%}.error-page h1{font-size:4rem}.error-page h3{font-size:1.5rem}button{display:block;width:100%;margin:.5rem 0}}\n"] }]
+        }], ctorParameters: () => [] });
+
+class NettyMenuService {
+    http = inject(HttpClient);
+    environmentProxy = inject(EnvironmentProxy);
+    menuName = signal('', ...(ngDevMode ? [{ debugName: "menuName" }] : []));
+    menu = signal(null, ...(ngDevMode ? [{ debugName: "menu" }] : []));
+    constructor() {
+        effect(() => {
+            const currentMenuName = this.menuName();
+            let functionUrl = this.environmentProxy.getAdminLink('/GetMenu');
+            if (currentMenuName.trim().length > 0) {
+                functionUrl += '/' + currentMenuName.trim();
+            }
+            this.http.get(functionUrl).subscribe({
+                next: (data) => this.menu.set(data),
+                error: (err) => {
+                    console.error('Failed to fetch menu:', err);
+                    this.menu.set(null);
+                },
+            });
+        });
+    }
+    setMenuName(name) {
+        this.menuName.set(name);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NettyMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NettyMenuService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NettyMenuService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class LeftSidenav {
+    authService = inject(AuthenticationService);
+    router = inject(Router);
+    menuService = inject(NettyMenuService);
+    commonService = inject(CommonService);
+    environmentProxy = inject(EnvironmentProxy);
+    version = this.environmentProxy.version();
+    isMinimized = input(false, ...(ngDevMode ? [{ debugName: "isMinimized" }] : []));
+    toggleMinimize = output();
+    onToggleMinimize() {
+        this.toggleMinimize.emit();
+    }
+    logout() {
+        this.authService.logout().subscribe({
+            next: (success) => {
+                if (success) {
+                    const cleanUrl = this.commonService.getCleanUrlPath();
+                    this.router.navigateByUrl(cleanUrl, { replaceUrl: true }).then(() => {
+                        this.router.navigate(['/login']);
+                    });
+                }
+            },
+            error: (err) => {
+                console.error('Logout failed:', err);
+            },
+        });
+    }
+    // Menu Search
+    menuItems = signal([], ...(ngDevMode ? [{ debugName: "menuItems" }] : []));
+    searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : []));
+    originalMenuItems = signal([], ...(ngDevMode ? [{ debugName: "originalMenuItems" }] : []));
+    constructor() {
+        effect(() => {
+            const fetchedMenu = this.menuService.menu();
+            if (fetchedMenu) {
+                const processedItems = this.processMenuItems(fetchedMenu);
+                this.originalMenuItems.set(processedItems);
+            }
+            else {
+                this.originalMenuItems.set([]);
+            }
+        });
+    }
+    ngOnInit() {
+        this.menuService.setMenuName('');
+    }
+    processMenuItems(apiResponse) {
+        if (!apiResponse || !Array.isArray(apiResponse)) {
+            return [];
+        }
+        return apiResponse.map((item) => ({
+            name: item.label || item.name,
+            icon: item.icon || '',
+            link: item.route || item.link || '#',
+            expanded: false,
+            children: item.children ? this.processMenuItems(item.children) : [],
+        }));
+    }
+    filteredMenuItems = computed(() => {
+        const term = this.searchTerm().toLowerCase();
+        if (!term)
+            return this.originalMenuItems();
+        return this.filterMenuItems(this.originalMenuItems(), term);
+    }, ...(ngDevMode ? [{ debugName: "filteredMenuItems" }] : []));
+    filterMenuItems(items, term) {
+        const normalizedTerm = this.commonService.normalizeTurkish(term);
+        return items
+            .map((item) => {
+            const filteredChildren = item.children
+                ? this.filterMenuItems(item.children, term)
+                : [];
+            const normalizedName = this.commonService.normalizeTurkish(item.name);
+            const matches = normalizedName.includes(normalizedTerm) ||
+                filteredChildren.length > 0;
+            return matches
+                ? {
+                    ...item,
+                    children: filteredChildren,
+                    expanded: matches || filteredChildren.length > 0,
+                }
+                : null;
+        })
+            .filter((item) => item !== null);
+    }
+    toggleSubMenu(item) {
+        item.expanded = !item.expanded;
+    }
+    onSearch(term) {
+        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" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LeftSidenav, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-left-sidenav', imports: [
+                        CommonModule,
+                        MatIconModule,
+                        MatListModule,
+                        MatMenuModule,
+                        MatMenuTrigger,
+                        RouterLink,
+                        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"] }]
+        }], ctorParameters: () => [] });
+
+class Theme {
+    appTheme = signal('light', ...(ngDevMode ? [{ debugName: "appTheme" }] : []));
+    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() {
+        return this.themes;
+    }
+    setTheme(theme) {
+        this.appTheme.set(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);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Theme, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Theme, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Theme, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class ColorPalette {
+    themes = [];
+    currentTheme = signal(null, ...(ngDevMode ? [{ debugName: "currentTheme" }] : []));
+    setThemes(customThemes) {
+        this.themes = customThemes;
+        if (this.themes.length > 0 && !this.currentTheme()) {
+            this.currentTheme.set(this.themes[0]);
+        }
+    }
+    getThemes() {
+        return this.themes;
+    }
+    setTheme(themeId) {
+        const theme = this.themes.find((t) => t.id === themeId);
+        if (theme) {
+            this.currentTheme.set(theme);
+        }
+    }
+    updateThemeClass = effect(() => {
+        const theme = this.currentTheme();
+        if (theme) {
+            document.body.classList.remove(...this.themes.map((t) => `${t.id}-theme`));
+            document.body.classList.add(`${theme.id}-theme`);
+        }
+    }, ...(ngDevMode ? [{ debugName: "updateThemeClass" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ColorPalette, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ColorPalette, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ColorPalette, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class Toolbar {
+    themeService = inject(Theme);
+    colorPaletteService = inject(ColorPalette);
+    i18nService = inject(I18nService);
+    toggleSidenav = output();
+    onToggleSidenav() {
+        this.toggleSidenav.emit();
+    }
+    // Language
+    icon = model(false, ...(ngDevMode ? [{ debugName: "icon" }] : []));
+    get currentLanguage() {
+        return this.i18nService.language;
+    }
+    get languages() {
+        return this.i18nService.supportedLanguages;
+    }
+    setLanguage(language) {
+        this.i18nService.language = language;
+        window.location.reload();
+    }
+    getCurrentLanguageIcon() {
+        switch (this.i18nService.language) {
+            case 'Türkçe':
+                return 'fi fi-tr';
+            case 'English':
+                return 'fi fi-us';
+            default:
+                return 'fi fi-tr';
+        }
+    }
+    getLanguageIcon(language) {
+        switch (language) {
+            case 'Türkçe':
+                return 'fi fi-tr';
+            case 'English':
+                return 'fi fi-us';
+            default:
+                return 'fi fi-tr';
+        }
+    }
+    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" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: Toolbar, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-toolbar', imports: [
+                        MatIconModule,
+                        MatMenuModule,
+                        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"] }]
+        }] });
+
+class Guid {
+    value = this.empty;
+    constructor(value) {
+        if (value) {
+            if (Guid.isValid(value)) {
+                this.value = value;
+            }
+        }
+    }
+    static newGuid() {
+        return new Guid('xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
+            const r = (Math.random() * 16) | 0;
+            const v = c == 'x' ? r : (r & 0x3) | 0x8;
+            return v.toString(16);
+        }));
+    }
+    /**
+     * return all zeros '00000000-0000-0000-0000-000000000000'
+     */
+    static get empty() {
+        return '00000000-0000-0000-0000-000000000000';
+    }
+    get empty() {
+        return Guid.empty;
+    }
+    static isValid(str) {
+        const validRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
+        return validRegex.test(str);
+    }
+    toString() {
+        return this.value;
+    }
+    toJSON() {
+        return this.value;
+    }
+    /**
+     * True is guid is empty or not valid
+     * @param str
+     * @returns
+     */
+    static isNullOrEmpty(str) {
+        if (str == null || str == undefined) {
+            return true;
+        }
+        if (!Guid.isValid(str)) {
+            return true;
+        }
+        if (str == Guid.empty) {
+            return true;
+        }
+        return false;
+    }
+    /**
+     * True if the guid is valid and not all zeros (empty)
+     * @param str
+     * @returns
+     */
+    static isValidAndNotEmpty(str) {
+        return !Guid.isNullOrEmpty(str);
+    }
+    /**
+     * Return empty guid if the given guid is not valid
+     * @param guid
+     * @returns
+     */
+    static emptyWhenNull(guid) {
+        if (Guid.isValidAndNotEmpty(guid)) {
+            return guid;
+        }
+        return Guid.empty;
+    }
+}
+
+class AutoCompleteProxy {
+    http = inject(HttpClient);
+    environmentProxy = inject(EnvironmentProxy);
+    getAutocompleteDataFilter(searchTable, searchData) {
+        let functionUrl = this.environmentProxy.getServerLink(searchTable + '/AutoCompleteFilter');
+        return this.http.post(functionUrl, searchData);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompleteProxy, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompleteProxy, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompleteProxy, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class NtyAutoCompleteFilter {
+    coid = null;
+    searchString = null;
+    fields = null;
+}
+
+/**
+ * This component can load and display any container which is provided dynamically during run time
+ * The only requirement is the component that will be displayed should extend AgGridBaseComponent
+ */
+class AutoCompleteLookup {
+    data = inject(MAT_DIALOG_DATA);
+    container;
+    component = input(...(ngDevMode ? [undefined, { debugName: "component" }] : []));
+    filterField = input(null, ...(ngDevMode ? [{ debugName: "filterField" }] : []));
+    filterFieldValue = input(null, ...(ngDevMode ? [{ debugName: "filterFieldValue" }] : []));
+    filterFieldNumeric = input(false, ...(ngDevMode ? [{ debugName: "filterFieldNumeric" }] : []));
+    filterFieldEquality = input('=', ...(ngDevMode ? [{ debugName: "filterFieldEquality" }] : []));
+    // Output
+    selectedElement = output();
+    ngOnInit() {
+        // Initialize with dialog data first
+        if (this.data) {
+            this.loadComponent(this.data);
+        }
+    }
+    loadComponent(config) {
+        if (!config?.component)
+            return;
+        this.container.clear();
+        const componentRef = this.container.createComponent(config.component);
+        // Set all inputs using setInput
+        componentRef.setInput('popupValid', true);
+        componentRef.setInput('filterField', config.filterField);
+        componentRef.setInput('filterFieldValue', config.filterFieldValue);
+        componentRef.setInput('filterFieldEquality', config.filterFieldEquality);
+        componentRef.setInput('filterFieldNumeric', config.filterFieldNumeric);
+        // Handle output
+        const sub = componentRef.instance.selectedElement.subscribe((data) => {
+            this.selectedElement.emit(data);
+        });
+        // Cleanup
+        componentRef.onDestroy(() => sub.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompleteLookup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AutoCompleteLookup, isStandalone: true, selector: "ntybase-auto-complete-lookup", inputs: { component: { classPropertyName: "component", publicName: "component", 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" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: ` <ng-template #container></ng-template> `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompleteLookup, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ntybase-auto-complete-lookup',
+                    imports: [],
+                    template: ` <ng-template #container></ng-template> `,
+                }]
+        }], propDecorators: { container: [{
+                type: ViewChild,
+                args: ['container', { read: ViewContainerRef, static: true }]
+            }] } });
+
+class AutoCompletePopupMenu {
+    field = '';
+    recordGuid;
+    fieldDisabled = false;
+    componentPath = '';
+    inputValue = '';
+    Result = output();
+    clipboard = inject(Clipboard);
+    alertService = inject(AlertService);
+    ngOnInit() { }
+    gotoNew() {
+        if (!this.componentPath)
+            return;
+        // Split the component path into segments
+        const pathSegments = this.componentPath.split('/').filter((p) => p);
+        this.GotoNewTab(pathSegments, '', 'new');
+        this.Result.emit('New');
+    }
+    gotoMain() {
+        if (!this.componentPath || !this.recordGuid)
+            return;
+        // Split the component path into segments
+        const pathSegments = this.componentPath.split('/').filter((p) => p);
+        this.GotoNewTab(pathSegments, this.recordGuid, 'edit');
+        this.Result.emit('Main');
+    }
+    gotoLookup() {
+        if (!this.fieldDisabled) {
+            this.Result.emit('Lookup');
+        }
+    }
+    GotoNewTab(target, params, type) {
+        if (!target || target.length === 0)
+            return;
+        // Construct the URL directly in the format you want
+        let url = `/${target.join('/')}`;
+        // Add query parameters
+        const queryParams = [];
+        if (params) {
+            queryParams.push(`parameters=${encodeURIComponent(JSON.stringify(params))}`);
+        }
+        if (type) {
+            queryParams.push(`type=${type}`);
+        }
+        queryParams.push('isNewTab=true');
+        if (queryParams.length > 0) {
+            url += `?${queryParams.join('&')}`;
+        }
+        // Open in new tab
+        window.open(url, '_blank');
+    }
+    copyToClipboard() {
+        if (this.inputValue) {
+            this.clipboard.copy(this.inputValue);
+            this.alertService.showAlert('@CopiedToClipboard');
+            this.Result.emit('Copy');
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompletePopupMenu, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: AutoCompletePopupMenu, isStandalone: true, selector: "ntybase-auto-complete-popup-menu", inputs: { field: "field", recordGuid: "recordGuid", fieldDisabled: "fieldDisabled", componentPath: "componentPath", inputValue: "inputValue" }, outputs: { Result: "Result" }, ngImport: i0, template: "<div class=\"dialogbase\">\n  <div class=\"menu\">\n    <ul class=\"list-group\">\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center menu-item\"\n      >\n        <span (click)=\"copyToClipboard()\" class=\"align-line\"\n          ><mat-icon>content_copy</mat-icon>{{'@Copy'| translate}}</span\n        >\n      </li>\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center menu-item\"\n      >\n        <span (click)=\"gotoMain()\" class=\"align-line\"\n          ><mat-icon>edit</mat-icon>{{'@PopupGotoRecordDefinition'|\n          translate}}</span\n        >\n      </li>\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center menu-item\"\n      >\n        <span (click)=\"gotoNew()\" class=\"align-line\"\n          ><mat-icon>add</mat-icon>{{'@PopupNewRecord'| translate}}</span\n        >\n      </li>\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center\"\n        [ngClass]=\"{'menu-item':!fieldDisabled , 'menu-item-disabled':fieldDisabled }\"\n      >\n        <span (click)=\"gotoLookup()\" class=\"align-line\"\n          ><mat-icon>search</mat-icon>{{'@PopupSelectFromList'|translate}}</span\n        >\n      </li>\n    </ul>\n  </div>\n</div>\n", styles: [".dialogbase{background:#0000001a;padding:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px #00000026}.menu{background:var(--mat-sys-primary-container);padding:0;display:flex;border-radius:inherit}.align-line{display:flex;vertical-align:middle;align-items:center;gap:12px;padding:0 8px}.menu-item{padding:12px 16px;display:flex;vertical-align:middle;cursor:pointer;transition:all .2s ease-out;border-radius:8px;margin:4px;color:var(--mat-sys-on-primary-container)}.menu-item:hover{background:var(--mat-sys-on-primary-fixed);color:var(--mat-sys-on-primary);transform:translateY(-2px);box-shadow:0 2px 8px #0000001a}.menu-item:hover .mat-icon{color:var(--mat-sys-on-primary);transform:scale(1.05)}.menu-item-disabled,.menu-item-disabled:hover{background:var(--mat-sys-on-primary-fixed);color:var(--mat-sys-on-primary);font-style:italic;opacity:.7;cursor:not-allowed}.menu-item-disabled .mat-icon,.menu-item-disabled:hover .mat-icon{color:var(--mat-sys-on-primary)}.mat-icon{transition:all .2s ease-out;font-size:20px;width:20px;height:20px}.list-group{list-style:none;padding:8px;margin:0;width:100%}.list-group-item{background-position:bottom;background-size:100% 1px;background-repeat:no-repeat;padding-bottom:12px;margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoCompletePopupMenu, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-auto-complete-popup-menu', imports: [CommonModule, ReactiveFormsModule, MatIconModule, TranslateModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"dialogbase\">\n  <div class=\"menu\">\n    <ul class=\"list-group\">\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center menu-item\"\n      >\n        <span (click)=\"copyToClipboard()\" class=\"align-line\"\n          ><mat-icon>content_copy</mat-icon>{{'@Copy'| translate}}</span\n        >\n      </li>\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center menu-item\"\n      >\n        <span (click)=\"gotoMain()\" class=\"align-line\"\n          ><mat-icon>edit</mat-icon>{{'@PopupGotoRecordDefinition'|\n          translate}}</span\n        >\n      </li>\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center menu-item\"\n      >\n        <span (click)=\"gotoNew()\" class=\"align-line\"\n          ><mat-icon>add</mat-icon>{{'@PopupNewRecord'| translate}}</span\n        >\n      </li>\n      <li\n        class=\"list-group-item list-group-item-action d-flex justify-content-between align-items-center\"\n        [ngClass]=\"{'menu-item':!fieldDisabled , 'menu-item-disabled':fieldDisabled }\"\n      >\n        <span (click)=\"gotoLookup()\" class=\"align-line\"\n          ><mat-icon>search</mat-icon>{{'@PopupSelectFromList'|translate}}</span\n        >\n      </li>\n    </ul>\n  </div>\n</div>\n", styles: [".dialogbase{background:#0000001a;padding:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px #00000026}.menu{background:var(--mat-sys-primary-container);padding:0;display:flex;border-radius:inherit}.align-line{display:flex;vertical-align:middle;align-items:center;gap:12px;padding:0 8px}.menu-item{padding:12px 16px;display:flex;vertical-align:middle;cursor:pointer;transition:all .2s ease-out;border-radius:8px;margin:4px;color:var(--mat-sys-on-primary-container)}.menu-item:hover{background:var(--mat-sys-on-primary-fixed);color:var(--mat-sys-on-primary);transform:translateY(-2px);box-shadow:0 2px 8px #0000001a}.menu-item:hover .mat-icon{color:var(--mat-sys-on-primary);transform:scale(1.05)}.menu-item-disabled,.menu-item-disabled:hover{background:var(--mat-sys-on-primary-fixed);color:var(--mat-sys-on-primary);font-style:italic;opacity:.7;cursor:not-allowed}.menu-item-disabled .mat-icon,.menu-item-disabled:hover .mat-icon{color:var(--mat-sys-on-primary)}.mat-icon{transition:all .2s ease-out;font-size:20px;width:20px;height:20px}.list-group{list-style:none;padding:8px;margin:0;width:100%}.list-group-item{background-position:bottom;background-size:100% 1px;background-repeat:no-repeat;padding-bottom:12px;margin-bottom:4px}\n"] }]
+        }], propDecorators: { field: [{
+                type: Input
+            }], recordGuid: [{
+                type: Input
+            }], fieldDisabled: [{
+                type: Input
+            }], componentPath: [{
+                type: Input
+            }], inputValue: [{
+                type: Input
+            }] } });
+
+class SelectionItem {
+    name = null;
+    value = null;
+    constructor(_value = null, _name = null) {
+        this.name = _name;
+        this.value = _value;
+    }
+}
+class AutoComplete extends UiBase {
+    // Input parameters
+    tableName = input('', ...(ngDevMode ? [{ debugName: "tableName" }] : []));
+    searchAfter = input(3, ...(ngDevMode ? [{ debugName: "searchAfter" }] : []));
+    fieldCode = input(null, ...(ngDevMode ? [{ debugName: "fieldCode" }] : []));
+    fieldName = input(null, ...(ngDevMode ? [{ debugName: "fieldName" }] : []));
+    lookupComponent = input(null, ...(ngDevMode ? [{ debugName: "lookupComponent" }] : []));
+    lookupComponentPath = input(null, ...(ngDevMode ? [{ debugName: "lookupComponentPath" }] : []));
+    filterField = input(null, ...(ngDevMode ? [{ debugName: "filterField" }] : []));
+    filterFieldValue = input(null, ...(ngDevMode ? [{ debugName: "filterFieldValue" }] : []));
+    filterFieldNumeric = input(false, ...(ngDevMode ? [{ debugName: "filterFieldNumeric" }] : []));
+    filterFieldEquality = input('=', ...(ngDevMode ? [{ debugName: "filterFieldEquality" }] : []));
+    debounceTime = input(500, ...(ngDevMode ? [{ debugName: "debounceTime" }] : []));
+    // Inject dependencies
+    alertService = inject(AlertService);
+    autoCompleteService = inject(AutoCompleteProxy);
+    dialog = inject(MatDialog);
+    autoCompleteTrigger;
+    inputField;
+    control = new FormControl();
+    matcher = new ErrorStateMatcher();
+    // Signal parameters
+    searchText = signal('', ...(ngDevMode ? [{ debugName: "searchText" }] : []));
+    selectedOption = signal(null, ...(ngDevMode ? [{ debugName: "selectedOption" }] : []));
+    loadedOptions = signal([], ...(ngDevMode ? [{ debugName: "loadedOptions" }] : []));
+    searchSignal = signal('', ...(ngDevMode ? [{ debugName: "searchSignal" }] : []));
+    debounceTimeout;
+    constructor() {
+        super();
+        // Sync form control with selected option
+        effect(() => {
+            const option = this.selectedOption();
+            if (option) {
+                this.searchText.set(option.name || '');
+            }
+            else if (this.control.value && !this.selectedOption()) {
+                const found = this.loadedOptions().find((opt) => opt.value === this.control.value);
+                if (found) {
+                    this.selectedOption.set(found);
+                    this.searchText.set(found.name || '');
+                }
+            }
+        });
+        // Then watch the debounced signal:
+        effect((onCleanup) => {
+            const searchValue = this.searchSignal();
+            clearTimeout(this.debounceTimeout);
+            this.debounceTimeout = setTimeout(() => {
+                if (this.shouldTriggerSearch(searchValue)) {
+                    this.loadAutoCompleteData(searchValue);
+                }
+                else {
+                    this.loadedOptions.set([]);
+                }
+            }, this.debounceTime());
+            onCleanup(() => {
+                clearTimeout(this.debounceTimeout);
+            });
+        });
+        effect(() => {
+            this.onChange(this.value());
+        });
+        effect(() => {
+            this.updateValidators();
+        });
+    }
+    shouldTriggerSearch(searchValue) {
+        return searchValue.length >= this.searchAfter();
+    }
+    filteredData = computed(() => {
+        return this.loadedOptions();
+    }, ...(ngDevMode ? [{ debugName: "filteredData" }] : []));
+    onInputChanged(event) {
+        const value = event.target.value;
+        this.searchText.set(value);
+        this.onTouched();
+        // Clear selection if text doesn't match
+        if (this.selectedOption() && this.selectedOption()?.name !== value) {
+            this.selectedOption.set(null);
+        }
+        if (value.length === 0) {
+            this.clearInput();
+            return;
+        }
+        this.searchSignal.set(value);
+        this.autoCompleteTrigger.closePanel();
+    }
+    loadAutoCompleteData(searchValue) {
+        this.loadedOptions.set([]);
+        const filter = new NtyAutoCompleteFilter();
+        filter.searchString =
+            searchValue.trim() === '' && searchValue.length >= this.searchAfter()
+                ? ''
+                : searchValue;
+        filter.fields = [];
+        if (this.filterField() && this.filterField().trim().length > 0) {
+            const fields = {
+                equalitySign: this.filterFieldEquality(),
+                fieldName: this.filterField(),
+                fieldValue: this.filterFieldValue(),
+                numeric: this.filterFieldNumeric(),
+            };
+            filter.fields?.push(fields);
+        }
+        this.autoCompleteService
+            .getAutocompleteDataFilter(this.tableName(), filter)
+            .subscribe({
+            next: (data) => {
+                if (data && Array.isArray(data)) {
+                    const options = data.map((item) => ({
+                        name: item.text,
+                        value: item.guidValue,
+                    }));
+                    this.loadedOptions.set(options);
+                    if (options.length === 1) {
+                        this.selectedOption.set(options[0]);
+                        this.control.setValue(options[0].value);
+                        this.searchText.set(options[0].name || '');
+                    }
+                    else if (options.length > 1) {
+                        this.autoCompleteTrigger.openPanel();
+                    }
+                }
+            },
+            error: (err) => {
+                this.alertService.showAlert(err.message);
+            },
+        });
+    }
+    clearInput() {
+        this.selectedOption.set(new SelectionItem(Guid.empty, ''));
+        this.control.reset();
+        this.searchText.set('');
+        this.loadedOptions.set([]);
+        this.inputField.nativeElement.value = '';
+    }
+    onPaste(event) {
+        const clipboardData = event.clipboardData;
+        if (!clipboardData)
+            return;
+        const pastedText = clipboardData.getData('text');
+        this.searchText.set(pastedText);
+        this.searchSignal.set(pastedText);
+    }
+    displayFn(item) {
+        return this.searchText();
+    }
+    optionSelected(event) {
+        const selectedValue = event.option.value;
+        const selected = this.loadedOptions().find((opt) => opt.value === selectedValue);
+        if (selected) {
+            this.selectedOption.set(selected);
+            this.control.setValue(selected.value);
+            this.searchText.set(selected.name || '');
+        }
+    }
+    writeValue(value) {
+        this.value.set(value);
+        if (!value)
+            return;
+        if (this.fieldCode()) {
+            this.selectedOption.set({ value, name: this.fieldCode() });
+        }
+    }
+    onLookup() {
+        if (!this.lookupComponent())
+            return;
+        const dialogRef = this.dialog.open(AutoCompleteLookup, {
+            height: 'auto',
+            width: '100%',
+            maxWidth: '100%',
+            maxHeight: 'auto',
+            data: {
+                component: this.lookupComponent(),
+                ...(this.filterField() && {
+                    filterField: this.filterField(),
+                    filterFieldValue: this.filterFieldValue(),
+                    filterFieldEquality: this.filterFieldEquality(),
+                    filterFieldNumeric: this.filterFieldNumeric(),
+                }),
+            },
+        });
+        dialogRef.componentInstance.selectedElement.subscribe((data) => {
+            if (data) {
+                const selection = new SelectionItem(data.value, data.text);
+                this.selectedOption.set(selection);
+                this.control.setValue(selection.value);
+                this.searchText.set(selection.name || '');
+            }
+            dialogRef.close();
+        });
+    }
+    /** Popup screen to goto main table
+     *
+     * @param event
+     * @returns
+     */
+    rightClick(event) {
+        event.stopPropagation();
+        const dialogConfig = new MatDialogConfig();
+        dialogConfig.position = {
+            top: event.clientY + 'px',
+            left: event.clientX + 'px',
+        };
+        dialogConfig.height = 'auto';
+        dialogConfig.width = 'auto';
+        dialogConfig.panelClass = 'foo';
+        const dialogRef = this.dialog.open(AutoCompletePopupMenu, dialogConfig);
+        dialogRef.componentInstance.field = this.tableName();
+        dialogRef.componentInstance.recordGuid = this.value();
+        dialogRef.componentInstance.fieldDisabled = this.disabled();
+        dialogRef.componentInstance.componentPath = this.lookupComponentPath();
+        dialogRef.componentInstance.inputValue = this.searchText();
+        dialogRef.componentInstance.Result.subscribe((result) => {
+            switch (result) {
+                case 'Lookup':
+                    dialogRef.close();
+                    this.onLookup();
+                    break;
+                default:
+                    dialogRef.close();
+                    break;
+            }
+        });
+        return false;
+    }
+    // Validation
+    getErrorMessage() {
+        if (this.control.hasError('required') && this.errorMessages()['required']) {
+            return this.errorMessages()['required'];
+        }
+        return '';
+    }
+    updateValidators() {
+        const validators = [];
+        if (this.required()) {
+            validators.push(Validators.required);
+        }
+        this.control.setValidators(validators);
+        this.control.updateValueAndValidity();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoComplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.7", type: AutoComplete, isStandalone: true, selector: "ntybase-auto-complete", inputs: { tableName: { classPropertyName: "tableName", publicName: "tableName", isSignal: true, isRequired: false, transformFunction: null }, searchAfter: { classPropertyName: "searchAfter", publicName: "searchAfter", isSignal: true, isRequired: false, transformFunction: null }, fieldCode: { classPropertyName: "fieldCode", publicName: "fieldCode", isSignal: true, isRequired: false, transformFunction: null }, fieldName: { classPropertyName: "fieldName", publicName: "fieldName", isSignal: true, isRequired: false, transformFunction: null }, lookupComponent: { classPropertyName: "lookupComponent", publicName: "lookupComponent", isSignal: true, isRequired: false, transformFunction: null }, lookupComponentPath: { classPropertyName: "lookupComponentPath", publicName: "lookupComponentPath", 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 }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => AutoComplete),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "autoCompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "inputField", first: true, predicate: ["autoCompleteInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field\n  class=\"ui-full-width\"\n  [appearance]=\"appearance()\"\n  [class.required-field]=\"required()\"\n  [class.required-with-value]=\"required() && value()\"\n>\n  <mat-label *ngIf=\"label()\">{{ label() }}</mat-label>\n\n  <input\n    type=\"text\"\n    #autoCompleteInput\n    matInput\n    [(ngModel)]=\"value\"\n    [matAutocomplete]=\"auto\"\n    (input)=\"onInputChanged($event)\"\n    (paste)=\"onPaste($event)\"\n    [errorStateMatcher]=\"matcher\"\n    [formControl]=\"control\"\n    (contextmenu)=\"rightClick($event)\"\n  />\n\n  <button\n    mat-icon-button\n    matSuffix\n    *ngIf=\"value() && !disabled()\"\n    (click)=\"clearInput()\"\n    aria-label=\"Clear\"\n    class=\"clear-btn number-clear-btn\"\n  >\n    <mat-icon>cancel</mat-icon>\n  </button>\n\n  <button\n    mat-icon-button\n    matSuffix\n    aria-label=\"Search\"\n    (click)=\"onLookup()\"\n    class=\"search-btn\"\n  >\n    <mat-icon>search</mat-icon>\n  </button>\n  <mat-autocomplete\n    #auto=\"matAutocomplete\"\n    [displayWith]=\"displayFn.bind(this)\"\n    (optionSelected)=\"optionSelected($event)\"\n  >\n    <mat-option *ngFor=\"let option of filteredData()\" [value]=\"option.value\">\n      {{ option.name }}\n    </mat-option>\n  </mat-autocomplete>\n\n  <mat-error>{{ getErrorMessage() }}</mat-error>\n</mat-form-field>\n", styles: ["::ng-deep .ui-full-width{width:100%;max-width:500px}::ng-deep .mat-mdc-form-field-subscript-wrapper{width:auto;height:0}::ng-deep .clear-btn{background:none;border:none;box-shadow:none;cursor:pointer}::ng-deep .search-icon{background:none;border:none;box-shadow:none;opacity:1;cursor:pointer}::ng-deep .search-icon:hover,::ng-deep .clear-btn:hover{color:#f97a00}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: MatAutocompleteModule }, { kind: "component", type: i3$6.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i3$6.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i3$6.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutoComplete, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-auto-complete', imports: [
+                        MatFormFieldModule,
+                        CommonModule,
+                        MatAutocompleteModule,
+                        FormsModule,
+                        MatInputModule,
+                        MatIconModule,
+                        ReactiveFormsModule,
+                    ], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => AutoComplete),
+                            multi: true,
+                        },
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field\n  class=\"ui-full-width\"\n  [appearance]=\"appearance()\"\n  [class.required-field]=\"required()\"\n  [class.required-with-value]=\"required() && value()\"\n>\n  <mat-label *ngIf=\"label()\">{{ label() }}</mat-label>\n\n  <input\n    type=\"text\"\n    #autoCompleteInput\n    matInput\n    [(ngModel)]=\"value\"\n    [matAutocomplete]=\"auto\"\n    (input)=\"onInputChanged($event)\"\n    (paste)=\"onPaste($event)\"\n    [errorStateMatcher]=\"matcher\"\n    [formControl]=\"control\"\n    (contextmenu)=\"rightClick($event)\"\n  />\n\n  <button\n    mat-icon-button\n    matSuffix\n    *ngIf=\"value() && !disabled()\"\n    (click)=\"clearInput()\"\n    aria-label=\"Clear\"\n    class=\"clear-btn number-clear-btn\"\n  >\n    <mat-icon>cancel</mat-icon>\n  </button>\n\n  <button\n    mat-icon-button\n    matSuffix\n    aria-label=\"Search\"\n    (click)=\"onLookup()\"\n    class=\"search-btn\"\n  >\n    <mat-icon>search</mat-icon>\n  </button>\n  <mat-autocomplete\n    #auto=\"matAutocomplete\"\n    [displayWith]=\"displayFn.bind(this)\"\n    (optionSelected)=\"optionSelected($event)\"\n  >\n    <mat-option *ngFor=\"let option of filteredData()\" [value]=\"option.value\">\n      {{ option.name }}\n    </mat-option>\n  </mat-autocomplete>\n\n  <mat-error>{{ getErrorMessage() }}</mat-error>\n</mat-form-field>\n", styles: ["::ng-deep .ui-full-width{width:100%;max-width:500px}::ng-deep .mat-mdc-form-field-subscript-wrapper{width:auto;height:0}::ng-deep .clear-btn{background:none;border:none;box-shadow:none;cursor:pointer}::ng-deep .search-icon{background:none;border:none;box-shadow:none;opacity:1;cursor:pointer}::ng-deep .search-icon:hover,::ng-deep .clear-btn:hover{color:#f97a00}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { autoCompleteTrigger: [{
+                type: ViewChild,
+                args: [MatAutocompleteTrigger]
+            }], inputField: [{
+                type: ViewChild,
+                args: ['autoCompleteInput']
+            }] } });
+
+/*
+ * Public API Surface of ntybase
+ */
+
+/**
+ * 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 };
+//# sourceMappingURL=nettyapps-ntybase.mjs.map