@nettyapps/ntyux 21.0.0

package/fesm2022/nettyapps-ntyux.mjs

@@ -0,0 +1,1083 @@
+import * as i0 from '@angular/core';
+import { Component, NgModule, inject, Injectable, input, output, ViewContainerRef, ViewChild, Input, ViewEncapsulation, signal, effect, computed, forwardRef, ChangeDetectionStrategy, ElementRef, model } from '@angular/core';
+import * as i1$1 from '@angular/material/form-field';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i2$1 from '@angular/material/autocomplete';
+import { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';
+import * as i3$1 from '@angular/forms';
+import { ReactiveFormsModule, FormControl, Validators, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
+import { ErrorStateMatcher } from '@angular/material/core';
+import * as i4 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import { UiBase, NettyUISearchInput } from '@nettyapps/ntyui';
+import { HttpClient } from '@angular/common/http';
+import { EnvironmentProxy } from '@nettyapps/ntycontract';
+import { MAT_DIALOG_DATA, MatDialog, MatDialogConfig, MatDialogModule } from '@angular/material/dialog';
+import * as i1 from '@angular/common';
+import { CommonModule, Location, TitleCasePipe } from '@angular/common';
+import * as i3 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { Clipboard } from '@angular/cdk/clipboard';
+import { AlertService, CommonService, AuthenticationService, NettyMenuService, CredentialsService, NettyImageService } from '@nettyapps/ntybase';
+import * as i5 from '@angular/router';
+import { Router, ActivatedRoute, RouterLink, RouterModule } from '@angular/router';
+import * as i3$2 from '@angular/material/list';
+import { MatListModule } from '@angular/material/list';
+import * as i4$1 from '@angular/material/menu';
+import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
+import * as i3$3 from '@angular/material/toolbar';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { I18nService } from '@nettyapps/ntyi18n';
+
+class Ntyux {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Ntyux, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: Ntyux, isStandalone: false, selector: "lib-ntyux", ngImport: i0, template: `
+    <p>
+      ntyux works!
+    </p>
+  `, isInline: true, styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Ntyux, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-ntyux', standalone: false, template: `
+    <p>
+      ntyux works!
+    </p>
+  ` }]
+        }] });
+
+class NtyuxModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: NtyuxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.3", ngImport: i0, type: NtyuxModule, declarations: [Ntyux], exports: [Ntyux] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: NtyuxModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: NtyuxModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        Ntyux
+                    ],
+                    imports: [],
+                    exports: [
+                        Ntyux
+                    ]
+                }]
+        }] });
+
+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: "21.0.3", ngImport: i0, type: AutoCompleteProxy, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: AutoCompleteProxy, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", 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() {
+        this.initializeComponent();
+    }
+    ngOnChanges(changes) {
+        if (this.isComponentConfigChanged(changes)) {
+            this.initializeComponent();
+        }
+    }
+    isComponentConfigChanged(changes) {
+        return (!!changes['component'] ||
+            !!changes['filterField'] ||
+            !!changes['filterFieldValue'] ||
+            !!changes['filterFieldNumeric'] ||
+            !!changes['filterFieldEquality']);
+    }
+    initializeComponent() {
+        const config = this.data || this.getInputConfig();
+        this.loadComponent(config);
+    }
+    getInputConfig() {
+        return {
+            component: this.component(),
+            filterField: this.filterField(),
+            filterFieldValue: this.filterFieldValue(),
+            filterFieldNumeric: this.filterFieldNumeric(),
+            filterFieldEquality: this.filterFieldEquality(),
+        };
+    }
+    loadComponent(config) {
+        if (!config?.component)
+            return;
+        this.container.clear();
+        const componentRef = this.container.createComponent(config.component);
+        componentRef.setInput('popupValid', true);
+        if (config.filterField !== undefined) {
+            componentRef.setInput('filterField', config.filterField);
+        }
+        if (config.filterFieldValue !== undefined) {
+            componentRef.setInput('filterFieldValue', config.filterFieldValue);
+        }
+        if (config.filterFieldEquality !== undefined) {
+            componentRef.setInput('filterFieldEquality', config.filterFieldEquality);
+        }
+        if (config.filterFieldNumeric !== undefined) {
+            componentRef.setInput('filterFieldNumeric', config.filterFieldNumeric);
+        }
+        const sub = componentRef.instance.selectedElement.subscribe((data) => {
+            this.selectedElement.emit(data);
+        });
+        componentRef.onDestroy(() => sub.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: AutoCompleteLookup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.3", 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 }], usesOnChanges: true, ngImport: i0, template: ` <ng-template #container></ng-template> `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", 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 }]
+            }], component: [{ type: i0.Input, args: [{ isSignal: true, alias: "component", required: false }] }], filterField: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterField", required: false }] }], filterFieldValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterFieldValue", required: false }] }], filterFieldNumeric: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterFieldNumeric", required: false }] }], filterFieldEquality: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterFieldEquality", required: false }] }], selectedElement: [{ type: i0.Output, args: ["selectedElement"] }] } });
+
+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: "21.0.3", ngImport: i0, type: AutoCompletePopupMenu, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", 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: i1.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.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", 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
+            }], Result: [{ type: i0.Output, args: ["Result"] }] } });
+
+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: "21.0.3", ngImport: i0, type: AutoComplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", 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  @if (label()) {\n  <mat-label>{{ label() }}</mat-label>\n  }\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  @if (value() && !disabled()) {\n  <button\n    mat-icon-button\n    matSuffix\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\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    @for (option of filteredData(); track option.value) {\n    <mat-option [value]=\"option.value\"> {{ option.name }} </mat-option>\n    }\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$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.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: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.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: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: AutoComplete, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-auto-complete', imports: [
+                        MatFormFieldModule,
+                        MatAutocompleteModule,
+                        FormsModule,
+                        MatInputModule,
+                        MatIconModule,
+                        ReactiveFormsModule,
+                        MatDialogModule,
+                    ], 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  @if (label()) {\n  <mat-label>{{ label() }}</mat-label>\n  }\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  @if (value() && !disabled()) {\n  <button\n    mat-icon-button\n    matSuffix\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\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    @for (option of filteredData(); track option.value) {\n    <mat-option [value]=\"option.value\"> {{ option.name }} </mat-option>\n    }\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: { tableName: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableName", required: false }] }], searchAfter: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchAfter", required: false }] }], fieldCode: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldCode", required: false }] }], fieldName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldName", required: false }] }], lookupComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "lookupComponent", required: false }] }], lookupComponentPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "lookupComponentPath", required: false }] }], filterField: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterField", required: false }] }], filterFieldValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterFieldValue", required: false }] }], filterFieldNumeric: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterFieldNumeric", required: false }] }], filterFieldEquality: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterFieldEquality", required: false }] }], debounceTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounceTime", required: false }] }], autoCompleteTrigger: [{
+                type: ViewChild,
+                args: [MatAutocompleteTrigger]
+            }], inputField: [{
+                type: ViewChild,
+                args: ['autoCompleteInput']
+            }] } });
+
+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.currentNavigation();
+        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: "21.0.3", ngImport: i0, type: HttpError403, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", 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: "21.0.3", 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: "21.0.3", ngImport: i0, type: HttpError404, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", 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: "21.0.3", 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 LeftSidenav {
+    authService = inject(AuthenticationService);
+    router = inject(Router);
+    menuService = inject(NettyMenuService);
+    commonService = inject(CommonService);
+    environmentProxy = inject(EnvironmentProxy);
+    credentialsService = inject(CredentialsService);
+    imageService = inject(NettyImageService);
+    elementRef = inject(ElementRef);
+    username = signal('', ...(ngDevMode ? [{ debugName: "username" }] : []));
+    profileImage = signal('', ...(ngDevMode ? [{ debugName: "profileImage" }] : []));
+    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([]);
+            }
+        });
+        this.loadUserInfo();
+    }
+    ngOnInit() {
+        // Application name gelene kadar 3 kez dene
+        this.trySetMenuName(0);
+    }
+    trySetMenuName(attempt) {
+        const appName = this.environmentProxy.getApplicationName();
+        if (appName && appName.trim()) {
+            // Application name geldi, menüyü yükle
+            this.menuService.setMenuName(appName);
+        }
+        else if (attempt < 3) {
+            // Henüz gelmedi, 300ms sonra tekrar dene
+            setTimeout(() => {
+                this.trySetMenuName(attempt + 1);
+            }, 300);
+        }
+        else {
+            // 3 denemeden sonra hala gelmedi, boş string ile dene
+            console.warn('Application name not found, using empty string');
+            this.menuService.setMenuName('');
+        }
+    }
+    ngAfterViewInit() {
+        setTimeout(() => {
+            this.loadUserInfo();
+        }, 0);
+    }
+    loadUserInfo() {
+        const credentials = this.credentialsService.getCredentials();
+        if (credentials && credentials.username) {
+            this.username.set(credentials.username);
+            this.generateProfileImage(credentials.username);
+        }
+    }
+    generateProfileImage(username) {
+        const initials = this.getInitials(username);
+        const primaryColor = this.getCssVariableValue('--mat-sys-primary');
+        const imageUrl = this.imageService.generateTextImage(initials, 40, 40, primaryColor || '#4ECDC4', '#FFFFFF', 'rgba(0, 0, 0, 0.2)');
+        this.profileImage.set(imageUrl);
+    }
+    getCssVariableValue(variableName) {
+        if (typeof window === 'undefined')
+            return null;
+        const element = this.elementRef.nativeElement;
+        return (getComputedStyle(element).getPropertyValue(variableName).trim() || null);
+    }
+    getInitials(username) {
+        if (!username)
+            return 'U';
+        const names = username.trim().split(' ');
+        if (names.length === 1) {
+            return names[0].charAt(0).toUpperCase();
+        }
+        else {
+            return (names[0].charAt(0) + names[names.length - 1].charAt(0)).toUpperCase();
+        }
+    }
+    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: "21.0.3", ngImport: i0, type: LeftSidenav, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", 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 [src]=\"profileImage()\" [alt]=\"username()\" class=\"profile-image\" />\n      @if(!isMinimized()){\n      <div class=\"profile-info\">\n        <p class=\"profile-name\">{{ username() }}</p>\n      </div>\n      }\n    </button>\n\n    <mat-menu #profileMenu=\"matMenu\" xPosition=\"before\">\n      <button mat-menu-item disabled>\n        <mat-icon>account_circle</mat-icon>\n        <span>{{ '@profile' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button disabled>\n        <mat-icon>swap_horiz</mat-icon>\n        <span>{{ '@changeCompany' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button (click)=\"logout()\">\n        <mat-icon>logout</mat-icon>\n        <span>{{ '@logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  </div>\n\n  <!-- Search Input -->\n  @if (!isMinimized()){\n  <ntyui-search-input\n    class=\"search-input\"\n    [label]=\"'@search' | translate\"\n    [placeholder]=\"'@placeholderSearch' | translate\"\n    [appearance]=\"'outline'\"\n    (search)=\"onSearch($event)\"\n  >\n  </ntyui-search-input>\n  }\n\n  <!-- Menu -->\n  @if (!isMinimized()) {\n  <mat-nav-list>\n    <div class=\"sidebar\">\n      <ul>\n        <!-- Recursive menu render -->\n        @let items = filteredMenuItems(); @let level = 0;\n        <ng-container\n          [ngTemplateOutlet]=\"menuItemsTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: items, level: level }\"\n        ></ng-container>\n      </ul>\n    </div>\n  </mat-nav-list>\n  }\n\n  <!-- Footer -->\n  <div class=\"sidenav-footer\">\n    <button mat-button [matMenuTriggerFor]=\"footerMenu\" class=\"footer-button\">\n      @if (!isMinimized()) {\n      <div class=\"footer-text\">\n        <div class=\"company-name\">\n          <p>&copy; 2025 AXIS</p>\n        </div>\n      </div>\n      }\n    </button>\n    <div class=\"version\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n\n  <mat-menu #footerMenu=\"matMenu\" xPosition=\"before\">\n    <button mat-menu-item disabled>\n      <mat-icon>swap_horiz</mat-icon>\n      {{ '@changeCompany' | translate }}\n    </button>\n    <button mat-menu-item mat-button (click)=\"logout()\">\n      <mat-icon>logout</mat-icon>\n      <span>{{ '@logout' | translate }}</span>\n    </button>\n  </mat-menu>\n</div>\n\n<!-- Recursive Menu Template -->\n<ng-template #menuItemsTemplate let-items let-level=\"level\">\n  @for (item of items; track item.name) {\n  <li [class]=\"'menu-level-' + level\">\n    <!-- Leaf node (no children) -->\n    @if (!item.children || item.children.length === 0) {\n    <a\n      [routerLink]=\"item.link\"\n      routerLinkActive=\"active\"\n      [class]=\"'menu-link level-' + level\"\n    >\n      <mat-icon>{{ item.icon }}</mat-icon>\n      <span>{{ item.name }}</span>\n    </a>\n    }\n\n    <!-- Parent node with children -->\n    @if (item.children && item.children.length > 0) {\n    <a\n      (click)=\"toggleSubMenu(item)\"\n      [class.expanded]=\"item.expanded\"\n      [class]=\"'menu-link has-children level-' + level\"\n    >\n      <mat-icon>{{ item.icon }}</mat-icon>\n      <span>{{ item.name }}</span>\n      <mat-icon [class.rotated]=\"item.expanded\" class=\"expand-icon\">\n        {{ item.expanded ? 'expand_less' : 'expand_more' }}\n      </mat-icon>\n    </a>\n    }\n\n    <!-- Recursive submenu -->\n    @if (item.children && item.children.length > 0 && item.expanded) {\n    <ul [class]=\"'submenu level-' + (level + 1)\">\n      <ng-container\n        *ngTemplateOutlet=\"menuItemsTemplate; context: { $implicit: item.children, level: level + 1 }\"\n      ></ng-container>\n    </ul>\n    }\n  </li>\n  }\n</ng-template>\n", styles: [".profile-section{text-align:center;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:60px;height:60px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:2px 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-nty-save-record-header-bar);color:var(--mat-nty-save-record-identifier)}.sidebar li a.active{background-color:var(--mat-nty-save-record-header-bar);color:var(--mat-nty-save-record-identifier);font-weight:500}.sidebar li a.active:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--mat-nty-save-record-header-bar);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}.menu-link.level-2{margin-left:20px;font-size:.82rem}.menu-link.level-3{margin-left:20px;font-size:.8rem}.menu-link.level-4{margin-left:20px;font-size:.78rem}.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) .sidenav-content-wrapper button[mat-icon-button]{position:absolute;right:-8px;top:50%;z-index:999}: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:1px;z-index:999}.search-input{margin-top:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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$2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4$1.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: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.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: NettyUISearchInput, selector: "ntyui-search-input", outputs: ["search"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: LeftSidenav, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-left-sidenav', imports: [
+                        CommonModule,
+                        MatIconModule,
+                        MatListModule,
+                        MatMenuModule,
+                        MatMenuTrigger,
+                        RouterLink,
+                        RouterModule,
+                        NettyUISearchInput,
+                        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 [src]=\"profileImage()\" [alt]=\"username()\" class=\"profile-image\" />\n      @if(!isMinimized()){\n      <div class=\"profile-info\">\n        <p class=\"profile-name\">{{ username() }}</p>\n      </div>\n      }\n    </button>\n\n    <mat-menu #profileMenu=\"matMenu\" xPosition=\"before\">\n      <button mat-menu-item disabled>\n        <mat-icon>account_circle</mat-icon>\n        <span>{{ '@profile' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button disabled>\n        <mat-icon>swap_horiz</mat-icon>\n        <span>{{ '@changeCompany' | translate }}</span>\n      </button>\n      <button mat-menu-item mat-button (click)=\"logout()\">\n        <mat-icon>logout</mat-icon>\n        <span>{{ '@logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  </div>\n\n  <!-- Search Input -->\n  @if (!isMinimized()){\n  <ntyui-search-input\n    class=\"search-input\"\n    [label]=\"'@search' | translate\"\n    [placeholder]=\"'@placeholderSearch' | translate\"\n    [appearance]=\"'outline'\"\n    (search)=\"onSearch($event)\"\n  >\n  </ntyui-search-input>\n  }\n\n  <!-- Menu -->\n  @if (!isMinimized()) {\n  <mat-nav-list>\n    <div class=\"sidebar\">\n      <ul>\n        <!-- Recursive menu render -->\n        @let items = filteredMenuItems(); @let level = 0;\n        <ng-container\n          [ngTemplateOutlet]=\"menuItemsTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: items, level: level }\"\n        ></ng-container>\n      </ul>\n    </div>\n  </mat-nav-list>\n  }\n\n  <!-- Footer -->\n  <div class=\"sidenav-footer\">\n    <button mat-button [matMenuTriggerFor]=\"footerMenu\" class=\"footer-button\">\n      @if (!isMinimized()) {\n      <div class=\"footer-text\">\n        <div class=\"company-name\">\n          <p>&copy; 2025 AXIS</p>\n        </div>\n      </div>\n      }\n    </button>\n    <div class=\"version\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n\n  <mat-menu #footerMenu=\"matMenu\" xPosition=\"before\">\n    <button mat-menu-item disabled>\n      <mat-icon>swap_horiz</mat-icon>\n      {{ '@changeCompany' | translate }}\n    </button>\n    <button mat-menu-item mat-button (click)=\"logout()\">\n      <mat-icon>logout</mat-icon>\n      <span>{{ '@logout' | translate }}</span>\n    </button>\n  </mat-menu>\n</div>\n\n<!-- Recursive Menu Template -->\n<ng-template #menuItemsTemplate let-items let-level=\"level\">\n  @for (item of items; track item.name) {\n  <li [class]=\"'menu-level-' + level\">\n    <!-- Leaf node (no children) -->\n    @if (!item.children || item.children.length === 0) {\n    <a\n      [routerLink]=\"item.link\"\n      routerLinkActive=\"active\"\n      [class]=\"'menu-link level-' + level\"\n    >\n      <mat-icon>{{ item.icon }}</mat-icon>\n      <span>{{ item.name }}</span>\n    </a>\n    }\n\n    <!-- Parent node with children -->\n    @if (item.children && item.children.length > 0) {\n    <a\n      (click)=\"toggleSubMenu(item)\"\n      [class.expanded]=\"item.expanded\"\n      [class]=\"'menu-link has-children level-' + level\"\n    >\n      <mat-icon>{{ item.icon }}</mat-icon>\n      <span>{{ item.name }}</span>\n      <mat-icon [class.rotated]=\"item.expanded\" class=\"expand-icon\">\n        {{ item.expanded ? 'expand_less' : 'expand_more' }}\n      </mat-icon>\n    </a>\n    }\n\n    <!-- Recursive submenu -->\n    @if (item.children && item.children.length > 0 && item.expanded) {\n    <ul [class]=\"'submenu level-' + (level + 1)\">\n      <ng-container\n        *ngTemplateOutlet=\"menuItemsTemplate; context: { $implicit: item.children, level: level + 1 }\"\n      ></ng-container>\n    </ul>\n    }\n  </li>\n  }\n</ng-template>\n", styles: [".profile-section{text-align:center;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:60px;height:60px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:2px 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-nty-save-record-header-bar);color:var(--mat-nty-save-record-identifier)}.sidebar li a.active{background-color:var(--mat-nty-save-record-header-bar);color:var(--mat-nty-save-record-identifier);font-weight:500}.sidebar li a.active:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--mat-nty-save-record-header-bar);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}.menu-link.level-2{margin-left:20px;font-size:.82rem}.menu-link.level-3{margin-left:20px;font-size:.8rem}.menu-link.level-4{margin-left:20px;font-size:.78rem}.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) .sidenav-content-wrapper button[mat-icon-button]{position:absolute;right:-8px;top:50%;z-index:999}: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:1px;z-index:999}.search-input{margin-top:10px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { isMinimized: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMinimized", required: false }] }], toggleMinimize: [{ type: i0.Output, args: ["toggleMinimize"] }] } });
+
+class Theme {
+    THEME_STORAGE_KEY = 'app-theme';
+    appTheme = signal('light', ...(ngDevMode ? [{ debugName: "appTheme" }] : []));
+    themes = [
+        { name: 'light', icon: 'light_mode' },
+        { name: 'dark', icon: 'dark_mode' },
+    ];
+    selectedTheme = computed(() => this.themes.find((theme) => theme.name === this.appTheme()), ...(ngDevMode ? [{ debugName: "selectedTheme" }] : []));
+    constructor() {
+        const savedTheme = this.getSavedTheme();
+        if (savedTheme) {
+            this.appTheme.set(savedTheme);
+        }
+        effect(() => {
+            const appTheme = this.appTheme();
+            document.body.style.setProperty('color-scheme', appTheme);
+            document.body.setAttribute('data-ag-theme-mode', appTheme);
+        });
+    }
+    getThemes() {
+        return this.themes;
+    }
+    setTheme(theme) {
+        this.appTheme.set(theme);
+        this.saveTheme(theme);
+    }
+    getSavedTheme() {
+        if (typeof window !== 'undefined' && window.localStorage) {
+            const saved = localStorage.getItem(this.THEME_STORAGE_KEY);
+            return saved === 'light' || saved === 'dark' ? saved : null;
+        }
+        return null;
+    }
+    saveTheme(theme) {
+        if (typeof window !== 'undefined' && window.localStorage) {
+            localStorage.setItem(this.THEME_STORAGE_KEY, theme);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Theme, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Theme, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Theme, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class ColorPalette {
+    THEME_STORAGE_KEY = 'selected-theme';
+    themes = [];
+    currentTheme = signal(null, ...(ngDevMode ? [{ debugName: "currentTheme" }] : []));
+    setThemes(customThemes) {
+        this.themes = customThemes;
+        const savedThemeId = this.getSavedTheme();
+        const themeToSet = savedThemeId
+            ? this.themes.find((t) => t.id === savedThemeId)
+            : this.themes[0];
+        if (themeToSet) {
+            this.currentTheme.set(themeToSet);
+        }
+        else if (this.themes.length > 0) {
+            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);
+            this.saveTheme(themeId);
+        }
+    }
+    getSavedTheme() {
+        if (typeof window !== 'undefined' && window.localStorage) {
+            return localStorage.getItem(this.THEME_STORAGE_KEY);
+        }
+        return null;
+    }
+    saveTheme(themeId) {
+        if (typeof window !== 'undefined' && window.localStorage) {
+            localStorage.setItem(this.THEME_STORAGE_KEY, themeId);
+        }
+    }
+    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: "21.0.3", ngImport: i0, type: ColorPalette, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ColorPalette, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ColorPalette, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class Toolbar {
+    themeService = inject(Theme);
+    colorPaletteService = inject(ColorPalette);
+    i18nService = inject(I18nService);
+    router = inject(Router);
+    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;
+        setTimeout(() => {
+            window.location.reload();
+        }, 100);
+    }
+    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: "21.0.3", ngImport: i0, type: Toolbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", 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>{{'app_name' | translate }}</span>\n\n    <!-- Language Selection -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\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: i4$1.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: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.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$3.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Toolbar, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-toolbar', imports: [
+                        MatIconModule,
+                        MatMenuModule,
+                        MatToolbarModule,
+                        CommonModule,
+                        TitleCasePipe,
+                        TranslateModule,
+                    ], 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>{{'app_name' | translate }}</span>\n\n    <!-- Language Selection -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\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"] }]
+        }], propDecorators: { toggleSidenav: [{ type: i0.Output, args: ["toggleSidenav"] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }, { type: i0.Output, args: ["iconChange"] }] } });
+
+/*
+ * Public API Surface of ntyux
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AutoComplete, ColorPalette, HttpError403, HttpError404, LeftSidenav, Ntyux, NtyuxModule, SelectionItem, Theme, Toolbar };
+//# sourceMappingURL=nettyapps-ntyux.mjs.map