@kuzntsv/uikit 0.0.51 → 0.0.54

package/fesm2022/kuzntsv-uikit.mjs

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
-import { inject, ChangeDetectorRef, ChangeDetectionStrategy, Component, Injectable, input, output, effect, viewChild, HostListener, ElementRef, Directive, signal, Pipe, linkedSignal } from '@angular/core';
+import { inject, ChangeDetectorRef, ChangeDetectionStrategy, Component, Injectable, input, output, effect, viewChild, HostListener, ElementRef, Directive, signal, NgZone, Pipe, linkedSignal } from '@angular/core';
 import { Router, DefaultUrlSerializer, ActivatedRoute, RouterLink } from '@angular/router';
 import { Overlay } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
 import { MatProgressSpinner } from '@angular/material/progress-spinner';
 import { HttpHeaders, HttpClient, HttpParams } from '@angular/common/http';
-import { BehaviorSubject, Subscription, Subject, forkJoin, startWith } from 'rxjs';
+import { BehaviorSubject, Subscription, ReplaySubject, Subject, forkJoin, startWith } from 'rxjs';
 import { MatSnackBar } from '@angular/material/snack-bar';
 import * as i1 from '@angular/forms';
 import { FormGroup, FormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
@@ -940,6 +940,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
                 }]
         }] });
 
+class SseService {
+    zone = inject(NgZone);
+    eventSource = null;
+    isConnected = false;
+    constructor() { }
+    createSseEventSource(user, topic) {
+        const subject = new ReplaySubject(1);
+        // Close any existing connection
+        this.closeSseEventSource();
+        const topicUri = topic.getTopic(user);
+        // environment.sse_url
+        this.eventSource = new EventSource(topicUri
+        //, {withCredentials: true}
+        );
+        if (this.eventSource) {
+            this.isConnected = true;
+            // Listen for messages
+            this.eventSource.onmessage = (event) => {
+                console.log(event);
+                const messageData = JSON.parse(event.data);
+                this.zone.run(() => {
+                    subject.next(messageData);
+                });
+            };
+            this.eventSource.onopen = () => {
+                console.log('SSE connection opened.');
+            };
+            // Process error
+            this.eventSource.onerror = (error) => {
+                console.error('SSE error:', error);
+                this.reconnectOnError(user, topic, subject);
+            };
+        }
+        return subject.asObservable();
+    }
+    reconnectOnError(user, topic, subject) {
+        this.closeSseEventSource();
+        if (this.isConnected)
+            return; // Prevent duplicate connections
+        console.log('Reconnecting to SSE in 1 second...');
+        setTimeout(() => {
+            this.zone.run(() => {
+                this.createSseEventSource(user, topic).subscribe(subject);
+            });
+        }, 1000);
+    }
+    closeSseEventSource() {
+        if (this.eventSource) {
+            this.eventSource.close();
+            this.eventSource = null;
+            this.isConnected = false;
+            console.log('SSE Connection closed');
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SseService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SseService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SseService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
 class BaseEditClass {
     /** Сервис индиатор загрузки. */
     loaderService = inject(LoaderService);
@@ -1129,11 +1193,11 @@ class DialogComponent {
         this.dialogRef.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: DialogComponent, isStandalone: true, selector: "ngx-uik-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title }}</h1>\n<div mat-dialog-content>\n  <div style=\"white-space: pre-line\">{{ data.message }}</div>\n</div>\n<div mat-dialog-actions align=\"end\">\n  <button mat-raised-button (click)=\"onNoClick()\" cdkFocusInitial>{{ data.btnNoTitle }}</button>\n  <button mat-raised-button color=\"warn\" [mat-dialog-close]=\"data.id\">{{ data.btnYesTitle }}</button>\n</div>\n\n", styles: [""], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: DialogComponent, isStandalone: true, selector: "ngx-uik-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title }}</h1>\r\n<div mat-dialog-content>\r\n  <div style=\"white-space: pre-line\">{{ data.message }}</div>\r\n</div>\r\n<div mat-dialog-actions align=\"end\">\r\n  <button mat-raised-button (click)=\"onNoClick()\" cdkFocusInitial>{{ data.btnNoTitle }}</button>\r\n  <button mat-raised-button color=\"warn\" [mat-dialog-close]=\"data.id\">{{ data.btnYesTitle }}</button>\r\n</div>\r\n\r\n", styles: [""], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-uik-dialog', imports: [MatDialogTitle, MatDialogContent, MatDialogActions, MatButton, MatDialogClose], template: "<h1 mat-dialog-title>{{ data.title }}</h1>\n<div mat-dialog-content>\n  <div style=\"white-space: pre-line\">{{ data.message }}</div>\n</div>\n<div mat-dialog-actions align=\"end\">\n  <button mat-raised-button (click)=\"onNoClick()\" cdkFocusInitial>{{ data.btnNoTitle }}</button>\n  <button mat-raised-button color=\"warn\" [mat-dialog-close]=\"data.id\">{{ data.btnYesTitle }}</button>\n</div>\n\n" }]
+            args: [{ selector: 'ngx-uik-dialog', imports: [MatDialogTitle, MatDialogContent, MatDialogActions, MatButton, MatDialogClose], template: "<h1 mat-dialog-title>{{ data.title }}</h1>\r\n<div mat-dialog-content>\r\n  <div style=\"white-space: pre-line\">{{ data.message }}</div>\r\n</div>\r\n<div mat-dialog-actions align=\"end\">\r\n  <button mat-raised-button (click)=\"onNoClick()\" cdkFocusInitial>{{ data.btnNoTitle }}</button>\r\n  <button mat-raised-button color=\"warn\" [mat-dialog-close]=\"data.id\">{{ data.btnYesTitle }}</button>\r\n</div>\r\n\r\n" }]
         }], ctorParameters: () => [] });
 
 class BasePageClass {
@@ -1782,7 +1846,7 @@ class DateRangeInputComponent {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.2", type: DateRangeInputComponent, isStandalone: true, selector: "ngx-uik-date-range-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, dateRange: { classPropertyName: "dateRange", publicName: "dateRange", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, clearInput: { classPropertyName: "clearInput", publicName: "clearInput", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateRangeChange: "dateRangeChange" }, providers: [
             { provide: MAT_DATE_LOCALE, useValue: 'ru' },
             { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
-        ], ngImport: i0, template: "<mat-form-field appearance=\"fill\">\n  <mat-label>{{label()}}</mat-label>\n  <mat-date-range-input\n    [rangePicker]=\"picker\"\n    [formGroup]=\"form\"\n    [min]=\"minDate()\">\n    <input matStartDate formControlName=\"begin\" placeholder=\"\u0414\u0430\u0442\u0430 \u043D\u0430\u0447\u0430\u043B\u0430\">\n    <input matEndDate formControlName=\"end\" placeholder=\"\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F\">\n  </mat-date-range-input>\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n  <mat-date-range-picker #picker></mat-date-range-picker>\n  <mat-error>\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u043F\u0435\u0440\u0438\u043E\u0434</mat-error>\n</mat-form-field>\n\n", styles: ["mat-form-field{margin-right:16px}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] });
+        ], ngImport: i0, template: "<mat-form-field appearance=\"fill\">\r\n  <mat-label>{{label()}}</mat-label>\r\n  <mat-date-range-input\r\n    [rangePicker]=\"picker\"\r\n    [formGroup]=\"form\"\r\n    [min]=\"minDate()\">\r\n    <input matStartDate formControlName=\"begin\" placeholder=\"\u0414\u0430\u0442\u0430 \u043D\u0430\u0447\u0430\u043B\u0430\">\r\n    <input matEndDate formControlName=\"end\" placeholder=\"\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F\">\r\n  </mat-date-range-input>\r\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n  <mat-date-range-picker #picker></mat-date-range-picker>\r\n  <mat-error>\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u043F\u0435\u0440\u0438\u043E\u0434</mat-error>\r\n</mat-form-field>\r\n\r\n", styles: ["mat-form-field{margin-right:16px}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DateRangeInputComponent, decorators: [{
             type: Component,
@@ -1790,7 +1854,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
                         MatDatepickerToggle, MatSuffix, MatDateRangePicker, MatError], providers: [
                         { provide: MAT_DATE_LOCALE, useValue: 'ru' },
                         { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
-                    ], template: "<mat-form-field appearance=\"fill\">\n  <mat-label>{{label()}}</mat-label>\n  <mat-date-range-input\n    [rangePicker]=\"picker\"\n    [formGroup]=\"form\"\n    [min]=\"minDate()\">\n    <input matStartDate formControlName=\"begin\" placeholder=\"\u0414\u0430\u0442\u0430 \u043D\u0430\u0447\u0430\u043B\u0430\">\n    <input matEndDate formControlName=\"end\" placeholder=\"\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F\">\n  </mat-date-range-input>\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n  <mat-date-range-picker #picker></mat-date-range-picker>\n  <mat-error>\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u043F\u0435\u0440\u0438\u043E\u0434</mat-error>\n</mat-form-field>\n\n", styles: ["mat-form-field{margin-right:16px}\n"] }]
+                    ], template: "<mat-form-field appearance=\"fill\">\r\n  <mat-label>{{label()}}</mat-label>\r\n  <mat-date-range-input\r\n    [rangePicker]=\"picker\"\r\n    [formGroup]=\"form\"\r\n    [min]=\"minDate()\">\r\n    <input matStartDate formControlName=\"begin\" placeholder=\"\u0414\u0430\u0442\u0430 \u043D\u0430\u0447\u0430\u043B\u0430\">\r\n    <input matEndDate formControlName=\"end\" placeholder=\"\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F\">\r\n  </mat-date-range-input>\r\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n  <mat-date-range-picker #picker></mat-date-range-picker>\r\n  <mat-error>\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u043F\u0435\u0440\u0438\u043E\u0434</mat-error>\r\n</mat-form-field>\r\n\r\n", styles: ["mat-form-field{margin-right:16px}\n"] }]
         }], ctorParameters: () => [] });
 
 var DialogAction;
@@ -2049,8 +2113,8 @@ class TableComponent {
     allowMultiSelect = input(false);
     /** Список элементов контекстного меню. */
     opt = input([]);
-    /** Роли которым разрешено отправлять событие rowDoubleClicked при двойном щелчке мышью. */
-    rolesDblClickedEvent = input([]);
+    /** Отправка события rowDoubleClicked (при двойном щелчке мышью) отключена. */
+    rowDblClickedDisable = input(false);
     /** Отображать строку с итогом. */
     footer = input(false);
     /** Изменение страницы. */
@@ -2084,10 +2148,6 @@ class TableComponent {
     selection = new SelectionModel();
     /** Список отображаемых колонок (формируется из @columnOptions). */
     displayedColumns;
-    // DI
-    authService = inject(AuthService);
-    // Разрешено ли отправлять событие rowDoubleClicked при двойном щелчке мышью.
-    dblClickedEventEnable = true;
     subscription = new Subscription();
     constructor() {
         effect(() => {
@@ -2101,11 +2161,6 @@ class TableComponent {
         });
     }
     ngOnInit() {
-        // получить права пользователя
-        const subs = this.authService.roles$.subscribe((userRoles) => {
-            this.dblClickedEventEnable = !this.authService.isHideElement(this.rolesDblClickedEvent(), userRoles);
-        });
-        this.subscription.add(subs);
         this.displayedColumns = ['select'].concat(this.columnOptions()?.filter(c => !c.hide).map((item) => item.name) || []);
         // пересоздаем, т.к. параметр allowMultiSelect появляется только сейчас
         this.selection = new SelectionModel(this.allowMultiSelect());
@@ -2187,7 +2242,7 @@ class TableComponent {
         // выделение строки при двойном щелчке по строке
         this.selection.clear();
         this.selection.select(row);
-        if (this.dblClickedEventEnable)
+        if (!this.rowDblClickedDisable())
             this.rowDoubleClicked.emit(row);
     }
     /** При вызове контекстного меню. */
@@ -2219,7 +2274,7 @@ class TableComponent {
             return arr.reduce((acc, value) => acc + value, 0);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TableComponent, isStandalone: true, selector: "ngx-uik-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, columnOptions: { classPropertyName: "columnOptions", publicName: "columnOptions", isSignal: true, isRequired: false, transformFunction: null }, tableState: { classPropertyName: "tableState", publicName: "tableState", isSignal: true, isRequired: true, transformFunction: null }, allowMultiSelect: { classPropertyName: "allowMultiSelect", publicName: "allowMultiSelect", isSignal: true, isRequired: false, transformFunction: null }, opt: { classPropertyName: "opt", publicName: "opt", isSignal: true, isRequired: false, transformFunction: null }, rolesDblClickedEvent: { classPropertyName: "rolesDblClickedEvent", publicName: "rolesDblClickedEvent", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageStateChange: "pageStateChange", sortStateChange: "sortStateChange", selectionChange: "selectionChange", rowDoubleClicked: "rowDoubleClicked" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"component-container\">\r\n  <div class=\"table-container\">\r\n    <table mat-table [dataSource]=\"dataSource\"\r\n      matSort\r\n      [matSortActive]=\"sortState().sortActive || ''\"\r\n      [matSortDirection]=\"sortState().sortDirection\"\r\n      matSortDisableClear>\r\n\r\n      <!-- \u0412\u044B\u0431\u043E\u0440 \u0441\u0442\u0440\u043E\u043A\u0438 Column -->\r\n      <ng-container matColumnDef=\"select\">\r\n        <th mat-header-cell *matHeaderCellDef>\r\n          @if (allowMultiSelect()) {\r\n            <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\r\n              [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n            </mat-checkbox>\r\n          }\r\n        </th>\r\n        <td mat-cell *matCellDef=\"let row\">\r\n          <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\"\r\n            [checked]=\"selection.isSelected(row)\">\r\n          </mat-checkbox>\r\n        </td>\r\n        @if (footer()) {\r\n          <td mat-footer-cell *matFooterCellDef></td>\r\n        }\r\n      </ng-container>\r\n\r\n      @for (item of columnOptions(); track item) {\r\n        <ng-container matColumnDef={{item.name}}>\r\n          <th mat-header-cell *matHeaderCellDef mat-sort-header [disabled]=\"item.titleSortDisable\">{{item.title}}</th>\r\n          @if (!item.format) {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n              {{element[item.name]}}\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footer) {\r\n                  <strong>{{ getTotal(item.name) }}</strong>\r\n                }\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }            \r\n          }\r\n          @if (item.format === 'pre-wrap') {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" class=\"pre-wrap\">\r\n              {{element[item.name]}}\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'link') {\r\n            <td mat-cell *matCellDef=\"let element\"  (contextmenu)=\"onContextMenu($event, element)\">\r\n              <a [href]=\"element[item.name]\" target=\"_blank\">{{element[item.name]}}</a>\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'linkIcon') {\r\n            <td mat-cell *matCellDef=\"let element\"  (contextmenu)=\"onContextMenu($event, element)\">\r\n              @if (element[item.name]) {\r\n                <a  [href]=\"element[item.name]\" target=\"_blank\">\r\n                  @if (item.icon) {\r\n                    <mat-icon>{{item.icon}}</mat-icon>\r\n                  } \r\n                  @if (item.symbol) {\r\n                    <span class=\"material-symbols-outlined-light\">{{item.symbol}}</span>\r\n                  }\r\n                </a>\r\n              }\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'routerLink') {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n              <a [routerLink]=\"[element[item.name]]\">{{element[item.name]}}</a>\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'routerLinkIcon') {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n              @if (element[item.name]) {\r\n                <a [routerLink]=\"[element[item.name]]\">\r\n                  @if (item.icon) {\r\n                    <mat-icon>{{item.icon}}</mat-icon>\r\n                  } \r\n                  @if (item.symbol) {\r\n                    <span class=\"material-symbols-outlined-light\">{{item.symbol}}</span>\r\n                  }\r\n                </a>\r\n              }\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'checkbox') {\r\n            <td mat-cell *matCellDef=\"let element\"  (contextmenu)=\"onContextMenu($event, element)\">\r\n              <mat-checkbox [checked]=\"element[item.name] === 1\" [disabled]=\"true\"></mat-checkbox>\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n      </ng-container>\r\n    }\r\n\r\n    <tr class=\"mat-row\" *matNoDataRow>\r\n      <td class=\"mat-cell\" colspan=\"9999\">\r\n        \u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F\r\n      </td>\r\n    </tr>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" \r\n      (click)=\"onRowClicked(row)\" (dblclick)=\"onRowDblClicked(row)\" \r\n      class=\"element-row\" [class.selected-row]=\"selection.isSelected(row)\">\r\n    </tr>\r\n    @if (footer()) {\r\n      <tr mat-footer-row *matFooterRowDef=\"displayedColumns; sticky: true\"></tr>\r\n    }\r\n  </table>\r\n  <div style=\"visibility: hidden; position: fixed\"\r\n    [style.left]=\"contextMenuPosition.x\"\r\n    [style.top]=\"contextMenuPosition.y\"\r\n    [matMenuTriggerFor]=\"contextMenu\" #menuTrigger=\"matMenuTrigger\">\r\n  </div>\r\n  <mat-menu #contextMenu=\"matMenu\">\r\n    <ng-template matMenuContent let-id=\"id\">\r\n      @for (menuItem of opt(); track menuItem) {\r\n        @if (menuItem.title === '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n          <mat-divider></mat-divider>\r\n        }\r\n        @if (menuItem.title !== '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n          <button mat-menu-item\r\n            (click)=\"menuItem.onClickFn ? menuItem.onClickFn(itemForMenu) : ''\"\r\n            (mousedown)=\"menuItem.onClickMiddleFn ? menuItem.onClickMiddleFn($event, itemForMenu, menuTrigger) : ''\"\r\n            [disabled]=\"menuItem.disabledFn ? menuItem.disabledFn(itemForMenu) : menuItem.disabled\">\r\n            @if (menuItem.icon) {\r\n              <mat-icon>{{menuItem.icon}}</mat-icon>\r\n            }\r\n            @if (menuItem.symbol) {\r\n              <span class=\"material-symbols-outlined-light\">{{menuItem.symbol}}</span>\r\n            }\r\n            {{ menuItem.title }}\r\n          </button>\r\n        }\r\n      }\r\n    </ng-template>\r\n  </mat-menu>\r\n</div>\r\n\r\n\r\n<mat-paginator [length]=\"length()\"\r\n  [pageIndex]=\"pageState().pageIndex || defaultPageIndex\"\r\n  [pageSizeOptions]=\"[5, 10, 20, 50, 100]\"\r\n  [pageSize]=\"pageState().pageSize || defaultPageSize\"\r\n  showFirstLastButtons\r\n  itemsPerPageLabel=\"\"\r\n></mat-paginator>\r\n</div>\r\n", styles: [".component-container{display:flex;flex-direction:column;height:100%}.table-container{display:flex;flex-direction:column;justify-content:space-between;flex:auto;margin:0 20px;overflow:auto;height:400px}.center{position:absolute;inset:0 0 56px;background:#00000026;z-index:1;display:flex;align-items:center;justify-content:center}.mat-column-select{overflow:initial}tr.mat-footer-row{font-weight:700;height:56px}.mat-table{overflow-x:scroll}.mat-cell,.mat-header-cell{word-wrap:initial;display:table-cell;padding:0 10px;line-break:unset;white-space:nowrap;overflow:hidden;vertical-align:middle}.mat-row,.mat-header-row{display:table-row}tr.element-row:not(.selected-row):hover{background:#f5f5f5}tr.element-row:not(.selected-row):active{background:#efefef}.selected-row{background-color:#eee}.fact-done-row{background-color:#eefdec}a,a:visited,a:hover,a:active{color:inherit}.pre-wrap{white-space:pre-wrap}\n"], dependencies: [{ kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "component", type: MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "ngmodule", type: MatTableModule }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TableComponent, isStandalone: true, selector: "ngx-uik-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, columnOptions: { classPropertyName: "columnOptions", publicName: "columnOptions", isSignal: true, isRequired: false, transformFunction: null }, tableState: { classPropertyName: "tableState", publicName: "tableState", isSignal: true, isRequired: true, transformFunction: null }, allowMultiSelect: { classPropertyName: "allowMultiSelect", publicName: "allowMultiSelect", isSignal: true, isRequired: false, transformFunction: null }, opt: { classPropertyName: "opt", publicName: "opt", isSignal: true, isRequired: false, transformFunction: null }, rowDblClickedDisable: { classPropertyName: "rowDblClickedDisable", publicName: "rowDblClickedDisable", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageStateChange: "pageStateChange", sortStateChange: "sortStateChange", selectionChange: "selectionChange", rowDoubleClicked: "rowDoubleClicked" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"component-container\">\r\n  <div class=\"table-container\">\r\n    <table mat-table [dataSource]=\"dataSource\"\r\n      matSort\r\n      [matSortActive]=\"sortState().sortActive || ''\"\r\n      [matSortDirection]=\"sortState().sortDirection\"\r\n      matSortDisableClear>\r\n\r\n      <!-- \u0412\u044B\u0431\u043E\u0440 \u0441\u0442\u0440\u043E\u043A\u0438 Column -->\r\n      <ng-container matColumnDef=\"select\">\r\n        <th mat-header-cell *matHeaderCellDef>\r\n          @if (allowMultiSelect()) {\r\n            <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\r\n              [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n            </mat-checkbox>\r\n          }\r\n        </th>\r\n        <td mat-cell *matCellDef=\"let row\">\r\n          <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\"\r\n            [checked]=\"selection.isSelected(row)\">\r\n          </mat-checkbox>\r\n        </td>\r\n        @if (footer()) {\r\n          <td mat-footer-cell *matFooterCellDef></td>\r\n        }\r\n      </ng-container>\r\n\r\n      @for (item of columnOptions(); track item) {\r\n        <ng-container matColumnDef={{item.name}}>\r\n          <th mat-header-cell *matHeaderCellDef mat-sort-header [disabled]=\"item.titleSortDisable\">{{item.title}}</th>\r\n          @if (!item.format) {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n              {{element[item.name]}}\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footer) {\r\n                  <strong>{{ getTotal(item.name) }}</strong>\r\n                }\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }            \r\n          }\r\n          @if (item.format === 'pre-wrap') {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" class=\"pre-wrap\">\r\n              {{element[item.name]}}\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'link') {\r\n            <td mat-cell *matCellDef=\"let element\"  (contextmenu)=\"onContextMenu($event, element)\">\r\n              <a [href]=\"element[item.name]\" target=\"_blank\">{{element[item.name]}}</a>\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'linkIcon') {\r\n            <td mat-cell *matCellDef=\"let element\"  (contextmenu)=\"onContextMenu($event, element)\">\r\n              @if (element[item.name]) {\r\n                <a  [href]=\"element[item.name]\" target=\"_blank\">\r\n                  @if (item.icon) {\r\n                    <mat-icon>{{item.icon}}</mat-icon>\r\n                  } \r\n                  @if (item.symbol) {\r\n                    <span class=\"material-symbols-outlined-light\">{{item.symbol}}</span>\r\n                  }\r\n                </a>\r\n              }\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'routerLink') {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n              <a [routerLink]=\"[element[item.name]]\">{{element[item.name]}}</a>\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'routerLinkIcon') {\r\n            <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n              @if (element[item.name]) {\r\n                <a [routerLink]=\"[element[item.name]]\">\r\n                  @if (item.icon) {\r\n                    <mat-icon>{{item.icon}}</mat-icon>\r\n                  } \r\n                  @if (item.symbol) {\r\n                    <span class=\"material-symbols-outlined-light\">{{item.symbol}}</span>\r\n                  }\r\n                </a>\r\n              }\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n          @if (item.format === 'checkbox') {\r\n            <td mat-cell *matCellDef=\"let element\"  (contextmenu)=\"onContextMenu($event, element)\">\r\n              <mat-checkbox [checked]=\"element[item.name] === 1\" [disabled]=\"true\"></mat-checkbox>\r\n            </td>\r\n            @if (footer()) {\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                @if (item.footerTitle) {\r\n                  <strong>{{ item.footerTitle }}</strong>\r\n                }\r\n              </td>\r\n            }\r\n          }\r\n      </ng-container>\r\n    }\r\n\r\n    <tr class=\"mat-row\" *matNoDataRow>\r\n      <td class=\"mat-cell\" colspan=\"9999\">\r\n        \u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F\r\n      </td>\r\n    </tr>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" \r\n      (click)=\"onRowClicked(row)\" (dblclick)=\"onRowDblClicked(row)\" \r\n      class=\"element-row\" [class.selected-row]=\"selection.isSelected(row)\">\r\n    </tr>\r\n    @if (footer()) {\r\n      <tr mat-footer-row *matFooterRowDef=\"displayedColumns; sticky: true\"></tr>\r\n    }\r\n  </table>\r\n  <div style=\"visibility: hidden; position: fixed\"\r\n    [style.left]=\"contextMenuPosition.x\"\r\n    [style.top]=\"contextMenuPosition.y\"\r\n    [matMenuTriggerFor]=\"contextMenu\" #menuTrigger=\"matMenuTrigger\">\r\n  </div>\r\n  <mat-menu #contextMenu=\"matMenu\">\r\n    <ng-template matMenuContent let-id=\"id\">\r\n      @for (menuItem of opt(); track menuItem) {\r\n        @if (menuItem.title === '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n          <mat-divider></mat-divider>\r\n        }\r\n        @if (menuItem.title !== '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n          <button mat-menu-item\r\n            (click)=\"menuItem.onClickFn ? menuItem.onClickFn(itemForMenu) : ''\"\r\n            (mousedown)=\"menuItem.onClickMiddleFn ? menuItem.onClickMiddleFn($event, itemForMenu, menuTrigger) : ''\"\r\n            [disabled]=\"menuItem.disabledFn ? menuItem.disabledFn(itemForMenu) : menuItem.disabled\">\r\n            @if (menuItem.icon) {\r\n              <mat-icon>{{menuItem.icon}}</mat-icon>\r\n            }\r\n            @if (menuItem.symbol) {\r\n              <span class=\"material-symbols-outlined-light\">{{menuItem.symbol}}</span>\r\n            }\r\n            {{ menuItem.title }}\r\n          </button>\r\n        }\r\n      }\r\n    </ng-template>\r\n  </mat-menu>\r\n</div>\r\n\r\n\r\n<mat-paginator [length]=\"length()\"\r\n  [pageIndex]=\"pageState().pageIndex || defaultPageIndex\"\r\n  [pageSizeOptions]=\"[5, 10, 20, 50, 100]\"\r\n  [pageSize]=\"pageState().pageSize || defaultPageSize\"\r\n  showFirstLastButtons\r\n  itemsPerPageLabel=\"\"\r\n></mat-paginator>\r\n</div>\r\n", styles: [".component-container{display:flex;flex-direction:column;height:100%}.table-container{display:flex;flex-direction:column;justify-content:space-between;flex:auto;margin:0 20px;overflow:auto;height:400px}.center{position:absolute;inset:0 0 56px;background:#00000026;z-index:1;display:flex;align-items:center;justify-content:center}.mat-column-select{overflow:initial}tr.mat-footer-row{font-weight:700;height:56px}.mat-table{overflow-x:scroll}.mat-cell,.mat-header-cell{word-wrap:initial;display:table-cell;padding:0 10px;line-break:unset;white-space:nowrap;overflow:hidden;vertical-align:middle}.mat-row,.mat-header-row{display:table-row}tr.element-row:not(.selected-row):hover{background:#f5f5f5}tr.element-row:not(.selected-row):active{background:#efefef}.selected-row{background-color:#eee}.fact-done-row{background-color:#eefdec}a,a:visited,a:hover,a:active{color:inherit}.pre-wrap{white-space:pre-wrap}\n"], dependencies: [{ kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "component", type: MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "ngmodule", type: MatTableModule }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
@@ -2237,5 +2292,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { Action, AlertService, AnimationsService, AuthService, AvatarService, BaseEditClass, BaseFilterClass, BaseMatChipComponent, BaseNavBarMenuClass, BasePageClass, BaseSelectAutocompleteWithVsComponent, BaseSelectWithGroupComponent, BaseServiceClass, BaseToolbarComponent, DateRangeInputComponent, DialogAction, DialogComponent, DisableIfRoleDirective, DisableIfUnauthorizedDirective, EntityAction, Environment, ExportService, HideIfRoleNotDirective, HideIfUnauthorizedDirective, LoaderService, LocalStorageService, LoginPageComponent, MY_FORMATS, NavBarComponent, NotFoundComponent, ProgressSpinnerComponent, ROUTE_ANIMATIONS_ELEMENTS, RedirectGuard, RoleService, SafePipe, SecUser, TableComponent, TimePipe, TruncatePipe, User, UserService, authGuard, dateFormat, isRouteAnimationsAll, isRouteAnimationsElements, isRouteAnimationsNone, isRouteAnimationsPage, roleGuard, routeAnimations };
+export { Action, AlertService, AnimationsService, AuthService, AvatarService, BaseEditClass, BaseFilterClass, BaseMatChipComponent, BaseNavBarMenuClass, BasePageClass, BaseSelectAutocompleteWithVsComponent, BaseSelectWithGroupComponent, BaseServiceClass, BaseToolbarComponent, DateRangeInputComponent, DialogAction, DialogComponent, DisableIfRoleDirective, DisableIfUnauthorizedDirective, EntityAction, Environment, ExportService, HideIfRoleNotDirective, HideIfUnauthorizedDirective, LoaderService, LocalStorageService, LoginPageComponent, MY_FORMATS, NavBarComponent, NotFoundComponent, ProgressSpinnerComponent, ROUTE_ANIMATIONS_ELEMENTS, RedirectGuard, RoleService, SafePipe, SecUser, SseService, TableComponent, TimePipe, TruncatePipe, User, UserService, authGuard, dateFormat, isRouteAnimationsAll, isRouteAnimationsElements, isRouteAnimationsNone, isRouteAnimationsPage, roleGuard, routeAnimations };
 //# sourceMappingURL=kuzntsv-uikit.mjs.map