npm - @tetacom/ng-components - Versions diffs - 1.4.4 → 1.4.5 - Mend

@tetacom/ng-components 1.4.4 → 1.4.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (320) hide show

package/fesm2022/tetacom-ng-components.mjs CHANGED Viewed

@@ -52,7 +52,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaAccordionContent]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -134,8 +134,8 @@ class IconService {
     addSprite(url, bypassInterceptors = true) {
         if (IconService._loaded.indexOf(url) < 0 && IconService._pending.indexOf(url) < 0) {
             IconService._pending.push(url);
-            this.getSVG(url, bypassInterceptors).subscribe(svg => {
-                IconService._pending = IconService._pending.filter(_ => _ !== url);
+            this.getSVG(url, bypassInterceptors).subscribe((svg) => {
+                IconService._pending = IconService._pending.filter((_) => _ !== url);
                 IconService._loaded.push(url);
                 this._renderer.insertBefore(this._document.body, svg, this._document.body.firstChild);
             });
@@ -143,8 +143,7 @@ class IconService {
     }
     getSVG(url, bypassInterceptors = true) {
         const http = bypassInterceptors ? new HttpClient(this._httpBackend) : this._http;
-        return http.get(url, { responseType: 'text' })
-            .pipe(map((svgText) => {
+        return http.get(url, { responseType: 'text' }).pipe(map((svgText) => {
             const svgEl = this.svgElementFromString(svgText);
             return this.cloneSVG(svgEl);
         }));
@@ -167,7 +166,7 @@ class IconService {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: IconService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: 'root',
                 }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
@@ -196,7 +195,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaIconSprite]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: IconService }], propDecorators: { tetaIconSprite: [{
                 type: Input
@@ -236,11 +235,11 @@ class IconComponent {
         return `#${this.name}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: IconComponent, isStandalone: true, selector: "teta-icon", inputs: { name: "name", size: "size", palette: "palette", class: "class" }, host: { properties: { "class": "this.getClass" } }, ngImport: i0, template: "<svg class=\"icon__image\" style=\"width: 100%;height: 100%\">\n  <use [attr.xlink:href]=\"getName()\"></use>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: IconComponent, isStandalone: true, selector: "teta-icon", inputs: { name: "name", size: "size", palette: "palette", class: "class" }, host: { properties: { "class": "this.getClass" } }, ngImport: i0, template: "<svg class=\"icon__image\" style=\"width: 100%; height: 100%\">\n  <use [attr.xlink:href]=\"getName()\"></use>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: IconComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-icon', imports: [IconSpriteDirective], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg class=\"icon__image\" style=\"width: 100%;height: 100%\">\n  <use [attr.xlink:href]=\"getName()\"></use>\n</svg>\n" }]
+            args: [{ selector: 'teta-icon', imports: [IconSpriteDirective], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg class=\"icon__image\" style=\"width: 100%; height: 100%\">\n  <use [attr.xlink:href]=\"getName()\"></use>\n</svg>\n" }]
         }], propDecorators: { name: [{
                 type: Input
             }], size: [{
@@ -351,14 +350,13 @@ class AvatarComponent {
             .set(AvatarColorEnum.lime, '#80C026')
             .set(AvatarColorEnum.greyish, '#7F8697');
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: AvatarComponent, isStandalone: true, selector: "teta-avatar", inputs: { photo: "photo", name: "name", id: "id", viewType: "viewType", size: "size" }, host: { properties: { "class": "this.avatar" } }, ngImport: i0, template: "<div [class]=\"avatar\">\n  @if (photo) {\n    <img [class]=\"'avatar_' + this.viewType\" [src]=\"photo\" alt=\"\"/>\n  } @else {\n    <div [class]=\"'avatar_' + this.viewType\" [style.background-color]=\"colorMap.get(id%17)||colorMap.get(0)\"\n      class=\"column align-center justify-content-center position-relative\">\n      @if (name) {\n        <p>{{name}}</p>\n      } @else {\n        <teta-icon class=\"width-10 height-10\" style=\"fill: white;width:{{size}}px; height:{{size}}px\"\n        name=\"photoCamera\"></teta-icon>\n      }\n      <div [class]=\"'avatar_' + this.viewType\" class=\"position-absolute\"\n      style=\"width: 100%;z-index:1;height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 100%);'\"></div>\n    </div>\n  }\n\n</div>\n", styles: [".avatar{font-style:normal;font-weight:600;line-height:16px}.avatar_brick{border-radius:var(--radius-base-brick)}.avatar_circle{border-radius:var(--radius-base-circle)}.avatar_rounded{border-radius:var(--radius-base-round)}.avatar-size-24{height:24px;width:24px;font-size:11px}.avatar-size-24 img,.avatar-size-24 div{height:24px;width:24px}.avatar-size-28{height:28px;width:28px;font-size:11px}.avatar-size-28 img,.avatar-size-28 div{height:28px;width:28px}.avatar-size-32{height:32px;width:32px;font-size:11px}.avatar-size-32 img,.avatar-size-32 div{height:32px;width:32px}.avatar-size-44{height:44px;width:44px;font-size:14px}.avatar-size-44 img,.avatar-size-44 div{height:44px;width:44px}.avatar-size-64{height:64px;width:64px;font-size:16px}.avatar-size-64 img,.avatar-size-64 div{height:64px;width:64px}.avatar-size-128{height:128px;width:128px;font-size:28px}.avatar-size-128 img,.avatar-size-128 div{height:128px;width:128px}.avatar-size-200{height:200px;width:200px;font-size:35px}.avatar-size-200 img,.avatar-size-200 div{height:200px;width:200px}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: AvatarComponent, isStandalone: true, selector: "teta-avatar", inputs: { photo: "photo", name: "name", id: "id", viewType: "viewType", size: "size" }, host: { properties: { "class": "this.avatar" } }, ngImport: i0, template: "<div [class]=\"avatar\">\n  @if (photo) {\n  <img [class]=\"'avatar_' + this.viewType\" [src]=\"photo\" alt=\"\" />\n  } @else {\n  <div\n    [class]=\"'avatar_' + this.viewType\"\n    [style.background-color]=\"colorMap.get(id % 17) || colorMap.get(0)\"\n    class=\"column align-center justify-content-center position-relative\"\n  >\n    @if (name) {\n    <p>{{ name }}</p>\n    } @else {\n    <teta-icon\n      class=\"width-10 height-10\"\n      style=\"fill: white;width:{{ size }}px; height:{{ size }}px\"\n      name=\"photoCamera\"\n    ></teta-icon>\n    }\n    <div\n      [class]=\"'avatar_' + this.viewType\"\n      class=\"position-absolute\"\n      style=\"width: 100%;z-index:1;height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 100%);'\"\n    ></div>\n  </div>\n  }\n</div>\n", styles: [".avatar{font-style:normal;font-weight:600;line-height:16px}.avatar_brick{border-radius:var(--radius-base-brick)}.avatar_circle{border-radius:var(--radius-base-circle)}.avatar_rounded{border-radius:var(--radius-base-round)}.avatar-size-24{height:24px;width:24px;font-size:11px}.avatar-size-24 img,.avatar-size-24 div{height:24px;width:24px}.avatar-size-28{height:28px;width:28px;font-size:11px}.avatar-size-28 img,.avatar-size-28 div{height:28px;width:28px}.avatar-size-32{height:32px;width:32px;font-size:11px}.avatar-size-32 img,.avatar-size-32 div{height:32px;width:32px}.avatar-size-44{height:44px;width:44px;font-size:14px}.avatar-size-44 img,.avatar-size-44 div{height:44px;width:44px}.avatar-size-64{height:64px;width:64px;font-size:16px}.avatar-size-64 img,.avatar-size-64 div{height:64px;width:64px}.avatar-size-128{height:128px;width:128px;font-size:28px}.avatar-size-128 img,.avatar-size-128 div{height:128px;width:128px}.avatar-size-200{height:200px;width:200px;font-size:35px}.avatar-size-200 img,.avatar-size-200 div{height:200px;width:200px}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: AvatarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-avatar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent], template: "<div [class]=\"avatar\">\n  @if (photo) {\n    <img [class]=\"'avatar_' + this.viewType\" [src]=\"photo\" alt=\"\"/>\n  } @else {\n    <div [class]=\"'avatar_' + this.viewType\" [style.background-color]=\"colorMap.get(id%17)||colorMap.get(0)\"\n      class=\"column align-center justify-content-center position-relative\">\n      @if (name) {\n        <p>{{name}}</p>\n      } @else {\n        <teta-icon class=\"width-10 height-10\" style=\"fill: white;width:{{size}}px; height:{{size}}px\"\n        name=\"photoCamera\"></teta-icon>\n      }\n      <div [class]=\"'avatar_' + this.viewType\" class=\"position-absolute\"\n      style=\"width: 100%;z-index:1;height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 100%);'\"></div>\n    </div>\n  }\n\n</div>\n", styles: [".avatar{font-style:normal;font-weight:600;line-height:16px}.avatar_brick{border-radius:var(--radius-base-brick)}.avatar_circle{border-radius:var(--radius-base-circle)}.avatar_rounded{border-radius:var(--radius-base-round)}.avatar-size-24{height:24px;width:24px;font-size:11px}.avatar-size-24 img,.avatar-size-24 div{height:24px;width:24px}.avatar-size-28{height:28px;width:28px;font-size:11px}.avatar-size-28 img,.avatar-size-28 div{height:28px;width:28px}.avatar-size-32{height:32px;width:32px;font-size:11px}.avatar-size-32 img,.avatar-size-32 div{height:32px;width:32px}.avatar-size-44{height:44px;width:44px;font-size:14px}.avatar-size-44 img,.avatar-size-44 div{height:44px;width:44px}.avatar-size-64{height:64px;width:64px;font-size:16px}.avatar-size-64 img,.avatar-size-64 div{height:64px;width:64px}.avatar-size-128{height:128px;width:128px;font-size:28px}.avatar-size-128 img,.avatar-size-128 div{height:128px;width:128px}.avatar-size-200{height:200px;width:200px;font-size:35px}.avatar-size-200 img,.avatar-size-200 div{height:200px;width:200px}\n"] }]
+            args: [{ selector: 'teta-avatar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent], template: "<div [class]=\"avatar\">\n  @if (photo) {\n  <img [class]=\"'avatar_' + this.viewType\" [src]=\"photo\" alt=\"\" />\n  } @else {\n  <div\n    [class]=\"'avatar_' + this.viewType\"\n    [style.background-color]=\"colorMap.get(id % 17) || colorMap.get(0)\"\n    class=\"column align-center justify-content-center position-relative\"\n  >\n    @if (name) {\n    <p>{{ name }}</p>\n    } @else {\n    <teta-icon\n      class=\"width-10 height-10\"\n      style=\"fill: white;width:{{ size }}px; height:{{ size }}px\"\n      name=\"photoCamera\"\n    ></teta-icon>\n    }\n    <div\n      [class]=\"'avatar_' + this.viewType\"\n      class=\"position-absolute\"\n      style=\"width: 100%;z-index:1;height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 100%);'\"\n    ></div>\n  </div>\n  }\n</div>\n", styles: [".avatar{font-style:normal;font-weight:600;line-height:16px}.avatar_brick{border-radius:var(--radius-base-brick)}.avatar_circle{border-radius:var(--radius-base-circle)}.avatar_rounded{border-radius:var(--radius-base-round)}.avatar-size-24{height:24px;width:24px;font-size:11px}.avatar-size-24 img,.avatar-size-24 div{height:24px;width:24px}.avatar-size-28{height:28px;width:28px;font-size:11px}.avatar-size-28 img,.avatar-size-28 div{height:28px;width:28px}.avatar-size-32{height:32px;width:32px;font-size:11px}.avatar-size-32 img,.avatar-size-32 div{height:32px;width:32px}.avatar-size-44{height:44px;width:44px;font-size:14px}.avatar-size-44 img,.avatar-size-44 div{height:44px;width:44px}.avatar-size-64{height:64px;width:64px;font-size:16px}.avatar-size-64 img,.avatar-size-64 div{height:64px;width:64px}.avatar-size-128{height:128px;width:128px;font-size:28px}.avatar-size-128 img,.avatar-size-128 div{height:128px;width:128px}.avatar-size-200{height:200px;width:200px;font-size:35px}.avatar-size-200 img,.avatar-size-200 div{height:200px;width:200px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { photo: [{
                 type: Input
             }], name: [{
@@ -376,8 +374,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class AutocompleteComponent {
     constructor() { }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: AutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: AutocompleteComponent, isStandalone: true, selector: "teta-autocomplete", ngImport: i0, template: "<p>autocomplete works!</p>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
@@ -509,7 +506,7 @@ class Chart3dComponent {
     }
     ngOnInit() {
         this._themeService.theme
-            .pipe(takeWhile(_ => this._alive), tap(_ => {
+            .pipe(takeWhile((_) => this._alive), tap((_) => {
             this.gridColor = _ ? '#5d6a73' : '#bdbdc6';
             this.axesColor = _ ? '#8e8f9d' : '#7d8f9a';
             this.init();
@@ -538,7 +535,7 @@ class Chart3dComponent {
             if (!data.points?.length) {
                 return;
             }
-            const points = data.points.map(_ => new THREE.Vector3(x(_.x), y(_.y), z(_.z)));
+            const points = data.points.map((_) => new THREE.Vector3(x(_.x), y(_.y), z(_.z)));
             const color = d3.scaleOrdinal(d3.schemeTableau10);
             const material = new THREE.LineBasicMaterial({
                 color: data?.color ?? color(idx.toString()),
@@ -557,15 +554,13 @@ class Chart3dComponent {
         const geometryLines = new THREE.BufferGeometry().setFromPoints(pointsLines);
         const line = new THREE.Line(geometryLines, material);
         this._scene.add(line);
-        circles.forEach(r => {
+        circles.forEach((r) => {
             const material = new THREE.LineDashedMaterial({
                 color: this.gridColor,
                 dashSize: 1,
                 gapSize: 3,
             });
-            const circleGeometry = new THREE.BufferGeometry().setFromPoints(new THREE.Path()
-                .absarc(0, 0, x(r), 0, Math.PI * 2, false)
-                .getSpacedPoints(100));
+            const circleGeometry = new THREE.BufferGeometry().setFromPoints(new THREE.Path().absarc(0, 0, x(r), 0, Math.PI * 2, false).getSpacedPoints(100));
             const circle = new THREE.LineSegments(circleGeometry, material);
             circle.geometry.rotateX(-Math.PI / 2);
             this._scene.add(circle);
@@ -585,8 +580,7 @@ class Chart3dComponent {
     }
     createScene() {
         this._scene = new THREE.Scene();
-        const aspectRatio = this._elementRef.nativeElement.clientWidth /
-            this._elementRef.nativeElement.clientHeight;
+        const aspectRatio = this._elementRef.nativeElement.clientWidth / this._elementRef.nativeElement.clientHeight;
         const fieldOfView = 10;
         const nearClippingPane = 1;
         const farClippingPane = 10000;
@@ -617,7 +611,7 @@ class Chart3dComponent {
         animate();
     }
     addResizeObserver() {
-        this._obs = new ResizeObserver(_ => {
+        this._obs = new ResizeObserver((_) => {
             this.setSize(_[0]?.contentRect.width, _[0]?.contentRect.height);
         });
         this._obs.observe(this._elementRef.nativeElement);
@@ -683,7 +677,7 @@ class Chart3dComponent {
         this._scene.add(ticks);
     }
     getScales(series) {
-        const extrems = series.map(_ => ({
+        const extrems = series.map((_) => ({
             x: d3.extent(_.points, (p) => p.x),
             y: d3.extent(_.points, (p) => p.y),
             z: d3.extent(_.points, (p) => p.z),
@@ -696,12 +690,7 @@ class Chart3dComponent {
         }, { x: [], y: [], z: [] });
         const x = d3
             .scaleLinear()
-            .domain([
-            0,
-            this._config?.axes?.max == null
-                ? parseInt(d3.max(flattenExtrems.x))
-                : this._config.axes.max,
-        ])
+            .domain([0, this._config?.axes?.max == null ? parseInt(d3.max(flattenExtrems.x)) : this._config.axes.max])
             .range([0, this.SIDE_SIZE])
             .nice();
         const y = d3
@@ -710,12 +699,7 @@ class Chart3dComponent {
             .range([this.SIDE_SIZE, 0]);
         const z = d3
             .scaleLinear()
-            .domain([
-            0,
-            this._config?.axes?.max == null
-                ? parseInt(d3.max(flattenExtrems.z))
-                : this._config.axes.max,
-        ])
+            .domain([0, this._config?.axes?.max == null ? parseInt(d3.max(flattenExtrems.z)) : this._config.axes.max])
             .range([0, this.SIDE_SIZE])
             .nice();
         return { x, y, z };
@@ -830,11 +814,11 @@ class CheckboxComponent {
         this.cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: CheckboxComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: CheckboxComponent, isStandalone: true, selector: "teta-checkbox", inputs: { class: "class", palette: "palette", noLabel: "noLabel", disabled: "disabled", value: "value", binary: "binary", labelPosition: "labelPosition", allowNull: "allowNull" }, host: { listeners: { "click": "changeValue()" }, properties: { "attr.tabindex": "this.tabindex", "class": "this.getClass", "class.checkbox_disabled": "this.disabled" } }, providers: [CHECKBOX_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "@if (labelPosition==='right') {\n  <div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n    <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n  </div>\n  @if (!noLabel) {\n    <span class=\"font-body-3\">\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </span>\n  }\n}\n@if (labelPosition==='left') {\n  @if (!noLabel) {\n    <span class=\"font-body-3\">\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </span>\n  }\n  <div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n    <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n  </div>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: CheckboxComponent, isStandalone: true, selector: "teta-checkbox", inputs: { class: "class", palette: "palette", noLabel: "noLabel", disabled: "disabled", value: "value", binary: "binary", labelPosition: "labelPosition", allowNull: "allowNull" }, host: { listeners: { "click": "changeValue()" }, properties: { "attr.tabindex": "this.tabindex", "class": "this.getClass", "class.checkbox_disabled": "this.disabled" } }, providers: [CHECKBOX_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "@if (labelPosition==='right') {\n<div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n  <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n</div>\n@if (!noLabel) {\n<span class=\"font-body-3\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</span>\n} } @if (labelPosition==='left') { @if (!noLabel) {\n<span class=\"font-body-3\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</span>\n}\n<div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n  <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n</div>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-checkbox', providers: [CHECKBOX_CONTROL_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent, NgTemplateOutlet], template: "@if (labelPosition==='right') {\n  <div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n    <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n  </div>\n  @if (!noLabel) {\n    <span class=\"font-body-3\">\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </span>\n  }\n}\n@if (labelPosition==='left') {\n  @if (!noLabel) {\n    <span class=\"font-body-3\">\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </span>\n  }\n  <div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n    <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n  </div>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n" }]
+            args: [{ selector: 'teta-checkbox', providers: [CHECKBOX_CONTROL_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent, NgTemplateOutlet], template: "@if (labelPosition==='right') {\n<div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n  <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n</div>\n@if (!noLabel) {\n<span class=\"font-body-3\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</span>\n} } @if (labelPosition==='left') { @if (!noLabel) {\n<span class=\"font-body-3\">\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</span>\n}\n<div class=\"checkbox__tick\" [class.checkbox__tick_active]=\"checked != false\">\n  <teta-icon [name]=\"checked ? 'tick' : checked === false ? '' : 'dash'\"></teta-icon>\n</div>\n}\n<ng-template #content><ng-content></ng-content></ng-template>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { tabindex: [{
                 type: HostBinding,
                 args: ['attr.tabindex']
@@ -978,7 +962,8 @@ class BasePicker {
         return new Date(date).toLocaleString(['ru'], {
             year: 'numeric',
             month: '2-digit',
-            day: '2-digit', hour12: false,
+            day: '2-digit',
+            hour12: false,
             hour: this.showTime ? '2-digit' : undefined,
             minute: this.showTime ? '2-digit' : undefined,
         });
@@ -1042,15 +1027,7 @@ const enLocale = {
         'November',
         'December',
     ],
-    days: [
-        'Sunday',
-        'Monday',
-        'Tuesday',
-        'Wednesday',
-        'Thursday',
-        'Friday',
-        'Saturday',
-    ],
+    days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
     daysShort: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
 };
@@ -1074,7 +1051,7 @@ class TetaConfigService {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TetaConfigService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: 'root',
                 }]
         }], ctorParameters: () => [] });
@@ -1113,37 +1090,30 @@ class BaseCalendar {
         };
     }
     generateCalendar(selectedDate, year, month, minMax) {
-        const calendarStartDay = selectedDate
-            .set('year', year)
-            .set('month', month)
-            .set('date', 1)
-            .startOf('week');
+        const calendarStartDay = selectedDate.set('year', year).set('month', month).set('date', 1).startOf('week');
         const calendar = new Array(42).fill(1).map((v, i) => {
             return calendarStartDay.add(i, 'day');
         });
-        return calendar.map(d => {
+        return calendar.map((d) => {
             return new DayModel({
                 date: new Date(d.toDate()),
                 isCurrentMonth: month === d.month(),
-                disabled: !this.isSuitableMinDate(d.toDate(), minMax.min) ||
-                    !this.isSuitableMaxDate(d.toDate(), minMax.max),
+                disabled: !this.isSuitableMinDate(d.toDate(), minMax.min) || !this.isSuitableMaxDate(d.toDate(), minMax.max),
                 selected: this.isSelected(d.toDate(), selectedDate.toDate()),
             });
         });
     }
     isSuitableMinDate(d, minDate) {
-        return (dayjs(new Date(minDate)).startOf('date').toDate() <= new Date(d) ||
-            !minDate);
+        return dayjs(new Date(minDate)).startOf('date').toDate() <= new Date(d) || !minDate;
     }
     isSuitableMaxDate(d, maxDate) {
-        return (new Date(d) < dayjs(new Date(maxDate)).endOf('date').toDate() ||
-            !maxDate);
+        return new Date(d) < dayjs(new Date(maxDate)).endOf('date').toDate() || !maxDate;
     }
     isSelected(date, selectedDate) {
         const isSelectedDate = date.getDate() === selectedDate?.getDate();
         const isSelectedYear = date.getFullYear() === selectedDate?.getFullYear();
         const isSelectedMonth = date.getMonth() === selectedDate?.getMonth();
-        return (isSelectedDate && isSelectedMonth && isSelectedYear && !this.isDateNull);
+        return isSelectedDate && isSelectedMonth && isSelectedYear && !this.isDateNull;
     }
     ngOnDestroy() {
         this.alive = false;
@@ -1223,7 +1193,7 @@ class ScrollToSelectedYearDirective {
         this.alive = false;
     }
     ngAfterViewInit() {
-        this.el.nativeElement.scrollIntoView({ inline: "center", block: "center" });
+        this.el.nativeElement.scrollIntoView({ inline: 'center', block: 'center' });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ScrollToSelectedYearDirective, deps: [{ token: ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.1", type: ScrollToSelectedYearDirective, isStandalone: true, selector: "[tetaScrollToSelectedYear]", ngImport: i0 }); }
@@ -1232,7 +1202,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaScrollToSelectedYear]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef, decorators: [{
                     type: Inject,
@@ -1256,18 +1226,20 @@ class YearPickerComponent {
     }
     isDisabled(year) {
         if (this.minMax) {
-            const isSuitableMax = dayjs(new Date().setFullYear(year)).startOf('year').isAfter(new Date(this.minMax.max)) && this.minMax.max !== null;
-            const isSuitableMin = dayjs(new Date().setFullYear(year)).endOf('year').isBefore(new Date(this.minMax.min)) && this.minMax.min !== null;
+            const isSuitableMax = dayjs(new Date().setFullYear(year)).startOf('year').isAfter(new Date(this.minMax.max)) &&
+                this.minMax.max !== null;
+            const isSuitableMin = dayjs(new Date().setFullYear(year)).endOf('year').isBefore(new Date(this.minMax.min)) &&
+                this.minMax.min !== null;
             return isSuitableMax || isSuitableMin;
         }
         return false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: YearPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: YearPickerComponent, isStandalone: true, selector: "teta-year-picker", inputs: { selectedYear: "selectedYear", viewType: "viewType", minMax: "minMax", locale: "locale" }, outputs: { selectYear: "selectYear" }, ngImport: i0, template: "<div class=\"column\">\n  <div class=\"font-title-3 padding-v-4 padding-h-3\">\n    <p>{{locale.selectYear}}</p>\n  </div>\n  <div class=\"datepicker-year overflow-y-auto\">\n    @for (y of years; track y) {\n      <div class=\"font-button-2\" (click)=\"pickYear(y.id,y.disabled)\">\n        <div [ngClass]=\"{'datepicker-year_item_active':y.isSelected,'datepicker-year_item_disabled':y.disabled}\"\n          [class]=\"'datepicker-year_item column align-center justify-content-center datepicker_'+viewType\">\n          @if ( y.isSelected===true) {\n            <div tetaScrollToSelectedYear>\n              <span>{{y.id}}</span>\n            </div>\n          }\n          @if (!y.isSelected) {\n            <div>\n              <span>{{y.id}} </span>\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: ScrollToSelectedYearDirective, selector: "[tetaScrollToSelectedYear]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: YearPickerComponent, isStandalone: true, selector: "teta-year-picker", inputs: { selectedYear: "selectedYear", viewType: "viewType", minMax: "minMax", locale: "locale" }, outputs: { selectYear: "selectYear" }, ngImport: i0, template: "<div class=\"column\">\n  <div class=\"font-title-3 padding-v-4 padding-h-3\">\n    <p>{{ locale.selectYear }}</p>\n  </div>\n  <div class=\"datepicker-year overflow-y-auto\">\n    @for (y of years; track y) {\n    <div class=\"font-button-2\" (click)=\"pickYear(y.id, y.disabled)\">\n      <div\n        [ngClass]=\"{ 'datepicker-year_item_active': y.isSelected, 'datepicker-year_item_disabled': y.disabled }\"\n        [class]=\"'datepicker-year_item column align-center justify-content-center datepicker_' + viewType\"\n      >\n        @if ( y.isSelected===true) {\n        <div tetaScrollToSelectedYear>\n          <span>{{ y.id }}</span>\n        </div>\n        } @if (!y.isSelected) {\n        <div>\n          <span>{{ y.id }} </span>\n        </div>\n        }\n      </div>\n    </div>\n    }\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: ScrollToSelectedYearDirective, selector: "[tetaScrollToSelectedYear]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: YearPickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-year-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, ScrollToSelectedYearDirective], template: "<div class=\"column\">\n  <div class=\"font-title-3 padding-v-4 padding-h-3\">\n    <p>{{locale.selectYear}}</p>\n  </div>\n  <div class=\"datepicker-year overflow-y-auto\">\n    @for (y of years; track y) {\n      <div class=\"font-button-2\" (click)=\"pickYear(y.id,y.disabled)\">\n        <div [ngClass]=\"{'datepicker-year_item_active':y.isSelected,'datepicker-year_item_disabled':y.disabled}\"\n          [class]=\"'datepicker-year_item column align-center justify-content-center datepicker_'+viewType\">\n          @if ( y.isSelected===true) {\n            <div tetaScrollToSelectedYear>\n              <span>{{y.id}}</span>\n            </div>\n          }\n          @if (!y.isSelected) {\n            <div>\n              <span>{{y.id}} </span>\n            </div>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n" }]
+            args: [{ selector: 'teta-year-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, ScrollToSelectedYearDirective], template: "<div class=\"column\">\n  <div class=\"font-title-3 padding-v-4 padding-h-3\">\n    <p>{{ locale.selectYear }}</p>\n  </div>\n  <div class=\"datepicker-year overflow-y-auto\">\n    @for (y of years; track y) {\n    <div class=\"font-button-2\" (click)=\"pickYear(y.id, y.disabled)\">\n      <div\n        [ngClass]=\"{ 'datepicker-year_item_active': y.isSelected, 'datepicker-year_item_disabled': y.disabled }\"\n        [class]=\"'datepicker-year_item column align-center justify-content-center datepicker_' + viewType\"\n      >\n        @if ( y.isSelected===true) {\n        <div tetaScrollToSelectedYear>\n          <span>{{ y.id }}</span>\n        </div>\n        } @if (!y.isSelected) {\n        <div>\n          <span>{{ y.id }} </span>\n        </div>\n        }\n      </div>\n    </div>\n    }\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { selectedYear: [{
                 type: Input
             }], viewType: [{
@@ -1298,16 +1270,16 @@ class MonthPickerComponent {
             return {
                 id: i,
                 name: m,
-                isSelected: this.selectedMonth === i
+                isSelected: this.selectedMonth === i,
             };
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MonthPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MonthPickerComponent, isStandalone: true, selector: "teta-month-picker", inputs: { selectedMonth: "selectedMonth", viewType: "viewType", currentYear: "currentYear", localeMoths: "localeMoths" }, outputs: { selectMonth: "selectMonth", changeYear: "changeYear" }, ngImport: i0, template: "<div class=\"padding-h-3 padding-v-2 gap-8 column datepicker-month-wrapper\">\n  <div class=\"row align-center justify-content-between font-button-2\">\n    <teta-button [class]=\"'change-month-button datepicker_'+viewType\" [square]=\"true\"\n      (click)=\"pickYear(currentYear-1)\"\n      palette=\"text\"\n      view=\"ghost\">\n      <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n    <p>{{currentYear}}</p>\n    <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker_'+viewType\"\n      (click)=\"pickYear(currentYear+1)\"\n      palette=\"text\"\n      view=\"ghost\">\n      <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n  </div>\n  <div class=\"datepicker-month font-body-3 color-text-90\"\n    style=\"width: 100%\">\n    @for (month of months; track month) {\n      <div (click)=\"pickMonth(month.id)\">\n        <div [ngClass]=\"{'datepicker-month_item_active':month['isSelected']}\"\n          [class]=\"'datepicker-month_item column align-center justify-content-center datepicker_'+viewType\">\n          <p>\n            {{month.name}}\n          </p>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MonthPickerComponent, isStandalone: true, selector: "teta-month-picker", inputs: { selectedMonth: "selectedMonth", viewType: "viewType", currentYear: "currentYear", localeMoths: "localeMoths" }, outputs: { selectMonth: "selectMonth", changeYear: "changeYear" }, ngImport: i0, template: "<div class=\"padding-h-3 padding-v-2 gap-8 column datepicker-month-wrapper\">\n  <div class=\"row align-center justify-content-between font-button-2\">\n    <teta-button\n      [class]=\"'change-month-button datepicker_' + viewType\"\n      [square]=\"true\"\n      (click)=\"pickYear(currentYear - 1)\"\n      palette=\"text\"\n      view=\"ghost\"\n    >\n      <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n    <p>{{ currentYear }}</p>\n    <teta-button\n      [square]=\"true\"\n      [class]=\"'change-month-button datepicker_' + viewType\"\n      (click)=\"pickYear(currentYear + 1)\"\n      palette=\"text\"\n      view=\"ghost\"\n    >\n      <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n  </div>\n  <div class=\"datepicker-month font-body-3 color-text-90\" style=\"width: 100%\">\n    @for (month of months; track month) {\n    <div (click)=\"pickMonth(month.id)\">\n      <div\n        [ngClass]=\"{ 'datepicker-month_item_active': month['isSelected'] }\"\n        [class]=\"'datepicker-month_item column align-center justify-content-center datepicker_' + viewType\"\n      >\n        <p>\n          {{ month.name }}\n        </p>\n      </div>\n    </div>\n    }\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MonthPickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-month-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ButtonComponent, IconComponent, NgClass], template: "<div class=\"padding-h-3 padding-v-2 gap-8 column datepicker-month-wrapper\">\n  <div class=\"row align-center justify-content-between font-button-2\">\n    <teta-button [class]=\"'change-month-button datepicker_'+viewType\" [square]=\"true\"\n      (click)=\"pickYear(currentYear-1)\"\n      palette=\"text\"\n      view=\"ghost\">\n      <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n    <p>{{currentYear}}</p>\n    <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker_'+viewType\"\n      (click)=\"pickYear(currentYear+1)\"\n      palette=\"text\"\n      view=\"ghost\">\n      <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n  </div>\n  <div class=\"datepicker-month font-body-3 color-text-90\"\n    style=\"width: 100%\">\n    @for (month of months; track month) {\n      <div (click)=\"pickMonth(month.id)\">\n        <div [ngClass]=\"{'datepicker-month_item_active':month['isSelected']}\"\n          [class]=\"'datepicker-month_item column align-center justify-content-center datepicker_'+viewType\">\n          <p>\n            {{month.name}}\n          </p>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n\n" }]
+            args: [{ selector: 'teta-month-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ButtonComponent, IconComponent, NgClass], template: "<div class=\"padding-h-3 padding-v-2 gap-8 column datepicker-month-wrapper\">\n  <div class=\"row align-center justify-content-between font-button-2\">\n    <teta-button\n      [class]=\"'change-month-button datepicker_' + viewType\"\n      [square]=\"true\"\n      (click)=\"pickYear(currentYear - 1)\"\n      palette=\"text\"\n      view=\"ghost\"\n    >\n      <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n    <p>{{ currentYear }}</p>\n    <teta-button\n      [square]=\"true\"\n      [class]=\"'change-month-button datepicker_' + viewType\"\n      (click)=\"pickYear(currentYear + 1)\"\n      palette=\"text\"\n      view=\"ghost\"\n    >\n      <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n    </teta-button>\n  </div>\n  <div class=\"datepicker-month font-body-3 color-text-90\" style=\"width: 100%\">\n    @for (month of months; track month) {\n    <div (click)=\"pickMonth(month.id)\">\n      <div\n        [ngClass]=\"{ 'datepicker-month_item_active': month['isSelected'] }\"\n        [class]=\"'datepicker-month_item column align-center justify-content-center datepicker_' + viewType\"\n      >\n        <p>\n          {{ month.name }}\n        </p>\n      </div>\n    </div>\n    }\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { selectedMonth: [{
                 type: Input
             }], viewType: [{
@@ -1323,14 +1295,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             }] } });
 class DayItemComponent {
-    ngOnInit() {
-    }
+    ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DayItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: DayItemComponent, isStandalone: true, selector: "teta-day-item", inputs: { day: "day" }, ngImport: i0, template: "<p>{{day.date.getDate()}}</p>\n\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: DayItemComponent, isStandalone: true, selector: "teta-day-item", inputs: { day: "day" }, ngImport: i0, template: "<p>{{ day.date.getDate() }}</p>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DayItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-day-item', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<p>{{day.date.getDate()}}</p>\n\n" }]
+            args: [{ selector: 'teta-day-item', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<p>{{ day.date.getDate() }}</p>\n" }]
         }], propDecorators: { day: [{
                 type: Input
             }] } });
@@ -1348,7 +1319,7 @@ class DayPickerComponent {
     }
     isHoveredRange(day) {
         if (!this.range?.to && this.range?.from) {
-            return this.isInRange(day, this.range.from, this.hoveredDate) || this.isInRange(day, this.hoveredDate, this.range.from);
+            return (this.isInRange(day, this.range.from, this.hoveredDate) || this.isInRange(day, this.hoveredDate, this.range.from));
         }
         return false;
     }
@@ -1386,9 +1357,9 @@ class DayPickerComponent {
         }
     }
     getClassStaticItem(d) {
-        const from = dayjs(new Date(this.range.from)).startOf("day").toDate();
-        const to = dayjs(new Date(this.range.to)).startOf("day").toDate();
-        const itemDate = dayjs(new Date(d.date)).startOf("day").toDate();
+        const from = dayjs(new Date(this.range.from)).startOf('day').toDate();
+        const to = dayjs(new Date(this.range.to)).startOf('day').toDate();
+        const itemDate = dayjs(new Date(d.date)).startOf('day').toDate();
         if (from.getTime() === itemDate.getTime()) {
             return 'datepicker-date_active-first';
         }
@@ -1421,11 +1392,11 @@ class DayPickerComponent {
         this.dayOrder = arr;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DayPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DayPickerComponent, isStandalone: true, selector: "teta-day-picker", inputs: { date: "date", calendar: "calendar", viewType: "viewType", range: "range", min: "min", max: "max", locale: "locale", hoveredDate: "hoveredDate" }, outputs: { hoveredDateChange: "hoveredDateChange", selectDate: "selectDate" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"datepicker-week font-caption\">\n  @for (day of dayOrder; track day) {\n    <p class=\"datepicker-day\">\n      {{day}}\n    </p>\n  }\n</div>\n<div class=\"datepicker-picker color-text-90 font-body-3\">\n  @for (day of calendar; track day) {\n    <div [class]=\"getRangeActiveClass(day)+' datepicker-date font-body-3 datepicker_'+viewType\"\n      (mouseenter)=\"hover(day.date)\"\n      (click)=\"pickDate(day)\"\n         [ngClass]=\"{'datepicker-date_active':day.selected||(day.date===hoveredDate&&range&&!range.to),'datepicker-date-range_hover':range&&isHoveredRange(day),\n         'datepicker-date_disabled':day.disabled,'color-text-30':day.disabled||(!range&&!day.isCurrentMonth),'datepicker-date-range_disabled':!day.isCurrentMonth&&range,'datepicker-date-range_active':isActiveRange(day)}\">\n      <teta-day-item [day]=\"day\"></teta-day-item>\n    </div>\n  }\n</div>\n\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DayItemComponent, selector: "teta-day-item", inputs: ["day"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DayPickerComponent, isStandalone: true, selector: "teta-day-picker", inputs: { date: "date", calendar: "calendar", viewType: "viewType", range: "range", min: "min", max: "max", locale: "locale", hoveredDate: "hoveredDate" }, outputs: { hoveredDateChange: "hoveredDateChange", selectDate: "selectDate" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"datepicker-week font-caption\">\n  @for (day of dayOrder; track day) {\n  <p class=\"datepicker-day\">\n    {{ day }}\n  </p>\n  }\n</div>\n<div class=\"datepicker-picker color-text-90 font-body-3\">\n  @for (day of calendar; track day) {\n  <div\n    [class]=\"getRangeActiveClass(day) + ' datepicker-date font-body-3 datepicker_' + viewType\"\n    (mouseenter)=\"hover(day.date)\"\n    (click)=\"pickDate(day)\"\n    [ngClass]=\"{\n      'datepicker-date_active': day.selected || (day.date === hoveredDate && range && !range.to),\n      'datepicker-date-range_hover': range && isHoveredRange(day),\n      'datepicker-date_disabled': day.disabled,\n      'color-text-30': day.disabled || (!range && !day.isCurrentMonth),\n      'datepicker-date-range_disabled': !day.isCurrentMonth && range,\n      'datepicker-date-range_active': isActiveRange(day)\n    }\"\n  >\n    <teta-day-item [day]=\"day\"></teta-day-item>\n  </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DayItemComponent, selector: "teta-day-item", inputs: ["day"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DayPickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-day-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, DayItemComponent], template: "<div class=\"datepicker-week font-caption\">\n  @for (day of dayOrder; track day) {\n    <p class=\"datepicker-day\">\n      {{day}}\n    </p>\n  }\n</div>\n<div class=\"datepicker-picker color-text-90 font-body-3\">\n  @for (day of calendar; track day) {\n    <div [class]=\"getRangeActiveClass(day)+' datepicker-date font-body-3 datepicker_'+viewType\"\n      (mouseenter)=\"hover(day.date)\"\n      (click)=\"pickDate(day)\"\n         [ngClass]=\"{'datepicker-date_active':day.selected||(day.date===hoveredDate&&range&&!range.to),'datepicker-date-range_hover':range&&isHoveredRange(day),\n         'datepicker-date_disabled':day.disabled,'color-text-30':day.disabled||(!range&&!day.isCurrentMonth),'datepicker-date-range_disabled':!day.isCurrentMonth&&range,'datepicker-date-range_active':isActiveRange(day)}\">\n      <teta-day-item [day]=\"day\"></teta-day-item>\n    </div>\n  }\n</div>\n\n" }]
+            args: [{ selector: 'teta-day-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, DayItemComponent], template: "<div class=\"datepicker-week font-caption\">\n  @for (day of dayOrder; track day) {\n  <p class=\"datepicker-day\">\n    {{ day }}\n  </p>\n  }\n</div>\n<div class=\"datepicker-picker color-text-90 font-body-3\">\n  @for (day of calendar; track day) {\n  <div\n    [class]=\"getRangeActiveClass(day) + ' datepicker-date font-body-3 datepicker_' + viewType\"\n    (mouseenter)=\"hover(day.date)\"\n    (click)=\"pickDate(day)\"\n    [ngClass]=\"{\n      'datepicker-date_active': day.selected || (day.date === hoveredDate && range && !range.to),\n      'datepicker-date-range_hover': range && isHoveredRange(day),\n      'datepicker-date_disabled': day.disabled,\n      'color-text-30': day.disabled || (!range && !day.isCurrentMonth),\n      'datepicker-date-range_disabled': !day.isCurrentMonth && range,\n      'datepicker-date-range_active': isActiveRange(day)\n    }\"\n  >\n    <teta-day-item [day]=\"day\"></teta-day-item>\n  </div>\n  }\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { date: [{
                 type: Input
             }], calendar: [{
@@ -1459,23 +1430,16 @@ class DateCalendarComponent extends BaseCalendar {
             .pipe(takeWhile$1(() => this.alive), filter(([currentYear, currentMonth]) => currentMonth !== null && currentYear !== null), map$1(([year, month, minMax]) => {
             return this.generateCalendar(dayjs(new Date(this.selectedDate)).locale('ru', { weekStart: 1 }), year, month, minMax);
         }))
-            .subscribe(_ => {
+            .subscribe((_) => {
             this.calendar = _;
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateCalendarComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateCalendarComponent, isStandalone: true, selector: "teta-date-calendar", inputs: { selectedDate: "selectedDate", open: "open", locale: "locale", viewType: "viewType", min: "min", isDateNull: "isDateNull", max: "max" }, outputs: { setDate: "setDate" }, usesInheritance: true, ngImport: i0, template: "@if ({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async}; as data) {\n  <div\n    class=\"datepicker-content overflow-y-auto\"\n    >\n    @if (data.selectedPicker==='day') {\n      <div class=\"padding-h-3 padding-v-2\" (wheel)=\"scrollMonth($event,data.currentMonth,data.currentYear)\">\n        <div class=\"row align-center justify-content-between\">\n          <teta-button [class]=\"'change-month-button datepicker_'+viewType\" [square]=\"true\"\n            (click)=\"changeMonth(data.currentMonth-1,data.currentYear)\"\n            palette=\"text\"\n            view=\"ghost\">\n            <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n          </teta-button>\n          <div class=\"row gap-4 font-button-2 \">\n            <button [class]=\"'datepicker_'+viewType \" teta-button view=\"ghost\" palette=\"text\"\n            (click)=\"selectPicker('month')\"> {{getMothName(data.currentMonth)}}</button>\n            <button [class]=\"'datepicker_'+viewType\" teta-button view=\"ghost\" palette=\"text\"\n            (click)=\"selectPicker('year')\">{{data.currentYear}}</button>\n          </div>\n          <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker_'+viewType\"\n            (click)=\"changeMonth(data.currentMonth+1,data.currentYear)\"\n            palette=\"text\"\n            view=\"ghost\">\n            <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n          </teta-button>\n        </div>\n        <div>\n          <teta-day-picker [viewType]=\"viewType\" (selectDate)=\"selectDate($event)\" [locale]=\"locale\"\n          [calendar]=\"calendar\"></teta-day-picker>\n        </div>\n      </div>\n    }\n    @if (data.selectedPicker==='month') {\n      <teta-month-picker [localeMoths]=\"locale.months\" [currentYear]=\"data.currentYear\" (changeYear)=\"setYear($event)\"\n        [selectedMonth]=\"data.currentMonth\" [viewType]=\"viewType\"\n      (selectMonth)=\"selectMonth($event)\"></teta-month-picker>\n    }\n    @if (data.selectedPicker==='year') {\n      <teta-year-picker [locale]=\"locale\" [viewType]=\"viewType\" (selectYear)=\"selectYear($event)\"\n      [selectedYear]=\"data.currentYear\"></teta-year-picker>\n    }\n  </div>\n}\n\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DayPickerComponent, selector: "teta-day-picker", inputs: ["date", "calendar", "viewType", "range", "min", "max", "locale", "hoveredDate"], outputs: ["hoveredDateChange", "selectDate"] }, { kind: "component", type: MonthPickerComponent, selector: "teta-month-picker", inputs: ["selectedMonth", "viewType", "currentYear", "localeMoths"], outputs: ["selectMonth", "changeYear"] }, { kind: "component", type: YearPickerComponent, selector: "teta-year-picker", inputs: ["selectedYear", "viewType", "minMax", "locale"], outputs: ["selectYear"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateCalendarComponent, isStandalone: true, selector: "teta-date-calendar", inputs: { selectedDate: "selectedDate", open: "open", locale: "locale", viewType: "viewType", min: "min", isDateNull: "isDateNull", max: "max" }, outputs: { setDate: "setDate" }, usesInheritance: true, ngImport: i0, template: "@if ({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async}; as data) {\n<div class=\"datepicker-content overflow-y-auto\">\n  @if (data.selectedPicker==='day') {\n  <div class=\"padding-h-3 padding-v-2\" (wheel)=\"scrollMonth($event, data.currentMonth, data.currentYear)\">\n    <div class=\"row align-center justify-content-between\">\n      <teta-button\n        [class]=\"'change-month-button datepicker_' + viewType\"\n        [square]=\"true\"\n        (click)=\"changeMonth(data.currentMonth - 1, data.currentYear)\"\n        palette=\"text\"\n        view=\"ghost\"\n      >\n        <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n      </teta-button>\n      <div class=\"row gap-4 font-button-2\">\n        <button\n          [class]=\"'datepicker_' + viewType\"\n          teta-button\n          view=\"ghost\"\n          palette=\"text\"\n          (click)=\"selectPicker('month')\"\n        >\n          {{ getMothName(data.currentMonth) }}\n        </button>\n        <button\n          [class]=\"'datepicker_' + viewType\"\n          teta-button\n          view=\"ghost\"\n          palette=\"text\"\n          (click)=\"selectPicker('year')\"\n        >\n          {{ data.currentYear }}\n        </button>\n      </div>\n      <teta-button\n        [square]=\"true\"\n        [class]=\"'change-month-button datepicker_' + viewType\"\n        (click)=\"changeMonth(data.currentMonth + 1, data.currentYear)\"\n        palette=\"text\"\n        view=\"ghost\"\n      >\n        <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n      </teta-button>\n    </div>\n    <div>\n      <teta-day-picker\n        [viewType]=\"viewType\"\n        (selectDate)=\"selectDate($event)\"\n        [locale]=\"locale\"\n        [calendar]=\"calendar\"\n      ></teta-day-picker>\n    </div>\n  </div>\n  } @if (data.selectedPicker==='month') {\n  <teta-month-picker\n    [localeMoths]=\"locale.months\"\n    [currentYear]=\"data.currentYear\"\n    (changeYear)=\"setYear($event)\"\n    [selectedMonth]=\"data.currentMonth\"\n    [viewType]=\"viewType\"\n    (selectMonth)=\"selectMonth($event)\"\n  ></teta-month-picker>\n  } @if (data.selectedPicker==='year') {\n  <teta-year-picker\n    [locale]=\"locale\"\n    [viewType]=\"viewType\"\n    (selectYear)=\"selectYear($event)\"\n    [selectedYear]=\"data.currentYear\"\n  ></teta-year-picker>\n  }\n</div>\n}\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DayPickerComponent, selector: "teta-day-picker", inputs: ["date", "calendar", "viewType", "range", "min", "max", "locale", "hoveredDate"], outputs: ["hoveredDateChange", "selectDate"] }, { kind: "component", type: MonthPickerComponent, selector: "teta-month-picker", inputs: ["selectedMonth", "viewType", "currentYear", "localeMoths"], outputs: ["selectMonth", "changeYear"] }, { kind: "component", type: YearPickerComponent, selector: "teta-year-picker", inputs: ["selectedYear", "viewType", "minMax", "locale"], outputs: ["selectYear"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateCalendarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-date-calendar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        ButtonComponent,
-                        IconComponent,
-                        DayPickerComponent,
-                        MonthPickerComponent,
-                        YearPickerComponent,
-                        AsyncPipe,
-                    ], template: "@if ({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async}; as data) {\n  <div\n    class=\"datepicker-content overflow-y-auto\"\n    >\n    @if (data.selectedPicker==='day') {\n      <div class=\"padding-h-3 padding-v-2\" (wheel)=\"scrollMonth($event,data.currentMonth,data.currentYear)\">\n        <div class=\"row align-center justify-content-between\">\n          <teta-button [class]=\"'change-month-button datepicker_'+viewType\" [square]=\"true\"\n            (click)=\"changeMonth(data.currentMonth-1,data.currentYear)\"\n            palette=\"text\"\n            view=\"ghost\">\n            <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n          </teta-button>\n          <div class=\"row gap-4 font-button-2 \">\n            <button [class]=\"'datepicker_'+viewType \" teta-button view=\"ghost\" palette=\"text\"\n            (click)=\"selectPicker('month')\"> {{getMothName(data.currentMonth)}}</button>\n            <button [class]=\"'datepicker_'+viewType\" teta-button view=\"ghost\" palette=\"text\"\n            (click)=\"selectPicker('year')\">{{data.currentYear}}</button>\n          </div>\n          <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker_'+viewType\"\n            (click)=\"changeMonth(data.currentMonth+1,data.currentYear)\"\n            palette=\"text\"\n            view=\"ghost\">\n            <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n          </teta-button>\n        </div>\n        <div>\n          <teta-day-picker [viewType]=\"viewType\" (selectDate)=\"selectDate($event)\" [locale]=\"locale\"\n          [calendar]=\"calendar\"></teta-day-picker>\n        </div>\n      </div>\n    }\n    @if (data.selectedPicker==='month') {\n      <teta-month-picker [localeMoths]=\"locale.months\" [currentYear]=\"data.currentYear\" (changeYear)=\"setYear($event)\"\n        [selectedMonth]=\"data.currentMonth\" [viewType]=\"viewType\"\n      (selectMonth)=\"selectMonth($event)\"></teta-month-picker>\n    }\n    @if (data.selectedPicker==='year') {\n      <teta-year-picker [locale]=\"locale\" [viewType]=\"viewType\" (selectYear)=\"selectYear($event)\"\n      [selectedYear]=\"data.currentYear\"></teta-year-picker>\n    }\n  </div>\n}\n\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"] }]
+            args: [{ selector: 'teta-date-calendar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ButtonComponent, IconComponent, DayPickerComponent, MonthPickerComponent, YearPickerComponent, AsyncPipe], template: "@if ({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async}; as data) {\n<div class=\"datepicker-content overflow-y-auto\">\n  @if (data.selectedPicker==='day') {\n  <div class=\"padding-h-3 padding-v-2\" (wheel)=\"scrollMonth($event, data.currentMonth, data.currentYear)\">\n    <div class=\"row align-center justify-content-between\">\n      <teta-button\n        [class]=\"'change-month-button datepicker_' + viewType\"\n        [square]=\"true\"\n        (click)=\"changeMonth(data.currentMonth - 1, data.currentYear)\"\n        palette=\"text\"\n        view=\"ghost\"\n      >\n        <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n      </teta-button>\n      <div class=\"row gap-4 font-button-2\">\n        <button\n          [class]=\"'datepicker_' + viewType\"\n          teta-button\n          view=\"ghost\"\n          palette=\"text\"\n          (click)=\"selectPicker('month')\"\n        >\n          {{ getMothName(data.currentMonth) }}\n        </button>\n        <button\n          [class]=\"'datepicker_' + viewType\"\n          teta-button\n          view=\"ghost\"\n          palette=\"text\"\n          (click)=\"selectPicker('year')\"\n        >\n          {{ data.currentYear }}\n        </button>\n      </div>\n      <teta-button\n        [square]=\"true\"\n        [class]=\"'change-month-button datepicker_' + viewType\"\n        (click)=\"changeMonth(data.currentMonth + 1, data.currentYear)\"\n        palette=\"text\"\n        view=\"ghost\"\n      >\n        <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n      </teta-button>\n    </div>\n    <div>\n      <teta-day-picker\n        [viewType]=\"viewType\"\n        (selectDate)=\"selectDate($event)\"\n        [locale]=\"locale\"\n        [calendar]=\"calendar\"\n      ></teta-day-picker>\n    </div>\n  </div>\n  } @if (data.selectedPicker==='month') {\n  <teta-month-picker\n    [localeMoths]=\"locale.months\"\n    [currentYear]=\"data.currentYear\"\n    (changeYear)=\"setYear($event)\"\n    [selectedMonth]=\"data.currentMonth\"\n    [viewType]=\"viewType\"\n    (selectMonth)=\"selectMonth($event)\"\n  ></teta-month-picker>\n  } @if (data.selectedPicker==='year') {\n  <teta-year-picker\n    [locale]=\"locale\"\n    [viewType]=\"viewType\"\n    (selectYear)=\"selectYear($event)\"\n    [selectedYear]=\"data.currentYear\"\n  ></teta-year-picker>\n  }\n</div>\n}\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { selectedDate: [{
                 type: Input
             }], open: [{
@@ -1506,7 +1470,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaDropdownContent]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }] });
@@ -1629,7 +1593,7 @@ class ArrayUtil {
     }
     static flatten(data, children, onlyLeafs) {
         const result = [];
-        data.forEach(child => {
+        data.forEach((child) => {
             let childItems = [];
             if (children) {
                 if (typeof children === 'string') {
@@ -1642,9 +1606,7 @@ class ArrayUtil {
             else {
                 childItems = child.children;
             }
-            if (childItems !== null &&
-                childItems !== undefined &&
-                childItems.length > 0) {
+            if (childItems !== null && childItems !== undefined && childItems.length > 0) {
                 if (!onlyLeafs) {
                     result.push(child);
                 }
@@ -1657,7 +1619,7 @@ class ArrayUtil {
         return result;
     }
     static findRecursive(tree, comparer, children = 'children') {
-        const found = tree.find(x => comparer(x));
+        const found = tree.find((x) => comparer(x));
         if (found !== null && found !== undefined) {
             return found;
         }
@@ -1703,7 +1665,7 @@ class ArrayUtil {
         const result = [];
         if (array && array.length) {
             for (const item of array) {
-                const found = result.find(_ => comparator(_) === comparator(item));
+                const found = result.find((_) => comparator(_) === comparator(item));
                 if (!found) {
                     result.push(item);
                 }
@@ -1755,8 +1717,7 @@ class DomUtil {
         return null;
     }
     static isOverflown(element) {
-        return (element.scrollHeight > element.clientHeight ||
-            element.scrollWidth > element.clientWidth);
+        return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
     }
 }
@@ -1785,9 +1746,7 @@ class PositionUtil {
             rect.left = containerPosition.right - elementWidth - margin;
         }
         if (align === Align.center) {
-            rect.left =
-                (containerPosition.left + containerPosition.right) / 2 -
-                    elementWidth / 2;
+            rect.left = (containerPosition.left + containerPosition.right) / 2 - elementWidth / 2;
         }
         if (align === Align.outerAuto) {
             align = Align.outerRight;
@@ -1840,9 +1799,7 @@ class PositionUtil {
             rect.top = containerPosition.top + verticalMargin;
         }
         if (verticalAlign === VerticalAlign.center) {
-            rect.top =
-                (containerPosition.top + containerPosition.bottom) / 2 -
-                    elementHeight / 2;
+            rect.top = (containerPosition.top + containerPosition.bottom) / 2 - elementHeight / 2;
         }
         if (rect.left + elementWidth > window.innerWidth) {
             rect.left = window.innerWidth - elementWidth;
@@ -1861,8 +1818,7 @@ class PositionUtil {
             verticalAlign === VerticalAlign.innerBottom) {
             rect.maxHeight = window.innerHeight - rect.top;
         }
-        if (verticalAlign === VerticalAlign.top ||
-            verticalAlign === VerticalAlign.innerTop) {
+        if (verticalAlign === VerticalAlign.top || verticalAlign === VerticalAlign.innerTop) {
             rect.maxHeight = containerPosition.top;
         }
         if (!isNaN(rect.left)) {
@@ -1875,9 +1831,7 @@ class PositionUtil {
             rect.top = rect.top - transformedParentRect.top;
         }
         if (!isNaN(rect.bottom)) {
-            rect.bottom = rect.bottom
-                ? rect.bottom - transformedParentRect.bottom
-                : rect.bottom;
+            rect.bottom = rect.bottom ? rect.bottom - transformedParentRect.bottom : rect.bottom;
         }
         return rect;
     }
@@ -1886,8 +1840,7 @@ class PositionUtil {
         element.style.right = rect.right != null ? `${rect.right}px` : '';
         element.style.top = rect.top != null ? `${rect.top}px` : '';
         element.style.bottom = rect.bottom != null ? `${rect.bottom}px` : '';
-        element.style.maxHeight =
-            rect.maxHeight != null ? `${rect.maxHeight}px` : '';
+        element.style.maxHeight = rect.maxHeight != null ? `${rect.maxHeight}px` : '';
         element.style.minWidth = rect.minWidth != null ? `${rect.minWidth}px` : '';
     }
     static getMaxHeight(position) {
@@ -1928,10 +1881,7 @@ class PopupContentComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PopupContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: PopupContentComponent, isStandalone: true, selector: "teta-popup-content", inputs: { className: "className" }, host: { properties: { "@dialog": "this.dialog", "class": "this.getClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], animations: [
             trigger('dialog', [
-                transition('void => *', [
-                    style({ opacity: '0' }),
-                    animate(200, style({ opacity: '1' })),
-                ]),
+                transition('void => *', [style({ opacity: '0' }), animate(200, style({ opacity: '1' }))]),
                 transition('* => void', [animate(200, style({ opacity: '0' }))]),
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -1940,10 +1890,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Component,
             args: [{ selector: 'teta-popup-content', animations: [
                         trigger('dialog', [
-                            transition('void => *', [
-                                style({ opacity: '0' }),
-                                animate(200, style({ opacity: '1' })),
-                            ]),
+                            transition('void => *', [style({ opacity: '0' }), animate(200, style({ opacity: '1' }))]),
                             transition('* => void', [animate(200, style({ opacity: '0' }))]),
                         ]),
                     ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<ng-content></ng-content>\n" }]
@@ -1981,8 +1928,8 @@ class DynamicContentBaseDirective {
         this._alive = true;
         this._open = false;
         this._zone.onStable
-            .pipe(takeWhile(_ => this._alive), filter$1(_ => this._open))
-            .subscribe(_ => {
+            .pipe(takeWhile((_) => this._alive), filter$1((_) => this._open))
+            .subscribe((_) => {
             this.setPosition();
         });
     }
@@ -2062,34 +2009,25 @@ class HintDirective extends DynamicContentBaseDirective {
         }
     }
     click(event) {
-        if (this._open &&
-            this._componentRef &&
-            DomUtil.clickedInside(this._componentRef.location.nativeElement, event)) {
+        if (this._open && this._componentRef && DomUtil.clickedInside(this._componentRef.location.nativeElement, event)) {
             event.stopPropagation();
         }
     }
     setPosition() {
         if (this._componentRef && this._open) {
             if (!this._componentRect) {
-                this._componentRect =
-                    this._componentRef.location.nativeElement.getBoundingClientRect();
+                this._componentRect = this._componentRef.location.nativeElement.getBoundingClientRect();
             }
             const position = PositionUtil.getPosition(this._elementRef.nativeElement.getBoundingClientRect(), this._componentRect, this.align, this.verticalAlign, 0, 4);
             PositionUtil.setElementPosition(this._componentRef.location.nativeElement, position);
         }
     }
     createHint() {
-        if (!this._dynamicContent ||
-            (this.overflownOnly &&
-                !DomUtil.isOverflown(this._elementRef.nativeElement))) {
+        if (!this._dynamicContent || (this.overflownOnly && !DomUtil.isOverflown(this._elementRef.nativeElement))) {
             return;
         }
         this._componentRef = this.createContentRef();
-        this._componentRef.instance.className = [
-            ...ArrayUtil.asArray(this.className),
-            'hint ',
-            'hint_' + this.viewType,
-        ];
+        this._componentRef.instance.className = [...ArrayUtil.asArray(this.className), 'hint ', 'hint_' + this.viewType];
     }
     ngOnDestroy() {
         super.ngOnDestroy();
@@ -2140,11 +2078,11 @@ class InputComponent {
         return !this.horizontal;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: InputComponent, isStandalone: true, selector: "teta-input", inputs: { label: "label", hint: "hint", viewType: "viewType", horizontal: "horizontal", required: "required" }, host: { properties: { "class.row": "this.horizontal", "class.column": "this.column" } }, ngImport: i0, template: "@if (label?.length > 0) {\n  <div class=\"font-caption color-text-70 align-center row nowrap overflow-hidden text-overflow-ellipsis\"\n    [class.row_6]=\"horizontal\"\n    [class.text-field_required]=\"required\"\n    >\n    <span class=\"overflow-hidden text-overflow-ellipsis\"\n      [tetaHint]=\"hint ?? label\"\n      [align]=\"align.left\"\n      [overflownOnly]=\"!hint || hint === label\">\n      {{label}}\n    </span>\n  </div>\n}\n<div [class]=\"'input-container input_'+viewType\" [class.row_6]=\"horizontal\">\n  <ng-content></ng-content>\n  <div class=\"input-message font-error-message font-caption\">\n    <ng-content select=\"message\"></ng-content>\n  </div>\n</div>\n", styles: [":host{display:flex;grid-gap:4px;flex-grow:1;flex-basis:10px}\n"], dependencies: [{ kind: "directive", type: HintDirective, selector: "[tetaHint]", inputs: ["tetaHint", "align", "verticalAlign", "delay", "viewType", "overflownOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: InputComponent, isStandalone: true, selector: "teta-input", inputs: { label: "label", hint: "hint", viewType: "viewType", horizontal: "horizontal", required: "required" }, host: { properties: { "class.row": "this.horizontal", "class.column": "this.column" } }, ngImport: i0, template: "@if (label?.length > 0) {\n<div\n  class=\"font-caption color-text-70 align-center row nowrap overflow-hidden text-overflow-ellipsis\"\n  [class.row_6]=\"horizontal\"\n  [class.text-field_required]=\"required\"\n>\n  <span\n    class=\"overflow-hidden text-overflow-ellipsis\"\n    [tetaHint]=\"hint ?? label\"\n    [align]=\"align.left\"\n    [overflownOnly]=\"!hint || hint === label\"\n  >\n    {{ label }}\n  </span>\n</div>\n}\n<div [class]=\"'input-container input_' + viewType\" [class.row_6]=\"horizontal\">\n  <ng-content></ng-content>\n  <div class=\"input-message font-error-message font-caption\">\n    <ng-content select=\"message\"></ng-content>\n  </div>\n</div>\n", styles: [":host{display:flex;grid-gap:4px;flex-grow:1;flex-basis:10px}\n"], dependencies: [{ kind: "directive", type: HintDirective, selector: "[tetaHint]", inputs: ["tetaHint", "align", "verticalAlign", "delay", "viewType", "overflownOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: InputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-input', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HintDirective], template: "@if (label?.length > 0) {\n  <div class=\"font-caption color-text-70 align-center row nowrap overflow-hidden text-overflow-ellipsis\"\n    [class.row_6]=\"horizontal\"\n    [class.text-field_required]=\"required\"\n    >\n    <span class=\"overflow-hidden text-overflow-ellipsis\"\n      [tetaHint]=\"hint ?? label\"\n      [align]=\"align.left\"\n      [overflownOnly]=\"!hint || hint === label\">\n      {{label}}\n    </span>\n  </div>\n}\n<div [class]=\"'input-container input_'+viewType\" [class.row_6]=\"horizontal\">\n  <ng-content></ng-content>\n  <div class=\"input-message font-error-message font-caption\">\n    <ng-content select=\"message\"></ng-content>\n  </div>\n</div>\n", styles: [":host{display:flex;grid-gap:4px;flex-grow:1;flex-basis:10px}\n"] }]
+            args: [{ selector: 'teta-input', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HintDirective], template: "@if (label?.length > 0) {\n<div\n  class=\"font-caption color-text-70 align-center row nowrap overflow-hidden text-overflow-ellipsis\"\n  [class.row_6]=\"horizontal\"\n  [class.text-field_required]=\"required\"\n>\n  <span\n    class=\"overflow-hidden text-overflow-ellipsis\"\n    [tetaHint]=\"hint ?? label\"\n    [align]=\"align.left\"\n    [overflownOnly]=\"!hint || hint === label\"\n  >\n    {{ label }}\n  </span>\n</div>\n}\n<div [class]=\"'input-container input_' + viewType\" [class.row_6]=\"horizontal\">\n  <ng-content></ng-content>\n  <div class=\"input-message font-error-message font-caption\">\n    <ng-content select=\"message\"></ng-content>\n  </div>\n</div>\n", styles: [":host{display:flex;grid-gap:4px;flex-grow:1;flex-basis:10px}\n"] }]
         }], propDecorators: { label: [{
                 type: Input
             }], hint: [{
@@ -2174,7 +2112,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaDropdownHead]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{
                     type: Optional
@@ -2195,9 +2133,7 @@ class DropdownBase {
         return this._open;
     }
     get container() {
-        return this.appendToBody
-            ? this._document.body
-            : this._elementRef.nativeElement;
+        return this.appendToBody ? this._document.body : this._elementRef.nativeElement;
     }
     constructor(_cdr, _document, _elementRef, _zone, _renderer) {
         this._cdr = _cdr;
@@ -2216,16 +2152,14 @@ class DropdownBase {
         this._backdrop = null;
         this._open = false;
         this._alive = true;
-        this.scrollListener = event => {
-            if (this.open &&
-                !this._body.contains(event.target) &&
-                this._body !== event.target) {
+        this.scrollListener = (event) => {
+            if (this.open && !this._body.contains(event.target) && this._body !== event.target) {
                 this.closeDropdown();
             }
         };
         this._zone.onStable
-            .pipe(takeWhile(_ => this._alive), throttleTime(10, undefined, { trailing: true }))
-            .subscribe(_ => {
+            .pipe(takeWhile((_) => this._alive), throttleTime(10, undefined, { trailing: true }))
+            .subscribe((_) => {
             if (this._head?.nativeElement && this._body) {
                 setTimeout(() => {
                     if (this._head?.nativeElement && this._body) {
@@ -2238,8 +2172,7 @@ class DropdownBase {
     }
     click(event) {
         if (this.open) {
-            if (!DomUtil.clickedInside(this._body, event) ||
-                this.autoCloseIgnore.indexOf('inside') < 0) {
+            if (!DomUtil.clickedInside(this._body, event) || this.autoCloseIgnore.indexOf('inside') < 0) {
                 this.closeDropdown();
             }
         }
@@ -2250,10 +2183,7 @@ class DropdownBase {
         }
     }
     documentClick(event) {
-        if (!this.open ||
-            !this.autoClose ||
-            event.detail === 0 ||
-            DomUtil.clickedInside(this._head.nativeElement, event)) {
+        if (!this.open || !this.autoClose || event.detail === 0 || DomUtil.clickedInside(this._head.nativeElement, event)) {
             return;
         }
         if (DomUtil.clickedInside(this._body, event)) {
@@ -2269,9 +2199,7 @@ class DropdownBase {
     }
     keyUp(event) {
         const key = ['esc', 'enter'];
-        if (!this.open ||
-            !this.autoClose ||
-            key.every((_) => this.autoCloseIgnore.indexOf(_) >= 0)) {
+        if (!this.open || !this.autoClose || key.every((_) => this.autoCloseIgnore.indexOf(_) >= 0)) {
             return;
         }
         if ((event.code === 'Escape' && this.autoCloseIgnore.indexOf('esc') < 0) ||
@@ -2305,8 +2233,7 @@ class DropdownBase {
         this.openChange.emit(this.open);
         const renderer = this._renderer;
         const content = this._content.nativeElement;
-        const container = (this._body =
-            this._body || renderer.createElement('div'));
+        const container = (this._body = this._body || renderer.createElement('div'));
         renderer.addClass(container, 'dropdown');
         renderer.addClass(container, 'dropdown_' + this.viewType);
         if (this.backdrop) {
@@ -2316,7 +2243,7 @@ class DropdownBase {
         }
         if (this.className != null) {
             if (this.className instanceof Array && this.className.length > 0) {
-                this.className.forEach(_ => {
+                this.className.forEach((_) => {
                     renderer.addClass(container, _);
                 });
             }
@@ -2415,8 +2342,7 @@ class DropdownComponent extends DropdownBase {
         this._zone = _zone;
         this._renderer = _renderer;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     ngOnDestroy() {
         this.closeDropdown();
         this.removeScrollListener();
@@ -2543,8 +2469,7 @@ class DatePickerComponent extends BasePicker {
             this.selectedDate.next(date);
         }
     }
-    onChange(date) {
-    }
+    onChange(date) { }
     registerOnChange(fn) {
         this.onChange = fn;
     }
@@ -2569,7 +2494,7 @@ class DatePickerComponent extends BasePicker {
         this.prepareInput(false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DatePickerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.DatePipe }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DatePickerComponent, isStandalone: true, selector: "teta-date-picker", inputs: { date: "date", showTime: "showTime", minDate: "minDate", maxDate: "maxDate", invalid: "invalid", disabled: "disabled", align: "align", verticalAlign: "verticalAlign", viewType: "viewType", appendToBody: "appendToBody", backdrop: "backdrop", allowNull: "allowNull", firstDayOfWeek: "firstDayOfWeek", disabledDates: "disabledDates", disabledPeriods: "disabledPeriods", disabledDays: "disabledDays", minYearDate: "minYearDate", maxYearDate: "maxYearDate" }, outputs: { selectDate: "selectDate" }, host: { properties: { "class.datepicker": "this.classDatepicker", "class.datepicker-time": "this.dateTimeClass", "tabindex": "this.tabindex" } }, providers: [DATE_PICKER_CONTROL_VALUE_ACCESSOR, DatePipe], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if ({\n  selectedDate:selectedDate | async\n  }; as data) {\n  <teta-dropdown\n    class='row row_auto'\n    [appendToBody]='appendToBody'\n    [backdrop]='backdrop'\n    [open]='open'\n    (openChange)='openChange($event)'\n    [viewType]='viewType'\n    [disabled]='disabled'\n    [verticalAlign]='verticalAlign'\n    [align]='align'\n    [autoCloseIgnore]=\"['esc', 'inside','enter']\">\n    <div tetaDropdownHead\n      [class]=\"'datepicker-head font-body-3 gap-8  datepicker_'+viewType\"\n      [ngClass]=\"{'datepicker-head_invalid':invalid,'datepicker-head_disabled':disabled}\">\n      <teta-input class='row row_auto flex'>\n        <div [class]=\"'row_auto row datepicker_'+viewType\">\n          <div class='row row_auto position-relative font-body-3 align-center'>\n            <input [ngClass]=\"{'color-text-90':!disabled}\"\n              [disabled]='disabled' #input style='z-index: 1'\n              class='row_auto border-0'\n              (keydown)='checkEnter($event)'\n              [(ngModel)]='inputText'\n              (ngModelChange)='changeInput($event)'\n              [maskito]='maskitoOptions'>\n              @if (data.selectedDate||allowNull) {\n                <div (click)='input.focus()' class='position-absolute color-text-10'\n                style='cursor: text;user-select: none'>{{placeholder}}</div>\n              }\n            </div>\n            <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n          </div>\n        </teta-input>\n      </div>\n      <div tetaDropdownContent\n        (click)='$event.preventDefault()'>\n        <teta-date-calendar [isDateNull]='date===null'\n          [open]='open'\n          [max]='maxDate'\n          [min]='minDate'\n          (setDate)='changeSelectedDate($event)'\n          [selectedDate]='data.selectedDate'\n        [viewType]='viewType' [locale]='locale|async'></teta-date-calendar>\n      </div>\n    </teta-dropdown>\n  }\n", styles: [""], dependencies: [{ kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MaskitoModule }, { kind: "directive", type: i4.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "directive", type: i4.MaskitoCVA, selector: "input[maskito], textarea[maskito]", inputs: ["maskito"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "component", type: DateCalendarComponent, selector: "teta-date-calendar", inputs: ["selectedDate", "open", "locale", "viewType", "min", "isDateNull", "max"], outputs: ["setDate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DatePickerComponent, isStandalone: true, selector: "teta-date-picker", inputs: { date: "date", showTime: "showTime", minDate: "minDate", maxDate: "maxDate", invalid: "invalid", disabled: "disabled", align: "align", verticalAlign: "verticalAlign", viewType: "viewType", appendToBody: "appendToBody", backdrop: "backdrop", allowNull: "allowNull", firstDayOfWeek: "firstDayOfWeek", disabledDates: "disabledDates", disabledPeriods: "disabledPeriods", disabledDays: "disabledDays", minYearDate: "minYearDate", maxYearDate: "maxYearDate" }, outputs: { selectDate: "selectDate" }, host: { properties: { "class.datepicker": "this.classDatepicker", "class.datepicker-time": "this.dateTimeClass", "tabindex": "this.tabindex" } }, providers: [DATE_PICKER_CONTROL_VALUE_ACCESSOR, DatePipe], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if ({ selectedDate:selectedDate | async }; as data) {\n<teta-dropdown\n  class=\"row row_auto\"\n  [appendToBody]=\"appendToBody\"\n  [backdrop]=\"backdrop\"\n  [open]=\"open\"\n  (openChange)=\"openChange($event)\"\n  [viewType]=\"viewType\"\n  [disabled]=\"disabled\"\n  [verticalAlign]=\"verticalAlign\"\n  [align]=\"align\"\n  [autoCloseIgnore]=\"['esc', 'inside', 'enter']\"\n>\n  <div\n    tetaDropdownHead\n    [class]=\"'datepicker-head font-body-3 gap-8  datepicker_' + viewType\"\n    [ngClass]=\"{ 'datepicker-head_invalid': invalid, 'datepicker-head_disabled': disabled }\"\n  >\n    <teta-input class=\"row row_auto flex\">\n      <div [class]=\"'row_auto row datepicker_' + viewType\">\n        <div class=\"row row_auto position-relative font-body-3 align-center\">\n          <input\n            [ngClass]=\"{ 'color-text-90': !disabled }\"\n            [disabled]=\"disabled\"\n            #input\n            style=\"z-index: 1\"\n            class=\"row_auto border-0\"\n            (keydown)=\"checkEnter($event)\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"changeInput($event)\"\n            [maskito]=\"maskitoOptions\"\n          />\n          @if (data.selectedDate||allowNull) {\n          <div (click)=\"input.focus()\" class=\"position-absolute color-text-10\" style=\"cursor: text; user-select: none\">\n            {{ placeholder }}\n          </div>\n          }\n        </div>\n        <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n      </div>\n    </teta-input>\n  </div>\n  <div tetaDropdownContent (click)=\"$event.preventDefault()\">\n    <teta-date-calendar\n      [isDateNull]=\"date === null\"\n      [open]=\"open\"\n      [max]=\"maxDate\"\n      [min]=\"minDate\"\n      (setDate)=\"changeSelectedDate($event)\"\n      [selectedDate]=\"data.selectedDate\"\n      [viewType]=\"viewType\"\n      [locale]=\"locale | async\"\n    ></teta-date-calendar>\n  </div>\n</teta-dropdown>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MaskitoModule }, { kind: "directive", type: i4.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "directive", type: i4.MaskitoCVA, selector: "input[maskito], textarea[maskito]", inputs: ["maskito"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "component", type: DateCalendarComponent, selector: "teta-date-calendar", inputs: ["selectedDate", "open", "locale", "viewType", "min", "isDateNull", "max"], outputs: ["setDate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
@@ -2584,7 +2509,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         DropdownContentDirective,
                         DateCalendarComponent,
                         AsyncPipe,
-                    ], template: "@if ({\n  selectedDate:selectedDate | async\n  }; as data) {\n  <teta-dropdown\n    class='row row_auto'\n    [appendToBody]='appendToBody'\n    [backdrop]='backdrop'\n    [open]='open'\n    (openChange)='openChange($event)'\n    [viewType]='viewType'\n    [disabled]='disabled'\n    [verticalAlign]='verticalAlign'\n    [align]='align'\n    [autoCloseIgnore]=\"['esc', 'inside','enter']\">\n    <div tetaDropdownHead\n      [class]=\"'datepicker-head font-body-3 gap-8  datepicker_'+viewType\"\n      [ngClass]=\"{'datepicker-head_invalid':invalid,'datepicker-head_disabled':disabled}\">\n      <teta-input class='row row_auto flex'>\n        <div [class]=\"'row_auto row datepicker_'+viewType\">\n          <div class='row row_auto position-relative font-body-3 align-center'>\n            <input [ngClass]=\"{'color-text-90':!disabled}\"\n              [disabled]='disabled' #input style='z-index: 1'\n              class='row_auto border-0'\n              (keydown)='checkEnter($event)'\n              [(ngModel)]='inputText'\n              (ngModelChange)='changeInput($event)'\n              [maskito]='maskitoOptions'>\n              @if (data.selectedDate||allowNull) {\n                <div (click)='input.focus()' class='position-absolute color-text-10'\n                style='cursor: text;user-select: none'>{{placeholder}}</div>\n              }\n            </div>\n            <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n          </div>\n        </teta-input>\n      </div>\n      <div tetaDropdownContent\n        (click)='$event.preventDefault()'>\n        <teta-date-calendar [isDateNull]='date===null'\n          [open]='open'\n          [max]='maxDate'\n          [min]='minDate'\n          (setDate)='changeSelectedDate($event)'\n          [selectedDate]='data.selectedDate'\n        [viewType]='viewType' [locale]='locale|async'></teta-date-calendar>\n      </div>\n    </teta-dropdown>\n  }\n" }]
+                    ], template: "@if ({ selectedDate:selectedDate | async }; as data) {\n<teta-dropdown\n  class=\"row row_auto\"\n  [appendToBody]=\"appendToBody\"\n  [backdrop]=\"backdrop\"\n  [open]=\"open\"\n  (openChange)=\"openChange($event)\"\n  [viewType]=\"viewType\"\n  [disabled]=\"disabled\"\n  [verticalAlign]=\"verticalAlign\"\n  [align]=\"align\"\n  [autoCloseIgnore]=\"['esc', 'inside', 'enter']\"\n>\n  <div\n    tetaDropdownHead\n    [class]=\"'datepicker-head font-body-3 gap-8  datepicker_' + viewType\"\n    [ngClass]=\"{ 'datepicker-head_invalid': invalid, 'datepicker-head_disabled': disabled }\"\n  >\n    <teta-input class=\"row row_auto flex\">\n      <div [class]=\"'row_auto row datepicker_' + viewType\">\n        <div class=\"row row_auto position-relative font-body-3 align-center\">\n          <input\n            [ngClass]=\"{ 'color-text-90': !disabled }\"\n            [disabled]=\"disabled\"\n            #input\n            style=\"z-index: 1\"\n            class=\"row_auto border-0\"\n            (keydown)=\"checkEnter($event)\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"changeInput($event)\"\n            [maskito]=\"maskitoOptions\"\n          />\n          @if (data.selectedDate||allowNull) {\n          <div (click)=\"input.focus()\" class=\"position-absolute color-text-10\" style=\"cursor: text; user-select: none\">\n            {{ placeholder }}\n          </div>\n          }\n        </div>\n        <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n      </div>\n    </teta-input>\n  </div>\n  <div tetaDropdownContent (click)=\"$event.preventDefault()\">\n    <teta-date-calendar\n      [isDateNull]=\"date === null\"\n      [open]=\"open\"\n      [max]=\"maxDate\"\n      [min]=\"minDate\"\n      (setDate)=\"changeSelectedDate($event)\"\n      [selectedDate]=\"data.selectedDate\"\n      [viewType]=\"viewType\"\n      [locale]=\"locale | async\"\n    ></teta-date-calendar>\n  </div>\n</teta-dropdown>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.DatePipe }, { type: TetaConfigService }], propDecorators: { date: [{
                 type: Input
             }], showTime: [{
@@ -2660,7 +2585,7 @@ class RangeCalendarComponent extends BaseCalendar {
                 nextMonth: this.generateCalendar(dayjs(new Date(this.selectedDate.from || new Date())).locale('ru', { weekStart: 1 }), availableYear, availableMonth, minMax),
             };
         }))
-            .subscribe(_ => {
+            .subscribe((_) => {
             this.calendar = _;
         });
     }
@@ -2707,7 +2632,7 @@ class RangeCalendarComponent extends BaseCalendar {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: RangeCalendarComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: RangeCalendarComponent, isStandalone: true, selector: "teta-range-calendar", inputs: { locale: "locale", open: "open", date: "date", viewType: "viewType", allowNull: "allowNull", selectedDate: "selectedDate", min: "min", isDateNull: "isDateNull", max: "max" }, outputs: { hoveredDateChange: "hoveredDateChange", setDate: "setDate" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if ({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async,minMax:minMax|async}; as data) {\n  <div\n    class=\"datepicker-content overflow-y-auto\"\n    >\n    @if (data.selectedPicker==='day') {\n      <div class=\"row \" (wheel)=\"scrollMonth($event,data.currentMonth,data.currentYear)\">\n        <div class=\"padding-h-3 padding-v-2\">\n          <div class=\"row align-center justify-content-between\">\n            <teta-button\n              [ngClass]=\"{'datepicker-arrow_hidden':!isLastDaySuitable(data.currentMonth-1,data.currentYear,min)}\"\n              [class]=\"'change-month-button datepicker_'+viewType\" [square]=\"true\"\n              (click)=\"changeMonth(data.currentMonth-1,data.currentYear)\"\n              palette=\"text\"\n              view=\"ghost\">\n              <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n            </teta-button>\n            <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n              <p> {{getMothName(data.currentMonth)}}</p>\n              <button [class]=\"'datepicker_'+viewType\" teta-button view=\"ghost\" palette=\"text\"\n              (click)=\"selectPicker('year')\">{{data.currentYear}}</button>\n            </div>\n            <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker-arrow_hidden datepicker_'+viewType\"\n              palette=\"text\"\n              view=\"ghost\">\n              <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n            </teta-button>\n          </div>\n          <div>\n            <teta-day-picker [(hoveredDate)]=\"hoveredDate\" [range]=\"getFromTo()\" [viewType]=\"viewType\"\n              (selectDate)=\"selectDate($event)\" [locale]=\"locale\"\n            [calendar]=\"calendar.currentMonth\"></teta-day-picker>\n          </div>\n        </div>\n        @if (getAvailableMonthYear(data.currentMonth+1,data.currentYear); as availableMonthYear) {\n          <div class=\"padding-h-3 padding-v-2\"\n            >\n            <div class=\"row align-center justify-content-between\">\n              <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker-arrow_hidden datepicker_'+viewType\"\n                palette=\"text\"\n                view=\"ghost\">\n                <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n              </teta-button>\n              <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n                <p>{{getMothName(availableMonthYear.availableMonth)}}</p>\n                <button [class]=\"'datepicker_'+viewType\" teta-button view=\"ghost\" palette=\"text\"\n                (click)=\"selectPicker('year')\">{{availableMonthYear.availableYear}}</button>\n              </div>\n              <teta-button [square]=\"true\"\n                [ngClass]=\"{'datepicker-arrow_hidden': !isFirstDaySuitable(data.currentMonth+2,data.currentYear,max)}\"\n                [class]=\"'change-month-button datepicker_'+viewType\"\n                (click)=\"changeMonth(data.currentMonth+1,data.currentYear)\"\n                palette=\"text\"\n                view=\"ghost\">\n                <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n              </teta-button>\n            </div>\n            <div>\n              <teta-day-picker [(hoveredDate)]=\"hoveredDate\" [range]=\"getFromTo()\" [viewType]=\"viewType\"\n                (selectDate)=\"selectDate($event)\" [locale]=\"locale\"\n              [calendar]=\"calendar.nextMonth\"></teta-day-picker>\n            </div>\n          </div>\n        }\n      </div>\n    }\n    @if (data.selectedPicker==='month') {\n      <teta-month-picker [localeMoths]=\"locale.months\" [currentYear]=\"data.currentYear\" (changeYear)=\"setYear($event)\"\n        [selectedMonth]=\"data.currentMonth\" [viewType]=\"viewType\"\n      (selectMonth)=\"selectMonth($event)\"></teta-month-picker>\n    }\n    @if (data.selectedPicker==='year') {\n      <teta-year-picker [minMax]=\"data.minMax\" [locale]=\"locale\" [viewType]=\"viewType\" (selectYear)=\"selectYear($event)\"\n      [selectedYear]=\"data.currentYear\"></teta-year-picker>\n    }\n  </div>\n}\n\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DayPickerComponent, selector: "teta-day-picker", inputs: ["date", "calendar", "viewType", "range", "min", "max", "locale", "hoveredDate"], outputs: ["hoveredDateChange", "selectDate"] }, { kind: "component", type: MonthPickerComponent, selector: "teta-month-picker", inputs: ["selectedMonth", "viewType", "currentYear", "localeMoths"], outputs: ["selectMonth", "changeYear"] }, { kind: "component", type: YearPickerComponent, selector: "teta-year-picker", inputs: ["selectedYear", "viewType", "minMax", "locale"], outputs: ["selectYear"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: RangeCalendarComponent, isStandalone: true, selector: "teta-range-calendar", inputs: { locale: "locale", open: "open", date: "date", viewType: "viewType", allowNull: "allowNull", selectedDate: "selectedDate", min: "min", isDateNull: "isDateNull", max: "max" }, outputs: { hoveredDateChange: "hoveredDateChange", setDate: "setDate" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if\n({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async,minMax:minMax|async};\nas data) {\n<div class=\"datepicker-content overflow-y-auto\">\n  @if (data.selectedPicker==='day') {\n  <div class=\"row\" (wheel)=\"scrollMonth($event, data.currentMonth, data.currentYear)\">\n    <div class=\"padding-h-3 padding-v-2\">\n      <div class=\"row align-center justify-content-between\">\n        <teta-button\n          [ngClass]=\"{ 'datepicker-arrow_hidden': !isLastDaySuitable(data.currentMonth - 1, data.currentYear, min) }\"\n          [class]=\"'change-month-button datepicker_' + viewType\"\n          [square]=\"true\"\n          (click)=\"changeMonth(data.currentMonth - 1, data.currentYear)\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n        <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n          <p>{{ getMothName(data.currentMonth) }}</p>\n          <button\n            [class]=\"'datepicker_' + viewType\"\n            teta-button\n            view=\"ghost\"\n            palette=\"text\"\n            (click)=\"selectPicker('year')\"\n          >\n            {{ data.currentYear }}\n          </button>\n        </div>\n        <teta-button\n          [square]=\"true\"\n          [class]=\"'change-month-button datepicker-arrow_hidden datepicker_' + viewType\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n      </div>\n      <div>\n        <teta-day-picker\n          [(hoveredDate)]=\"hoveredDate\"\n          [range]=\"getFromTo()\"\n          [viewType]=\"viewType\"\n          (selectDate)=\"selectDate($event)\"\n          [locale]=\"locale\"\n          [calendar]=\"calendar.currentMonth\"\n        ></teta-day-picker>\n      </div>\n    </div>\n    @if (getAvailableMonthYear(data.currentMonth+1,data.currentYear); as availableMonthYear) {\n    <div class=\"padding-h-3 padding-v-2\">\n      <div class=\"row align-center justify-content-between\">\n        <teta-button\n          [square]=\"true\"\n          [class]=\"'change-month-button datepicker-arrow_hidden datepicker_' + viewType\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n        <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n          <p>{{ getMothName(availableMonthYear.availableMonth) }}</p>\n          <button\n            [class]=\"'datepicker_' + viewType\"\n            teta-button\n            view=\"ghost\"\n            palette=\"text\"\n            (click)=\"selectPicker('year')\"\n          >\n            {{ availableMonthYear.availableYear }}\n          </button>\n        </div>\n        <teta-button\n          [square]=\"true\"\n          [ngClass]=\"{ 'datepicker-arrow_hidden': !isFirstDaySuitable(data.currentMonth + 2, data.currentYear, max) }\"\n          [class]=\"'change-month-button datepicker_' + viewType\"\n          (click)=\"changeMonth(data.currentMonth + 1, data.currentYear)\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n      </div>\n      <div>\n        <teta-day-picker\n          [(hoveredDate)]=\"hoveredDate\"\n          [range]=\"getFromTo()\"\n          [viewType]=\"viewType\"\n          (selectDate)=\"selectDate($event)\"\n          [locale]=\"locale\"\n          [calendar]=\"calendar.nextMonth\"\n        ></teta-day-picker>\n      </div>\n    </div>\n    }\n  </div>\n  } @if (data.selectedPicker==='month') {\n  <teta-month-picker\n    [localeMoths]=\"locale.months\"\n    [currentYear]=\"data.currentYear\"\n    (changeYear)=\"setYear($event)\"\n    [selectedMonth]=\"data.currentMonth\"\n    [viewType]=\"viewType\"\n    (selectMonth)=\"selectMonth($event)\"\n  ></teta-month-picker>\n  } @if (data.selectedPicker==='year') {\n  <teta-year-picker\n    [minMax]=\"data.minMax\"\n    [locale]=\"locale\"\n    [viewType]=\"viewType\"\n    (selectYear)=\"selectYear($event)\"\n    [selectedYear]=\"data.currentYear\"\n  ></teta-year-picker>\n  }\n</div>\n}\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DayPickerComponent, selector: "teta-day-picker", inputs: ["date", "calendar", "viewType", "range", "min", "max", "locale", "hoveredDate"], outputs: ["hoveredDateChange", "selectDate"] }, { kind: "component", type: MonthPickerComponent, selector: "teta-month-picker", inputs: ["selectedMonth", "viewType", "currentYear", "localeMoths"], outputs: ["selectMonth", "changeYear"] }, { kind: "component", type: YearPickerComponent, selector: "teta-year-picker", inputs: ["selectedYear", "viewType", "minMax", "locale"], outputs: ["selectYear"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: RangeCalendarComponent, decorators: [{
             type: Component,
@@ -2719,7 +2644,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         MonthPickerComponent,
                         YearPickerComponent,
                         AsyncPipe,
-                    ], template: "@if ({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async,minMax:minMax|async}; as data) {\n  <div\n    class=\"datepicker-content overflow-y-auto\"\n    >\n    @if (data.selectedPicker==='day') {\n      <div class=\"row \" (wheel)=\"scrollMonth($event,data.currentMonth,data.currentYear)\">\n        <div class=\"padding-h-3 padding-v-2\">\n          <div class=\"row align-center justify-content-between\">\n            <teta-button\n              [ngClass]=\"{'datepicker-arrow_hidden':!isLastDaySuitable(data.currentMonth-1,data.currentYear,min)}\"\n              [class]=\"'change-month-button datepicker_'+viewType\" [square]=\"true\"\n              (click)=\"changeMonth(data.currentMonth-1,data.currentYear)\"\n              palette=\"text\"\n              view=\"ghost\">\n              <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n            </teta-button>\n            <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n              <p> {{getMothName(data.currentMonth)}}</p>\n              <button [class]=\"'datepicker_'+viewType\" teta-button view=\"ghost\" palette=\"text\"\n              (click)=\"selectPicker('year')\">{{data.currentYear}}</button>\n            </div>\n            <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker-arrow_hidden datepicker_'+viewType\"\n              palette=\"text\"\n              view=\"ghost\">\n              <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n            </teta-button>\n          </div>\n          <div>\n            <teta-day-picker [(hoveredDate)]=\"hoveredDate\" [range]=\"getFromTo()\" [viewType]=\"viewType\"\n              (selectDate)=\"selectDate($event)\" [locale]=\"locale\"\n            [calendar]=\"calendar.currentMonth\"></teta-day-picker>\n          </div>\n        </div>\n        @if (getAvailableMonthYear(data.currentMonth+1,data.currentYear); as availableMonthYear) {\n          <div class=\"padding-h-3 padding-v-2\"\n            >\n            <div class=\"row align-center justify-content-between\">\n              <teta-button [square]=\"true\" [class]=\"'change-month-button datepicker-arrow_hidden datepicker_'+viewType\"\n                palette=\"text\"\n                view=\"ghost\">\n                <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n              </teta-button>\n              <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n                <p>{{getMothName(availableMonthYear.availableMonth)}}</p>\n                <button [class]=\"'datepicker_'+viewType\" teta-button view=\"ghost\" palette=\"text\"\n                (click)=\"selectPicker('year')\">{{availableMonthYear.availableYear}}</button>\n              </div>\n              <teta-button [square]=\"true\"\n                [ngClass]=\"{'datepicker-arrow_hidden': !isFirstDaySuitable(data.currentMonth+2,data.currentYear,max)}\"\n                [class]=\"'change-month-button datepicker_'+viewType\"\n                (click)=\"changeMonth(data.currentMonth+1,data.currentYear)\"\n                palette=\"text\"\n                view=\"ghost\">\n                <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n              </teta-button>\n            </div>\n            <div>\n              <teta-day-picker [(hoveredDate)]=\"hoveredDate\" [range]=\"getFromTo()\" [viewType]=\"viewType\"\n                (selectDate)=\"selectDate($event)\" [locale]=\"locale\"\n              [calendar]=\"calendar.nextMonth\"></teta-day-picker>\n            </div>\n          </div>\n        }\n      </div>\n    }\n    @if (data.selectedPicker==='month') {\n      <teta-month-picker [localeMoths]=\"locale.months\" [currentYear]=\"data.currentYear\" (changeYear)=\"setYear($event)\"\n        [selectedMonth]=\"data.currentMonth\" [viewType]=\"viewType\"\n      (selectMonth)=\"selectMonth($event)\"></teta-month-picker>\n    }\n    @if (data.selectedPicker==='year') {\n      <teta-year-picker [minMax]=\"data.minMax\" [locale]=\"locale\" [viewType]=\"viewType\" (selectYear)=\"selectYear($event)\"\n      [selectedYear]=\"data.currentYear\"></teta-year-picker>\n    }\n  </div>\n}\n\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"] }]
+                    ], template: "@if\n({currentMonth:currentMonth|async,currentYear:currentYear|async,selectedPicker:selectedPicker|async,minMax:minMax|async};\nas data) {\n<div class=\"datepicker-content overflow-y-auto\">\n  @if (data.selectedPicker==='day') {\n  <div class=\"row\" (wheel)=\"scrollMonth($event, data.currentMonth, data.currentYear)\">\n    <div class=\"padding-h-3 padding-v-2\">\n      <div class=\"row align-center justify-content-between\">\n        <teta-button\n          [ngClass]=\"{ 'datepicker-arrow_hidden': !isLastDaySuitable(data.currentMonth - 1, data.currentYear, min) }\"\n          [class]=\"'change-month-button datepicker_' + viewType\"\n          [square]=\"true\"\n          (click)=\"changeMonth(data.currentMonth - 1, data.currentYear)\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n        <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n          <p>{{ getMothName(data.currentMonth) }}</p>\n          <button\n            [class]=\"'datepicker_' + viewType\"\n            teta-button\n            view=\"ghost\"\n            palette=\"text\"\n            (click)=\"selectPicker('year')\"\n          >\n            {{ data.currentYear }}\n          </button>\n        </div>\n        <teta-button\n          [square]=\"true\"\n          [class]=\"'change-month-button datepicker-arrow_hidden datepicker_' + viewType\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n      </div>\n      <div>\n        <teta-day-picker\n          [(hoveredDate)]=\"hoveredDate\"\n          [range]=\"getFromTo()\"\n          [viewType]=\"viewType\"\n          (selectDate)=\"selectDate($event)\"\n          [locale]=\"locale\"\n          [calendar]=\"calendar.currentMonth\"\n        ></teta-day-picker>\n      </div>\n    </div>\n    @if (getAvailableMonthYear(data.currentMonth+1,data.currentYear); as availableMonthYear) {\n    <div class=\"padding-h-3 padding-v-2\">\n      <div class=\"row align-center justify-content-between\">\n        <teta-button\n          [square]=\"true\"\n          [class]=\"'change-month-button datepicker-arrow_hidden datepicker_' + viewType\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowLeftKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n        <div class=\"row gap-4 font-button-2 align-center padding-left-1\">\n          <p>{{ getMothName(availableMonthYear.availableMonth) }}</p>\n          <button\n            [class]=\"'datepicker_' + viewType\"\n            teta-button\n            view=\"ghost\"\n            palette=\"text\"\n            (click)=\"selectPicker('year')\"\n          >\n            {{ availableMonthYear.availableYear }}\n          </button>\n        </div>\n        <teta-button\n          [square]=\"true\"\n          [ngClass]=\"{ 'datepicker-arrow_hidden': !isFirstDaySuitable(data.currentMonth + 2, data.currentYear, max) }\"\n          [class]=\"'change-month-button datepicker_' + viewType\"\n          (click)=\"changeMonth(data.currentMonth + 1, data.currentYear)\"\n          palette=\"text\"\n          view=\"ghost\"\n        >\n          <teta-icon name=\"arrowRightKey\" [palette]=\"'text'\"></teta-icon>\n        </teta-button>\n      </div>\n      <div>\n        <teta-day-picker\n          [(hoveredDate)]=\"hoveredDate\"\n          [range]=\"getFromTo()\"\n          [viewType]=\"viewType\"\n          (selectDate)=\"selectDate($event)\"\n          [locale]=\"locale\"\n          [calendar]=\"calendar.nextMonth\"\n        ></teta-day-picker>\n      </div>\n    </div>\n    }\n  </div>\n  } @if (data.selectedPicker==='month') {\n  <teta-month-picker\n    [localeMoths]=\"locale.months\"\n    [currentYear]=\"data.currentYear\"\n    (changeYear)=\"setYear($event)\"\n    [selectedMonth]=\"data.currentMonth\"\n    [viewType]=\"viewType\"\n    (selectMonth)=\"selectMonth($event)\"\n  ></teta-month-picker>\n  } @if (data.selectedPicker==='year') {\n  <teta-year-picker\n    [minMax]=\"data.minMax\"\n    [locale]=\"locale\"\n    [viewType]=\"viewType\"\n    (selectYear)=\"selectYear($event)\"\n    [selectedYear]=\"data.currentYear\"\n  ></teta-year-picker>\n  }\n</div>\n}\n", styles: [".change-month-button{-webkit-user-select:none;user-select:none}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { locale: [{
                 type: Input
             }], open: [{
@@ -2790,21 +2715,13 @@ class DateRangeComponent extends BasePicker {
         if (this.allowNull) {
             return null;
         }
-        return (this.datePipe.transform(new Date(), 'dd.MM.yyyy') +
-            ' - ' +
-            this.datePipe.transform(new Date(), 'dd.MM.yyyy'));
+        return (this.datePipe.transform(new Date(), 'dd.MM.yyyy') + ' - ' + this.datePipe.transform(new Date(), 'dd.MM.yyyy'));
     }
     async prepareInput() {
         const config = await lastValueFrom(this.localeService.locale.pipe(take(1)));
-        let str = this.getLocaleString(this.date.from) +
-            ' - ' +
-            this.getLocaleString(this.date.to);
+        let str = this.getLocaleString(this.date.from) + ' - ' + this.getLocaleString(this.date.to);
         if (!this.date?.from) {
-            str = this.allowNull
-                ? ''
-                : this.getLocaleString(new Date()) +
-                    ' - ' +
-                    this.getLocaleString(new Date());
+            str = this.allowNull ? '' : this.getLocaleString(new Date()) + ' - ' + this.getLocaleString(new Date());
         }
         const option = {
             mode: 'dd/mm/yyyy',
@@ -2913,7 +2830,7 @@ class DateRangeComponent extends BasePicker {
     }
     onChange(date) { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateRangeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.DatePipe }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateRangeComponent, isStandalone: true, selector: "teta-date-range", inputs: { date: "date", showTime: "showTime", minDate: "minDate", maxDate: "maxDate", invalid: "invalid", disabled: "disabled", align: "align", verticalAlign: "verticalAlign", viewType: "viewType", appendToBody: "appendToBody", backdrop: "backdrop", allowNull: "allowNull" }, outputs: { selectDate: "selectDate" }, host: { properties: { "class.daterange": "this.classDaterange" } }, providers: [DATE_Range_CONTROL_VALUE_ACCESSOR, DatePipe], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if ({selectedDate:selectedDate|async};as data) {\n  <teta-dropdown [appendToBody]=\"appendToBody\" [backdrop]=\"backdrop\"\n    class='row row_auto'\n    [(open)]=\"open\" (openChange)=\"openChange($event)\" [viewType]=\"viewType\"\n    [disabled]=\"disabled\" [verticalAlign]=\"verticalAlign\" [align]=\"align\"\n    [autoCloseIgnore]=\"['esc', 'inside','enter']\">\n    <div tetaDropdownHead\n      [class]=\"'datepicker-head font-body-3 gap-8 datepicker_'+viewType\"\n      [ngClass]=\"{'datepicker-head_invalid':invalid,'datepicker-head_disabled':disabled}\">\n      <teta-input class=\"row row_auto flex\">\n        <div [class]=\"'row_auto row datepicker_'+viewType\">\n          <div class=\"row row_auto position-relative font-body-3 align-center\">\n            <input [ngClass]=\"{'color-text-90':!disabled}\" [disabled]=\"disabled\" #input style=\"z-index: 1\"\n              class=\"border-0 color-text-90\" (keydown)=\"checkEnter($event)\"\n              [(ngModel)]=\"inputText\" (ngModelChange)=\"changeInput($event)\"\n              [maskito]=\"maskitoOptions\">\n              @if (data.selectedDate||allowNull) {\n                <div (click)=\"input.focus()\" class=\"position-absolute color-text-10\"\n                style=\"cursor: text;user-select: none\">{{placeholder}}</div>\n              }\n            </div>\n            <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n          </div>\n        </teta-input>\n      </div>\n      <div tetaDropdownContent class=\"scrollable\" (click)=\"$event.preventDefault()\">\n        @if (open) {\n          <div class=\"row\">\n            <teta-range-calendar [isDateNull]=\"date===null||(date?.from===null&&date?.to===null)\" [open]=\"open\"\n              [max]=\"maxDate\"\n              [allowNull]=\"allowNull\"\n              [min]=\"minDate\"\n              (setDate)=\"changeSelectedDate($event,data.selectedDate)\"\n              [selectedDate]=\"data.selectedDate\"\n              [date]=\"date\"\n            [viewType]=\"viewType\" [locale]=\"locale|async\"></teta-range-calendar>\n          </div>\n        }\n      </div>\n    </teta-dropdown>\n  }\n", styles: [""], dependencies: [{ kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MaskitoModule }, { kind: "directive", type: i4.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "directive", type: i4.MaskitoCVA, selector: "input[maskito], textarea[maskito]", inputs: ["maskito"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "component", type: RangeCalendarComponent, selector: "teta-range-calendar", inputs: ["locale", "open", "date", "viewType", "allowNull", "selectedDate", "min", "isDateNull", "max"], outputs: ["hoveredDateChange", "setDate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateRangeComponent, isStandalone: true, selector: "teta-date-range", inputs: { date: "date", showTime: "showTime", minDate: "minDate", maxDate: "maxDate", invalid: "invalid", disabled: "disabled", align: "align", verticalAlign: "verticalAlign", viewType: "viewType", appendToBody: "appendToBody", backdrop: "backdrop", allowNull: "allowNull" }, outputs: { selectDate: "selectDate" }, host: { properties: { "class.daterange": "this.classDaterange" } }, providers: [DATE_Range_CONTROL_VALUE_ACCESSOR, DatePipe], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if ({selectedDate:selectedDate|async};as data) {\n<teta-dropdown\n  [appendToBody]=\"appendToBody\"\n  [backdrop]=\"backdrop\"\n  class=\"row row_auto\"\n  [(open)]=\"open\"\n  (openChange)=\"openChange($event)\"\n  [viewType]=\"viewType\"\n  [disabled]=\"disabled\"\n  [verticalAlign]=\"verticalAlign\"\n  [align]=\"align\"\n  [autoCloseIgnore]=\"['esc', 'inside', 'enter']\"\n>\n  <div\n    tetaDropdownHead\n    [class]=\"'datepicker-head font-body-3 gap-8 datepicker_' + viewType\"\n    [ngClass]=\"{ 'datepicker-head_invalid': invalid, 'datepicker-head_disabled': disabled }\"\n  >\n    <teta-input class=\"row row_auto flex\">\n      <div [class]=\"'row_auto row datepicker_' + viewType\">\n        <div class=\"row row_auto position-relative font-body-3 align-center\">\n          <input\n            [ngClass]=\"{ 'color-text-90': !disabled }\"\n            [disabled]=\"disabled\"\n            #input\n            style=\"z-index: 1\"\n            class=\"border-0 color-text-90\"\n            (keydown)=\"checkEnter($event)\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"changeInput($event)\"\n            [maskito]=\"maskitoOptions\"\n          />\n          @if (data.selectedDate||allowNull) {\n          <div (click)=\"input.focus()\" class=\"position-absolute color-text-10\" style=\"cursor: text; user-select: none\">\n            {{ placeholder }}\n          </div>\n          }\n        </div>\n        <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n      </div>\n    </teta-input>\n  </div>\n  <div tetaDropdownContent class=\"scrollable\" (click)=\"$event.preventDefault()\">\n    @if (open) {\n    <div class=\"row\">\n      <teta-range-calendar\n        [isDateNull]=\"date === null || (date?.from === null && date?.to === null)\"\n        [open]=\"open\"\n        [max]=\"maxDate\"\n        [allowNull]=\"allowNull\"\n        [min]=\"minDate\"\n        (setDate)=\"changeSelectedDate($event, data.selectedDate)\"\n        [selectedDate]=\"data.selectedDate\"\n        [date]=\"date\"\n        [viewType]=\"viewType\"\n        [locale]=\"locale | async\"\n      ></teta-range-calendar>\n    </div>\n    }\n  </div>\n</teta-dropdown>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MaskitoModule }, { kind: "directive", type: i4.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "directive", type: i4.MaskitoCVA, selector: "input[maskito], textarea[maskito]", inputs: ["maskito"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "component", type: RangeCalendarComponent, selector: "teta-range-calendar", inputs: ["locale", "open", "date", "viewType", "allowNull", "selectedDate", "min", "isDateNull", "max"], outputs: ["hoveredDateChange", "setDate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateRangeComponent, decorators: [{
             type: Component,
@@ -2928,7 +2845,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         DropdownContentDirective,
                         RangeCalendarComponent,
                         AsyncPipe,
-                    ], template: "@if ({selectedDate:selectedDate|async};as data) {\n  <teta-dropdown [appendToBody]=\"appendToBody\" [backdrop]=\"backdrop\"\n    class='row row_auto'\n    [(open)]=\"open\" (openChange)=\"openChange($event)\" [viewType]=\"viewType\"\n    [disabled]=\"disabled\" [verticalAlign]=\"verticalAlign\" [align]=\"align\"\n    [autoCloseIgnore]=\"['esc', 'inside','enter']\">\n    <div tetaDropdownHead\n      [class]=\"'datepicker-head font-body-3 gap-8 datepicker_'+viewType\"\n      [ngClass]=\"{'datepicker-head_invalid':invalid,'datepicker-head_disabled':disabled}\">\n      <teta-input class=\"row row_auto flex\">\n        <div [class]=\"'row_auto row datepicker_'+viewType\">\n          <div class=\"row row_auto position-relative font-body-3 align-center\">\n            <input [ngClass]=\"{'color-text-90':!disabled}\" [disabled]=\"disabled\" #input style=\"z-index: 1\"\n              class=\"border-0 color-text-90\" (keydown)=\"checkEnter($event)\"\n              [(ngModel)]=\"inputText\" (ngModelChange)=\"changeInput($event)\"\n              [maskito]=\"maskitoOptions\">\n              @if (data.selectedDate||allowNull) {\n                <div (click)=\"input.focus()\" class=\"position-absolute color-text-10\"\n                style=\"cursor: text;user-select: none\">{{placeholder}}</div>\n              }\n            </div>\n            <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n          </div>\n        </teta-input>\n      </div>\n      <div tetaDropdownContent class=\"scrollable\" (click)=\"$event.preventDefault()\">\n        @if (open) {\n          <div class=\"row\">\n            <teta-range-calendar [isDateNull]=\"date===null||(date?.from===null&&date?.to===null)\" [open]=\"open\"\n              [max]=\"maxDate\"\n              [allowNull]=\"allowNull\"\n              [min]=\"minDate\"\n              (setDate)=\"changeSelectedDate($event,data.selectedDate)\"\n              [selectedDate]=\"data.selectedDate\"\n              [date]=\"date\"\n            [viewType]=\"viewType\" [locale]=\"locale|async\"></teta-range-calendar>\n          </div>\n        }\n      </div>\n    </teta-dropdown>\n  }\n" }]
+                    ], template: "@if ({selectedDate:selectedDate|async};as data) {\n<teta-dropdown\n  [appendToBody]=\"appendToBody\"\n  [backdrop]=\"backdrop\"\n  class=\"row row_auto\"\n  [(open)]=\"open\"\n  (openChange)=\"openChange($event)\"\n  [viewType]=\"viewType\"\n  [disabled]=\"disabled\"\n  [verticalAlign]=\"verticalAlign\"\n  [align]=\"align\"\n  [autoCloseIgnore]=\"['esc', 'inside', 'enter']\"\n>\n  <div\n    tetaDropdownHead\n    [class]=\"'datepicker-head font-body-3 gap-8 datepicker_' + viewType\"\n    [ngClass]=\"{ 'datepicker-head_invalid': invalid, 'datepicker-head_disabled': disabled }\"\n  >\n    <teta-input class=\"row row_auto flex\">\n      <div [class]=\"'row_auto row datepicker_' + viewType\">\n        <div class=\"row row_auto position-relative font-body-3 align-center\">\n          <input\n            [ngClass]=\"{ 'color-text-90': !disabled }\"\n            [disabled]=\"disabled\"\n            #input\n            style=\"z-index: 1\"\n            class=\"border-0 color-text-90\"\n            (keydown)=\"checkEnter($event)\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"changeInput($event)\"\n            [maskito]=\"maskitoOptions\"\n          />\n          @if (data.selectedDate||allowNull) {\n          <div (click)=\"input.focus()\" class=\"position-absolute color-text-10\" style=\"cursor: text; user-select: none\">\n            {{ placeholder }}\n          </div>\n          }\n        </div>\n        <teta-icon [name]=\"'calendar'\" [palette]=\"'text'\"></teta-icon>\n      </div>\n    </teta-input>\n  </div>\n  <div tetaDropdownContent class=\"scrollable\" (click)=\"$event.preventDefault()\">\n    @if (open) {\n    <div class=\"row\">\n      <teta-range-calendar\n        [isDateNull]=\"date === null || (date?.from === null && date?.to === null)\"\n        [open]=\"open\"\n        [max]=\"maxDate\"\n        [allowNull]=\"allowNull\"\n        [min]=\"minDate\"\n        (setDate)=\"changeSelectedDate($event, data.selectedDate)\"\n        [selectedDate]=\"data.selectedDate\"\n        [date]=\"date\"\n        [viewType]=\"viewType\"\n        [locale]=\"locale | async\"\n      ></teta-range-calendar>\n    </div>\n    }\n  </div>\n</teta-dropdown>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.DatePipe }, { type: TetaConfigService }], propDecorators: { date: [{
                 type: Input
             }], showTime: [{
@@ -3047,8 +2964,7 @@ class DropdownDirective extends DropdownBase {
         this._zone = _zone;
         this._renderer = _renderer;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     ngOnDestroy() {
         this.closeDropdown();
         this.removeScrollListener();
@@ -3066,7 +2982,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaDropdown]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
@@ -3104,18 +3020,17 @@ class ExpandCardComponent {
         this.showCross = true;
         this.crossClick = new EventEmitter();
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     setOpen() {
         this.open = !this.open;
         this.openChange.emit(this.open);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ExpandCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ExpandCardComponent, isStandalone: true, selector: "teta-expand-card", inputs: { open: "open", showCross: "showCross" }, outputs: { openChange: "openChange", crossClick: "crossClick" }, exportAs: ["expand-card"], ngImport: i0, template: "<teta-toolbar class=\"justify-content-between align-center\">\n  <ng-content select=\"head\"></ng-content>\n  <div class=\"row gap align-center\">\n    <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n      <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n    </button>\n    @if (showCross) {\n      <teta-delimiter [palette]=\"'text'\" class='height-4'></teta-delimiter>\n      <button type=\"button\" teta-button (click)=\"crossClick.emit($event)\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n        <teta-icon [name]=\"'closeBig'\" [palette]=\"'text'\"></teta-icon>\n      </button>\n    }\n  </div>\n</teta-toolbar>\n@if (open) {\n  <div class=\"content\">\n    <ng-content></ng-content>\n  </div>\n}\n", styles: [":host{border:solid 1px var(--color-text-5);border-radius:4px;animation:append-animate .5s linear;transition:order 5s ease-in}.content{padding:0 12px 12px;animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DelimiterComponent, selector: "teta-delimiter", inputs: ["direction", "palette", "height", "verticalMargin", "horizontalMargin", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ExpandCardComponent, isStandalone: true, selector: "teta-expand-card", inputs: { open: "open", showCross: "showCross" }, outputs: { openChange: "openChange", crossClick: "crossClick" }, exportAs: ["expand-card"], ngImport: i0, template: "<teta-toolbar class=\"justify-content-between align-center\">\n  <ng-content select=\"head\"></ng-content>\n  <div class=\"row gap align-center\">\n    <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n      <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n    </button>\n    @if (showCross) {\n    <teta-delimiter [palette]=\"'text'\" class=\"height-4\"></teta-delimiter>\n    <button\n      type=\"button\"\n      teta-button\n      (click)=\"crossClick.emit($event)\"\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\"\n      [square]=\"true\"\n    >\n      <teta-icon [name]=\"'closeBig'\" [palette]=\"'text'\"></teta-icon>\n    </button>\n    }\n  </div>\n</teta-toolbar>\n@if (open) {\n<div class=\"content\">\n  <ng-content></ng-content>\n</div>\n}\n", styles: [":host{border:solid 1px var(--color-text-5);border-radius:4px;animation:append-animate .5s linear;transition:order 5s ease-in}.content{padding:0 12px 12px;animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DelimiterComponent, selector: "teta-delimiter", inputs: ["direction", "palette", "height", "verticalMargin", "horizontalMargin", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ExpandCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-expand-card', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'expand-card', standalone: true, imports: [ToolbarComponent, ButtonComponent, IconComponent, DelimiterComponent], template: "<teta-toolbar class=\"justify-content-between align-center\">\n  <ng-content select=\"head\"></ng-content>\n  <div class=\"row gap align-center\">\n    <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n      <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n    </button>\n    @if (showCross) {\n      <teta-delimiter [palette]=\"'text'\" class='height-4'></teta-delimiter>\n      <button type=\"button\" teta-button (click)=\"crossClick.emit($event)\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n        <teta-icon [name]=\"'closeBig'\" [palette]=\"'text'\"></teta-icon>\n      </button>\n    }\n  </div>\n</teta-toolbar>\n@if (open) {\n  <div class=\"content\">\n    <ng-content></ng-content>\n  </div>\n}\n", styles: [":host{border:solid 1px var(--color-text-5);border-radius:4px;animation:append-animate .5s linear;transition:order 5s ease-in}.content{padding:0 12px 12px;animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"] }]
+            args: [{ selector: 'teta-expand-card', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'expand-card', standalone: true, imports: [ToolbarComponent, ButtonComponent, IconComponent, DelimiterComponent], template: "<teta-toolbar class=\"justify-content-between align-center\">\n  <ng-content select=\"head\"></ng-content>\n  <div class=\"row gap align-center\">\n    <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n      <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n    </button>\n    @if (showCross) {\n    <teta-delimiter [palette]=\"'text'\" class=\"height-4\"></teta-delimiter>\n    <button\n      type=\"button\"\n      teta-button\n      (click)=\"crossClick.emit($event)\"\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\"\n      [square]=\"true\"\n    >\n      <teta-icon [name]=\"'closeBig'\" [palette]=\"'text'\"></teta-icon>\n    </button>\n    }\n  </div>\n</teta-toolbar>\n@if (open) {\n<div class=\"content\">\n  <ng-content></ng-content>\n</div>\n}\n", styles: [":host{border:solid 1px var(--color-text-5);border-radius:4px;animation:append-animate .5s linear;transition:order 5s ease-in}.content{padding:0 12px 12px;animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { open: [{
                 type: Input
             }], openChange: [{
@@ -3136,11 +3051,11 @@ class ExpandItemComponent {
         this.openChange.emit(this.open);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ExpandItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ExpandItemComponent, isStandalone: true, selector: "teta-expand-item", inputs: { open: "open" }, outputs: { openChange: "openChange" }, exportAs: ["expand-item"], ngImport: i0, template: "<div class=\"row align-center gap color-text-90 height-6\">\n  <div class=\"row row_auto align-center font-title-2\">\n    <ng-content select=\"head\"></ng-content>\n  </div>\n  <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n    <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n  </button>\n</div>\n@if (open) {\n  <div class=\"content\">\n    <ng-content></ng-content>\n  </div>\n}\n", styles: [":host{animation:append-animate .5s linear;transition:order 5s ease-in;display:flex;flex-direction:column;gap:12px}.content{animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ExpandItemComponent, isStandalone: true, selector: "teta-expand-item", inputs: { open: "open" }, outputs: { openChange: "openChange" }, exportAs: ["expand-item"], ngImport: i0, template: "<div class=\"row align-center gap color-text-90 height-6\">\n  <div class=\"row row_auto align-center font-title-2\">\n    <ng-content select=\"head\"></ng-content>\n  </div>\n  <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n    <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n  </button>\n</div>\n@if (open) {\n<div class=\"content\">\n  <ng-content></ng-content>\n</div>\n}\n", styles: [":host{animation:append-animate .5s linear;transition:order 5s ease-in;display:flex;flex-direction:column;gap:12px}.content{animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ExpandItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-expand-item', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'expand-item', standalone: true, imports: [ButtonComponent, IconComponent], template: "<div class=\"row align-center gap color-text-90 height-6\">\n  <div class=\"row row_auto align-center font-title-2\">\n    <ng-content select=\"head\"></ng-content>\n  </div>\n  <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n    <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n  </button>\n</div>\n@if (open) {\n  <div class=\"content\">\n    <ng-content></ng-content>\n  </div>\n}\n", styles: [":host{animation:append-animate .5s linear;transition:order 5s ease-in;display:flex;flex-direction:column;gap:12px}.content{animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"] }]
+            args: [{ selector: 'teta-expand-item', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'expand-item', standalone: true, imports: [ButtonComponent, IconComponent], template: "<div class=\"row align-center gap color-text-90 height-6\">\n  <div class=\"row row_auto align-center font-title-2\">\n    <ng-content select=\"head\"></ng-content>\n  </div>\n  <button type=\"button\" teta-button (click)=\"setOpen()\" [palette]=\"'text'\" [view]=\"'ghost'\" [square]=\"true\">\n    <teta-icon [name]=\"open ? 'arrowUpKey' : 'arrowDownKey'\" [palette]=\"'text'\"></teta-icon>\n  </button>\n</div>\n@if (open) {\n<div class=\"content\">\n  <ng-content></ng-content>\n</div>\n}\n", styles: [":host{animation:append-animate .5s linear;transition:order 5s ease-in;display:flex;flex-direction:column;gap:12px}.content{animation:append-animate .5s linear}@keyframes append-animate{0%{opacity:0}to{opacity:1}}\n"] }]
         }], propDecorators: { open: [{
                 type: Input
             }], openChange: [{
@@ -3211,16 +3126,11 @@ class ExpandPanelComponent {
         this.openChange.emit(this.open);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ExpandPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ExpandPanelComponent, isStandalone: true, selector: "teta-expand-panel", inputs: { placeholder: "placeholder", open: "open", cookieName: "cookieName", direction: "direction" }, outputs: { openChange: "openChange" }, queries: [{ propertyName: "content", first: true, predicate: ExpandPanelContentDirective, descendants: true }, { propertyName: "head", first: true, predicate: ExpandPanelHeadDirective, descendants: true }], ngImport: i0, template: "@if (open) {\n  <teta-toolbar\n    style='display: flex'\n    [style.justifyContent]=\"direction === 'right' ? 'space-between' : 'unset'\"\n    [style.flexDirection]=\"direction === 'right' ? 'row-reverse' : 'row'\">\n    <button\n      teta-button\n      [square]='true'\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\"\n      (click)='closePanel()'\n      >\n      <teta-icon [palette]=\"'text'\" [name]=\"direction === 'right' ? 'start' : 'end'\"></teta-icon>\n    </button>\n    <span class='font-title-2' style='display: contents'>\n      <ng-container *ngTemplateOutlet='head?.template'></ng-container>\n    </span>\n  </teta-toolbar>\n  <ng-container *ngTemplateOutlet='content?.template'></ng-container>\n}\n@if (!open) {\n  <div class='width-10 overflow-hidden' style='height: 100%;'>\n    <button\n      teta-button\n      style='\n        transform-origin: 0 0;\n        transform: rotate(-90deg) translateX(-100%);\n        margin: 6px;\n      '\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\"\n      (click)='openPanel()'\n      >\n      <div class='font-button-2 nowrap'>{{ placeholder }}</div>\n      <teta-icon style='transform-origin: 0 0;transform: rotate(-90deg) translateX(-100%);'\n      [palette]=\"'text'\" [name]=\"direction === 'right' ? 'start' : 'end'\"></teta-icon>\n    </button>\n  </div>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:0;flex-shrink:0;min-width:0;min-height:0;height:100%}\n"], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ExpandPanelComponent, isStandalone: true, selector: "teta-expand-panel", inputs: { placeholder: "placeholder", open: "open", cookieName: "cookieName", direction: "direction" }, outputs: { openChange: "openChange" }, queries: [{ propertyName: "content", first: true, predicate: ExpandPanelContentDirective, descendants: true }, { propertyName: "head", first: true, predicate: ExpandPanelHeadDirective, descendants: true }], ngImport: i0, template: "@if (open) {\n<teta-toolbar\n  style=\"display: flex\"\n  [style.justifyContent]=\"direction === 'right' ? 'space-between' : 'unset'\"\n  [style.flexDirection]=\"direction === 'right' ? 'row-reverse' : 'row'\"\n>\n  <button teta-button [square]=\"true\" [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"closePanel()\">\n    <teta-icon [palette]=\"'text'\" [name]=\"direction === 'right' ? 'start' : 'end'\"></teta-icon>\n  </button>\n  <span class=\"font-title-2\" style=\"display: contents\">\n    <ng-container *ngTemplateOutlet=\"head?.template\"></ng-container>\n  </span>\n</teta-toolbar>\n<ng-container *ngTemplateOutlet=\"content?.template\"></ng-container>\n} @if (!open) {\n<div class=\"width-10 overflow-hidden\" style=\"height: 100%\">\n  <button\n    teta-button\n    style=\"transform-origin: 0 0; transform: rotate(-90deg) translateX(-100%); margin: 6px\"\n    [palette]=\"'text'\"\n    [view]=\"'ghost'\"\n    (click)=\"openPanel()\"\n  >\n    <div class=\"font-button-2 nowrap\">{{ placeholder }}</div>\n    <teta-icon\n      style=\"transform-origin: 0 0; transform: rotate(-90deg) translateX(-100%)\"\n      [palette]=\"'text'\"\n      [name]=\"direction === 'right' ? 'start' : 'end'\"\n    ></teta-icon>\n  </button>\n</div>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:0;flex-shrink:0;min-width:0;min-height:0;height:100%}\n"], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ExpandPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-expand-panel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        ToolbarComponent,
-                        ButtonComponent,
-                        IconComponent,
-                        NgTemplateOutlet,
-                    ], template: "@if (open) {\n  <teta-toolbar\n    style='display: flex'\n    [style.justifyContent]=\"direction === 'right' ? 'space-between' : 'unset'\"\n    [style.flexDirection]=\"direction === 'right' ? 'row-reverse' : 'row'\">\n    <button\n      teta-button\n      [square]='true'\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\"\n      (click)='closePanel()'\n      >\n      <teta-icon [palette]=\"'text'\" [name]=\"direction === 'right' ? 'start' : 'end'\"></teta-icon>\n    </button>\n    <span class='font-title-2' style='display: contents'>\n      <ng-container *ngTemplateOutlet='head?.template'></ng-container>\n    </span>\n  </teta-toolbar>\n  <ng-container *ngTemplateOutlet='content?.template'></ng-container>\n}\n@if (!open) {\n  <div class='width-10 overflow-hidden' style='height: 100%;'>\n    <button\n      teta-button\n      style='\n        transform-origin: 0 0;\n        transform: rotate(-90deg) translateX(-100%);\n        margin: 6px;\n      '\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\"\n      (click)='openPanel()'\n      >\n      <div class='font-button-2 nowrap'>{{ placeholder }}</div>\n      <teta-icon style='transform-origin: 0 0;transform: rotate(-90deg) translateX(-100%);'\n      [palette]=\"'text'\" [name]=\"direction === 'right' ? 'start' : 'end'\"></teta-icon>\n    </button>\n  </div>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:0;flex-shrink:0;min-width:0;min-height:0;height:100%}\n"] }]
+            args: [{ selector: 'teta-expand-panel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ToolbarComponent, ButtonComponent, IconComponent, NgTemplateOutlet], template: "@if (open) {\n<teta-toolbar\n  style=\"display: flex\"\n  [style.justifyContent]=\"direction === 'right' ? 'space-between' : 'unset'\"\n  [style.flexDirection]=\"direction === 'right' ? 'row-reverse' : 'row'\"\n>\n  <button teta-button [square]=\"true\" [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"closePanel()\">\n    <teta-icon [palette]=\"'text'\" [name]=\"direction === 'right' ? 'start' : 'end'\"></teta-icon>\n  </button>\n  <span class=\"font-title-2\" style=\"display: contents\">\n    <ng-container *ngTemplateOutlet=\"head?.template\"></ng-container>\n  </span>\n</teta-toolbar>\n<ng-container *ngTemplateOutlet=\"content?.template\"></ng-container>\n} @if (!open) {\n<div class=\"width-10 overflow-hidden\" style=\"height: 100%\">\n  <button\n    teta-button\n    style=\"transform-origin: 0 0; transform: rotate(-90deg) translateX(-100%); margin: 6px\"\n    [palette]=\"'text'\"\n    [view]=\"'ghost'\"\n    (click)=\"openPanel()\"\n  >\n    <div class=\"font-button-2 nowrap\">{{ placeholder }}</div>\n    <teta-icon\n      style=\"transform-origin: 0 0; transform: rotate(-90deg) translateX(-100%)\"\n      [palette]=\"'text'\"\n      [name]=\"direction === 'right' ? 'start' : 'end'\"\n    ></teta-icon>\n  </button>\n</div>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:0;flex-shrink:0;min-width:0;min-height:0;height:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { content: [{
                 type: ContentChild,
                 args: [ExpandPanelContentDirective, { static: false }]
@@ -3280,16 +3190,11 @@ class FileUploadAreaComponent {
         event.stopPropagation();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: FileUploadAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: FileUploadAreaComponent, isStandalone: true, selector: "teta-file-upload-area", inputs: { multiple: "multiple", disabled: "disabled", accept: "accept" }, outputs: { upload: "upload" }, host: { listeners: { "dragenter": "dragEnter($event)", "dragover": "dragOver($event)", "dragleave": "dragLeave($event)", "drop": "drop($event)" }, properties: { "class.file-upload": "this.fileUpload", "class.file-upload_active": "this.fileUploadActive" } }, queries: [{ propertyName: "buttonTemplate", first: true, predicate: ["buttonTemplate"], descendants: true }], viewQueries: [{ propertyName: "input", first: true, predicate: ["fileUpload"], descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n<label class=\"file-upload-label\">\n  <input #fileUpload\n         id=\"upload-input\"\n         class=\"file-upload-input\"\n         type=\"file\"\n         name=\"fileUpload\"\n         [attr.accept]=\"accept\"\n         [attr.multiple]=\"multiple ? 'multiple' : null\"\n         [disabled]=\"disabled\"\n         (change)=\"fileChanged($event)\"/>\n  <ng-container\n    [ngTemplateOutlet]=\"buttonTemplate || defaultTemplate\"\n  ></ng-container>\n</label>\n<ng-template #defaultTemplate>\n  <teta-button [palette]=\"'primary'\" type=\"button\">\n    <teta-icon [name]=\"'search'\" [palette]=\"'white'\"></teta-icon>\n    {{'common.browse' | transloco}}\n  </teta-button>\n</ng-template>\n", styles: [":host{display:flex}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$2.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: FileUploadAreaComponent, isStandalone: true, selector: "teta-file-upload-area", inputs: { multiple: "multiple", disabled: "disabled", accept: "accept" }, outputs: { upload: "upload" }, host: { listeners: { "dragenter": "dragEnter($event)", "dragover": "dragOver($event)", "dragleave": "dragLeave($event)", "drop": "drop($event)" }, properties: { "class.file-upload": "this.fileUpload", "class.file-upload_active": "this.fileUploadActive" } }, queries: [{ propertyName: "buttonTemplate", first: true, predicate: ["buttonTemplate"], descendants: true }], viewQueries: [{ propertyName: "input", first: true, predicate: ["fileUpload"], descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n<label class=\"file-upload-label\">\n  <input\n    #fileUpload\n    id=\"upload-input\"\n    class=\"file-upload-input\"\n    type=\"file\"\n    name=\"fileUpload\"\n    [attr.accept]=\"accept\"\n    [attr.multiple]=\"multiple ? 'multiple' : null\"\n    [disabled]=\"disabled\"\n    (change)=\"fileChanged($event)\"\n  />\n  <ng-container [ngTemplateOutlet]=\"buttonTemplate || defaultTemplate\"></ng-container>\n</label>\n<ng-template #defaultTemplate>\n  <teta-button [palette]=\"'primary'\" type=\"button\">\n    <teta-icon [name]=\"'search'\" [palette]=\"'white'\"></teta-icon>\n    {{ 'common.browse' | transloco }}\n  </teta-button>\n</ng-template>\n", styles: [":host{display:flex}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$2.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: FileUploadAreaComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-file-upload-area', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        NgTemplateOutlet,
-                        ButtonComponent,
-                        IconComponent,
-                        TranslocoModule,
-                    ], template: "<ng-content></ng-content>\n<label class=\"file-upload-label\">\n  <input #fileUpload\n         id=\"upload-input\"\n         class=\"file-upload-input\"\n         type=\"file\"\n         name=\"fileUpload\"\n         [attr.accept]=\"accept\"\n         [attr.multiple]=\"multiple ? 'multiple' : null\"\n         [disabled]=\"disabled\"\n         (change)=\"fileChanged($event)\"/>\n  <ng-container\n    [ngTemplateOutlet]=\"buttonTemplate || defaultTemplate\"\n  ></ng-container>\n</label>\n<ng-template #defaultTemplate>\n  <teta-button [palette]=\"'primary'\" type=\"button\">\n    <teta-icon [name]=\"'search'\" [palette]=\"'white'\"></teta-icon>\n    {{'common.browse' | transloco}}\n  </teta-button>\n</ng-template>\n", styles: [":host{display:flex}\n"] }]
+            args: [{ selector: 'teta-file-upload-area', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgTemplateOutlet, ButtonComponent, IconComponent, TranslocoModule], template: "<ng-content></ng-content>\n<label class=\"file-upload-label\">\n  <input\n    #fileUpload\n    id=\"upload-input\"\n    class=\"file-upload-input\"\n    type=\"file\"\n    name=\"fileUpload\"\n    [attr.accept]=\"accept\"\n    [attr.multiple]=\"multiple ? 'multiple' : null\"\n    [disabled]=\"disabled\"\n    (change)=\"fileChanged($event)\"\n  />\n  <ng-container [ngTemplateOutlet]=\"buttonTemplate || defaultTemplate\"></ng-container>\n</label>\n<ng-template #defaultTemplate>\n  <teta-button [palette]=\"'primary'\" type=\"button\">\n    <teta-icon [name]=\"'search'\" [palette]=\"'white'\"></teta-icon>\n    {{ 'common.browse' | transloco }}\n  </teta-button>\n</ng-template>\n", styles: [":host{display:flex}\n"] }]
         }], propDecorators: { fileUpload: [{
                 type: HostBinding,
                 args: ['class.file-upload']
@@ -3338,8 +3243,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class DateFilterValue {
     constructor(options) {
         if (options) {
-            this.lessThan = (typeof options.lessThan === 'string') ? new Date(options.lessThan) : options.lessThan;
-            this.greaterThan = (typeof options.greaterThan === 'string') ? new Date(options.greaterThan) : options.greaterThan;
+            this.lessThan = typeof options.lessThan === 'string' ? new Date(options.lessThan) : options.lessThan;
+            this.greaterThan = typeof options.greaterThan === 'string' ? new Date(options.greaterThan) : options.greaterThan;
         }
     }
 }
@@ -3348,11 +3253,9 @@ class StringUtil {
     static firstLetterToLower(input) {
         return input.charAt(0).toLocaleLowerCase() + input.slice(1);
     }
-    ;
     static firstLetterToUpper(input) {
         return input.charAt(0).toLocaleUpperCase() + input.slice(1);
     }
-    ;
 }
 class FilterBase {
@@ -3623,7 +3526,7 @@ class FilterItem {
         this.listFilterType = options?.listFilterType ?? ListFilterType.None;
         this.strict = options?.strict ?? false;
         this.filterComponent = options?.filterComponent;
-        this.columns = options?.columns?.map(_ => new FilterItem(_)) ?? [];
+        this.columns = options?.columns?.map((_) => new FilterItem(_)) ?? [];
     }
 }
@@ -3660,16 +3563,11 @@ class DateFilterComponent extends FilterComponentBase {
         return filter;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateFilterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateFilterComponent, isStandalone: true, selector: "teta-date-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "@if (locale | async; as loc) {\n  <div class=\"form-row padding-3\">\n    <teta-input [label]=\"loc.from\">\n      <teta-date-picker style=\"width: 110px\"\n        [ngModel]=\"filter.value?.greaterThan\"\n        [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.greaterThan=$event\"></teta-date-picker>\n    </teta-input>\n    <teta-input [label]=\"loc.to\">\n      <teta-date-picker style=\"width: 110px\"\n        [ngModel]=\"filter.value?.lessThan\"\n        [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.lessThan=$event\"></teta-date-picker>\n    </teta-input>\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateFilterComponent, isStandalone: true, selector: "teta-date-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "@if (locale | async; as loc) {\n<div class=\"form-row padding-3\">\n  <teta-input [label]=\"loc.from\">\n    <teta-date-picker\n      style=\"width: 110px\"\n      [ngModel]=\"filter.value?.greaterThan\"\n      [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.greaterThan = $event\"\n    ></teta-date-picker>\n  </teta-input>\n  <teta-input [label]=\"loc.to\">\n    <teta-date-picker\n      style=\"width: 110px\"\n      [ngModel]=\"filter.value?.lessThan\"\n      [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.lessThan = $event\"\n    ></teta-date-picker>\n  </teta-input>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-date-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        InputComponent,
-                        DatePickerComponent,
-                        FormsModule,
-                        AsyncPipe,
-                    ], template: "@if (locale | async; as loc) {\n  <div class=\"form-row padding-3\">\n    <teta-input [label]=\"loc.from\">\n      <teta-date-picker style=\"width: 110px\"\n        [ngModel]=\"filter.value?.greaterThan\"\n        [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.greaterThan=$event\"></teta-date-picker>\n    </teta-input>\n    <teta-input [label]=\"loc.to\">\n      <teta-date-picker style=\"width: 110px\"\n        [ngModel]=\"filter.value?.lessThan\"\n        [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.lessThan=$event\"></teta-date-picker>\n    </teta-input>\n  </div>\n}\n" }]
+            args: [{ selector: 'teta-date-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [InputComponent, DatePickerComponent, FormsModule, AsyncPipe], template: "@if (locale | async; as loc) {\n<div class=\"form-row padding-3\">\n  <teta-input [label]=\"loc.from\">\n    <teta-date-picker\n      style=\"width: 110px\"\n      [ngModel]=\"filter.value?.greaterThan\"\n      [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.greaterThan = $event\"\n    ></teta-date-picker>\n  </teta-input>\n  <teta-input [label]=\"loc.to\">\n    <teta-date-picker\n      style=\"width: 110px\"\n      [ngModel]=\"filter.value?.lessThan\"\n      [appendToBody]=\"false\"\n      (ngModelChange)=\"filter.value.lessThan = $event\"\n    ></teta-date-picker>\n  </teta-input>\n</div>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: TetaConfigService }], propDecorators: { column: [{
                 type: Input
             }], data: [{
@@ -3714,7 +3612,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaLet]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ViewContainerRef, decorators: [{
                     type: Inject,
@@ -3773,10 +3671,8 @@ class ScrollableComponent {
         }
         fromEvent(this._container.nativeElement, 'scroll')
             .pipe(takeWhile(() => this._alive), tap$1((event) => {
-            this._scrollbarHorizontal.nativeElement.scrollLeft =
-                event.target.scrollLeft;
-            this._scrollbarVertical.nativeElement.scrollTop =
-                event.target.scrollTop;
+            this._scrollbarHorizontal.nativeElement.scrollLeft = event.target.scrollLeft;
+            this._scrollbarVertical.nativeElement.scrollTop = event.target.scrollTop;
             this.scroll.emit(event);
         }))
             .subscribe();
@@ -3791,16 +3687,11 @@ class ScrollableComponent {
         this._observe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ScrollableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ScrollableComponent, isStandalone: true, selector: "teta-scrollable", inputs: { direction: "direction", showScrollbars: "showScrollbars", contentClass: "contentClass" }, outputs: { scroll: "scroll" }, host: { properties: { "class.show-scrollbars": "this.showScrollbars" } }, queries: [{ propertyName: "_scrollDirective", first: true, predicate: ScrollableDirective, descendants: true, read: ElementRef, static: true }], viewQueries: [{ propertyName: "_scrollableWrapper", first: true, predicate: ["scrollableWrapper"], descendants: true, static: true }, { propertyName: "_scrollbarVertical", first: true, predicate: ["scrollbarVertical"], descendants: true, static: true }, { propertyName: "_scrollbarHorizontal", first: true, predicate: ["scrollbarHorizontal"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"scroll-controls\" *tetaLet='scrollSize | async as scrollSize'>\n  <div #scrollbarVertical\n       [class.display-none]=\"scrollSize?.scrollHeight <= scrollSize?.clientHeight\"\n       class=\"scroll-scrollbar scroll-scrollbar-vertical\"\n       (scroll)=\"scrollVertical($event)\">\n    <div [style.height.px]=\"scrollSize?.scrollHeight\" style=\"width: 1px;\"></div>\n  </div>\n  <div #scrollbarHorizontal\n       [class.display-none]=\"scrollSize?.scrollWidth <= scrollSize?.clientWidth\"\n       class=\"scroll-scrollbar scroll-scrollbar-horizontal\"\n       (scroll)=\"scrollHorizontal($event)\">\n    <div [style.width.px]=\"scrollSize?.scrollWidth\" style=\"height: 1px;\"></div>\n  </div>\n</div>\n\n<div #scrollableWrapper class=\"scroll-content-wrapper\"\n     [ngClass]=\"contentClass\"\n     [class.column]=\"direction === 'column'\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{overflow:hidden;position:relative;z-index:0;display:flex}:host:hover .scroll-controls{opacity:1}:host.show-scrollbars .scroll-controls{opacity:1}:host::-webkit-scrollbar{width:0;height:0}.scroll-content-wrapper{display:flex;overflow:auto;flex-grow:1}.scroll-content-wrapper::-webkit-scrollbar{width:0;height:0}.scroll-content{position:relative;z-index:0;flex:1;display:flex;height:auto;min-width:0}.scroll-controls{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .5s linear}.scroll-scrollbar{position:absolute;overflow:auto;pointer-events:auto}.scroll-scrollbar-vertical{right:0;top:0;bottom:12px;width:12px}.scroll-scrollbar-horizontal{right:12px;left:0;bottom:0;height:12px}\n"], dependencies: [{ kind: "directive", type: LetDirective, selector: "[tetaLet]", inputs: ["tetaLet"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ScrollableComponent, isStandalone: true, selector: "teta-scrollable", inputs: { direction: "direction", showScrollbars: "showScrollbars", contentClass: "contentClass" }, outputs: { scroll: "scroll" }, host: { properties: { "class.show-scrollbars": "this.showScrollbars" } }, queries: [{ propertyName: "_scrollDirective", first: true, predicate: ScrollableDirective, descendants: true, read: ElementRef, static: true }], viewQueries: [{ propertyName: "_scrollableWrapper", first: true, predicate: ["scrollableWrapper"], descendants: true, static: true }, { propertyName: "_scrollbarVertical", first: true, predicate: ["scrollbarVertical"], descendants: true, static: true }, { propertyName: "_scrollbarHorizontal", first: true, predicate: ["scrollbarHorizontal"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"scroll-controls\" *tetaLet=\"scrollSize | async as scrollSize\">\n  <div\n    #scrollbarVertical\n    [class.display-none]=\"scrollSize?.scrollHeight <= scrollSize?.clientHeight\"\n    class=\"scroll-scrollbar scroll-scrollbar-vertical\"\n    (scroll)=\"scrollVertical($event)\"\n  >\n    <div [style.height.px]=\"scrollSize?.scrollHeight\" style=\"width: 1px\"></div>\n  </div>\n  <div\n    #scrollbarHorizontal\n    [class.display-none]=\"scrollSize?.scrollWidth <= scrollSize?.clientWidth\"\n    class=\"scroll-scrollbar scroll-scrollbar-horizontal\"\n    (scroll)=\"scrollHorizontal($event)\"\n  >\n    <div [style.width.px]=\"scrollSize?.scrollWidth\" style=\"height: 1px\"></div>\n  </div>\n</div>\n\n<div #scrollableWrapper class=\"scroll-content-wrapper\" [ngClass]=\"contentClass\" [class.column]=\"direction === 'column'\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{overflow:hidden;position:relative;z-index:0;display:flex}:host:hover .scroll-controls{opacity:1}:host.show-scrollbars .scroll-controls{opacity:1}:host::-webkit-scrollbar{width:0;height:0}.scroll-content-wrapper{display:flex;overflow:auto;flex-grow:1}.scroll-content-wrapper::-webkit-scrollbar{width:0;height:0}.scroll-content{position:relative;z-index:0;flex:1;display:flex;height:auto;min-width:0}.scroll-controls{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .5s linear}.scroll-scrollbar{position:absolute;overflow:auto;pointer-events:auto}.scroll-scrollbar-vertical{right:0;top:0;bottom:12px;width:12px}.scroll-scrollbar-horizontal{right:12px;left:0;bottom:0;height:12px}\n"], dependencies: [{ kind: "directive", type: LetDirective, selector: "[tetaLet]", inputs: ["tetaLet"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ScrollableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-scrollable', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        LetDirective,
-                        NgClass,
-                        AsyncPipe,
-                        ScrollableDirective
-                    ], template: "<div class=\"scroll-controls\" *tetaLet='scrollSize | async as scrollSize'>\n  <div #scrollbarVertical\n       [class.display-none]=\"scrollSize?.scrollHeight <= scrollSize?.clientHeight\"\n       class=\"scroll-scrollbar scroll-scrollbar-vertical\"\n       (scroll)=\"scrollVertical($event)\">\n    <div [style.height.px]=\"scrollSize?.scrollHeight\" style=\"width: 1px;\"></div>\n  </div>\n  <div #scrollbarHorizontal\n       [class.display-none]=\"scrollSize?.scrollWidth <= scrollSize?.clientWidth\"\n       class=\"scroll-scrollbar scroll-scrollbar-horizontal\"\n       (scroll)=\"scrollHorizontal($event)\">\n    <div [style.width.px]=\"scrollSize?.scrollWidth\" style=\"height: 1px;\"></div>\n  </div>\n</div>\n\n<div #scrollableWrapper class=\"scroll-content-wrapper\"\n     [ngClass]=\"contentClass\"\n     [class.column]=\"direction === 'column'\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{overflow:hidden;position:relative;z-index:0;display:flex}:host:hover .scroll-controls{opacity:1}:host.show-scrollbars .scroll-controls{opacity:1}:host::-webkit-scrollbar{width:0;height:0}.scroll-content-wrapper{display:flex;overflow:auto;flex-grow:1}.scroll-content-wrapper::-webkit-scrollbar{width:0;height:0}.scroll-content{position:relative;z-index:0;flex:1;display:flex;height:auto;min-width:0}.scroll-controls{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .5s linear}.scroll-scrollbar{position:absolute;overflow:auto;pointer-events:auto}.scroll-scrollbar-vertical{right:0;top:0;bottom:12px;width:12px}.scroll-scrollbar-horizontal{right:12px;left:0;bottom:0;height:12px}\n"] }]
+            args: [{ selector: 'teta-scrollable', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [LetDirective, NgClass, AsyncPipe, ScrollableDirective], template: "<div class=\"scroll-controls\" *tetaLet=\"scrollSize | async as scrollSize\">\n  <div\n    #scrollbarVertical\n    [class.display-none]=\"scrollSize?.scrollHeight <= scrollSize?.clientHeight\"\n    class=\"scroll-scrollbar scroll-scrollbar-vertical\"\n    (scroll)=\"scrollVertical($event)\"\n  >\n    <div [style.height.px]=\"scrollSize?.scrollHeight\" style=\"width: 1px\"></div>\n  </div>\n  <div\n    #scrollbarHorizontal\n    [class.display-none]=\"scrollSize?.scrollWidth <= scrollSize?.clientWidth\"\n    class=\"scroll-scrollbar scroll-scrollbar-horizontal\"\n    (scroll)=\"scrollHorizontal($event)\"\n  >\n    <div [style.width.px]=\"scrollSize?.scrollWidth\" style=\"height: 1px\"></div>\n  </div>\n</div>\n\n<div #scrollableWrapper class=\"scroll-content-wrapper\" [ngClass]=\"contentClass\" [class.column]=\"direction === 'column'\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{overflow:hidden;position:relative;z-index:0;display:flex}:host:hover .scroll-controls{opacity:1}:host.show-scrollbars .scroll-controls{opacity:1}:host::-webkit-scrollbar{width:0;height:0}.scroll-content-wrapper{display:flex;overflow:auto;flex-grow:1}.scroll-content-wrapper::-webkit-scrollbar{width:0;height:0}.scroll-content{position:relative;z-index:0;flex:1;display:flex;height:auto;min-width:0}.scroll-controls{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .5s linear}.scroll-scrollbar{position:absolute;overflow:auto;pointer-events:auto}.scroll-scrollbar-vertical{right:0;top:0;bottom:12px;width:12px}.scroll-scrollbar-horizontal{right:12px;left:0;bottom:0;height:12px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { _scrollDirective: [{
                 type: ContentChild,
                 args: [ScrollableDirective, {
@@ -3881,7 +3772,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Pipe,
             args: [{
                     name: 'tetaNumber',
-                    standalone: true
+                    standalone: true,
                 }]
         }] });
@@ -4111,7 +4002,7 @@ class TextFieldComponent {
                 useExisting: forwardRef(() => TextFieldComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (leftIconName) {\n  <teta-icon [name]='leftIconName' [palette]=\"'text'\"></teta-icon>\n}\n<input\n  #input\n  [ngModel]='value | tetaNumber : !onlyNumber ? null : inputFocused ? 1000 : decimalPart'\n  [tetaOnlyNumber]='onlyNumber'\n  (ngModelChange)='value = $event; onChange($event);'\n  [placeholder]='placeholder'\n  [disabled]='disabled'\n  [ngClass]=\"{'color-text-40':disabled}\"\n  (focus)='inputFocused = true'\n  (blur)='inputFocused = false;emitBlur()'\n  (keydown)='keyPress($event)'\n  type='text'\n  />\n  @if (value && !disabled) {\n    <teta-icon\n      class='close-icon'\n      [name]=\"'closeCircle'\"\n      [palette]=\"'text'\"\n      (click)=\"value = ''; onChange('');\"\n    ></teta-icon>\n  }\n", styles: [""], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[tetaOnlyNumber]", inputs: ["tetaOnlyNumber", "allowDecimals", "allowSign", "decimalSeparator", "commaSeparator", "onlyPositive"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: NumberPipe, name: "tetaNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (leftIconName) {\n<teta-icon [name]=\"leftIconName\" [palette]=\"'text'\"></teta-icon>\n}\n<input\n  #input\n  [ngModel]=\"value | tetaNumber : (!onlyNumber ? null : inputFocused ? 1000 : decimalPart)\"\n  [tetaOnlyNumber]=\"onlyNumber\"\n  (ngModelChange)=\"value = $event; onChange($event)\"\n  [placeholder]=\"placeholder\"\n  [disabled]=\"disabled\"\n  [ngClass]=\"{ 'color-text-40': disabled }\"\n  (focus)=\"inputFocused = true\"\n  (blur)=\"inputFocused = false; emitBlur()\"\n  (keydown)=\"keyPress($event)\"\n  type=\"text\"\n/>\n@if (value && !disabled) {\n<teta-icon class=\"close-icon\" [name]=\"'closeCircle'\" [palette]=\"'text'\" (click)=\"value = ''; onChange('')\"></teta-icon>\n}\n", styles: [""], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[tetaOnlyNumber]", inputs: ["tetaOnlyNumber", "allowDecimals", "allowSign", "decimalSeparator", "commaSeparator", "onlyPositive"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: NumberPipe, name: "tetaNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TextFieldComponent, decorators: [{
             type: Component,
@@ -4121,13 +4012,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                             useExisting: forwardRef(() => TextFieldComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        IconComponent,
-                        FormsModule,
-                        OnlyNumberDirective,
-                        NgClass,
-                        NumberPipe,
-                    ], template: "@if (leftIconName) {\n  <teta-icon [name]='leftIconName' [palette]=\"'text'\"></teta-icon>\n}\n<input\n  #input\n  [ngModel]='value | tetaNumber : !onlyNumber ? null : inputFocused ? 1000 : decimalPart'\n  [tetaOnlyNumber]='onlyNumber'\n  (ngModelChange)='value = $event; onChange($event);'\n  [placeholder]='placeholder'\n  [disabled]='disabled'\n  [ngClass]=\"{'color-text-40':disabled}\"\n  (focus)='inputFocused = true'\n  (blur)='inputFocused = false;emitBlur()'\n  (keydown)='keyPress($event)'\n  type='text'\n  />\n  @if (value && !disabled) {\n    <teta-icon\n      class='close-icon'\n      [name]=\"'closeCircle'\"\n      [palette]=\"'text'\"\n      (click)=\"value = ''; onChange('');\"\n    ></teta-icon>\n  }\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent, FormsModule, OnlyNumberDirective, NgClass, NumberPipe], template: "@if (leftIconName) {\n<teta-icon [name]=\"leftIconName\" [palette]=\"'text'\"></teta-icon>\n}\n<input\n  #input\n  [ngModel]=\"value | tetaNumber : (!onlyNumber ? null : inputFocused ? 1000 : decimalPart)\"\n  [tetaOnlyNumber]=\"onlyNumber\"\n  (ngModelChange)=\"value = $event; onChange($event)\"\n  [placeholder]=\"placeholder\"\n  [disabled]=\"disabled\"\n  [ngClass]=\"{ 'color-text-40': disabled }\"\n  (focus)=\"inputFocused = true\"\n  (blur)=\"inputFocused = false; emitBlur()\"\n  (keydown)=\"keyPress($event)\"\n  type=\"text\"\n/>\n@if (value && !disabled) {\n<teta-icon class=\"close-icon\" [name]=\"'closeCircle'\" [palette]=\"'text'\" (click)=\"value = ''; onChange('')\"></teta-icon>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { placeholder: [{
                 type: Input
             }], leftIconName: [{
@@ -4180,8 +4065,7 @@ class ListFilterComponent extends FilterComponentBase {
         this.search = '';
         this.locale = this._config.locale;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     all() {
         if (!this.filter?.value || this.filter?.value?.length === 0) {
             return false;
@@ -4202,9 +4086,7 @@ class ListFilterComponent extends FilterComponentBase {
     }
     setType() {
         this.excluded = !this.excluded;
-        this.filter.type = this.excluded
-            ? ListFilterType.Excluded
-            : ListFilterType.None;
+        this.filter.type = this.excluded ? ListFilterType.Excluded : ListFilterType.None;
     }
     setFilter(value) {
         this.filter.value = value;
@@ -4224,17 +4106,11 @@ class ListFilterComponent extends FilterComponentBase {
         return filter;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ListFilterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ListFilterComponent, isStandalone: true, selector: "teta-list-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "<div class=\"padding-2\">\n  <teta-text-field [(ngModel)]=\"search\"></teta-text-field>\n</div>\n<teta-scrollable class=\"column column_auto\" [contentClass]=\"['list', 'padding-v-2']\">\n  <div class=\"list-item\">\n    <teta-checkbox [binary]=\"true\"\n      [allowNull]=\"true\"\n      [ngModel]=\"all()\"\n      (ngModelChange)=\"setAll($event)\">\n      {{(locale | async)?.all}}\n    </teta-checkbox>\n  </div>\n  <div class=\"list-divider\"></div>\n  @for (option of visibleOptions; track option) {\n    <div class=\"list-item\">\n      <teta-checkbox [ngModel]=\"filter.value\"\n        (ngModelChange)=\"setFilter($event)\"\n        [value]=\"option.id\"\n        [binary]=\"false\">\n        {{option.name}}\n      </teta-checkbox>\n    </div>\n  }\n</teta-scrollable>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0;min-width:0}\n"], dependencies: [{ kind: "component", type: TextFieldComponent, selector: "teta-text-field", inputs: ["placeholder", "leftIconName", "disabled", "onlyNumber", "decimalPart", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ListFilterComponent, isStandalone: true, selector: "teta-list-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "<div class=\"padding-2\">\n  <teta-text-field [(ngModel)]=\"search\"></teta-text-field>\n</div>\n<teta-scrollable class=\"column column_auto\" [contentClass]=\"['list', 'padding-v-2']\">\n  <div class=\"list-item\">\n    <teta-checkbox [binary]=\"true\" [allowNull]=\"true\" [ngModel]=\"all()\" (ngModelChange)=\"setAll($event)\">\n      {{ (locale | async)?.all }}\n    </teta-checkbox>\n  </div>\n  <div class=\"list-divider\"></div>\n  @for (option of visibleOptions; track option) {\n  <div class=\"list-item\">\n    <teta-checkbox [ngModel]=\"filter.value\" (ngModelChange)=\"setFilter($event)\" [value]=\"option.id\" [binary]=\"false\">\n      {{ option.name }}\n    </teta-checkbox>\n  </div>\n  }\n</teta-scrollable>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0;min-width:0}\n"], dependencies: [{ kind: "component", type: TextFieldComponent, selector: "teta-text-field", inputs: ["placeholder", "leftIconName", "disabled", "onlyNumber", "decimalPart", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ListFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-list-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        TextFieldComponent,
-                        FormsModule,
-                        ScrollableComponent,
-                        CheckboxComponent,
-                        AsyncPipe,
-                    ], template: "<div class=\"padding-2\">\n  <teta-text-field [(ngModel)]=\"search\"></teta-text-field>\n</div>\n<teta-scrollable class=\"column column_auto\" [contentClass]=\"['list', 'padding-v-2']\">\n  <div class=\"list-item\">\n    <teta-checkbox [binary]=\"true\"\n      [allowNull]=\"true\"\n      [ngModel]=\"all()\"\n      (ngModelChange)=\"setAll($event)\">\n      {{(locale | async)?.all}}\n    </teta-checkbox>\n  </div>\n  <div class=\"list-divider\"></div>\n  @for (option of visibleOptions; track option) {\n    <div class=\"list-item\">\n      <teta-checkbox [ngModel]=\"filter.value\"\n        (ngModelChange)=\"setFilter($event)\"\n        [value]=\"option.id\"\n        [binary]=\"false\">\n        {{option.name}}\n      </teta-checkbox>\n    </div>\n  }\n</teta-scrollable>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0;min-width:0}\n"] }]
+            args: [{ selector: 'teta-list-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [TextFieldComponent, FormsModule, ScrollableComponent, CheckboxComponent, AsyncPipe], template: "<div class=\"padding-2\">\n  <teta-text-field [(ngModel)]=\"search\"></teta-text-field>\n</div>\n<teta-scrollable class=\"column column_auto\" [contentClass]=\"['list', 'padding-v-2']\">\n  <div class=\"list-item\">\n    <teta-checkbox [binary]=\"true\" [allowNull]=\"true\" [ngModel]=\"all()\" (ngModelChange)=\"setAll($event)\">\n      {{ (locale | async)?.all }}\n    </teta-checkbox>\n  </div>\n  <div class=\"list-divider\"></div>\n  @for (option of visibleOptions; track option) {\n  <div class=\"list-item\">\n    <teta-checkbox [ngModel]=\"filter.value\" (ngModelChange)=\"setFilter($event)\" [value]=\"option.id\" [binary]=\"false\">\n      {{ option.name }}\n    </teta-checkbox>\n  </div>\n  }\n</teta-scrollable>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0;min-width:0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: TetaConfigService }], propDecorators: { column: [{
                 type: Input
             }], data: [{
@@ -4280,16 +4156,11 @@ class NumericFilterComponent extends FilterComponentBase {
         return filter;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: NumericFilterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: NumericFilterComponent, isStandalone: true, selector: "teta-numeric-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "@if (locale | async; as loc) {\n  <div class=\"form-row padding-3\">\n    <teta-input [label]=\"loc.from\">\n      <input class=\"input\" type=\"text\"\n        style=\"width: 110px\"\n        [tetaOnlyNumber]=\"true\"\n        [ngModel]=\"filter.value?.greaterThan\"\n        (ngModelChange)=\"filter.value.greaterThan=$event\"/>\n      </teta-input>\n      <teta-input [label]=\"loc.to\">\n        <input class=\"input\" type=\"text\"\n          style=\"width: 110px\"\n          [tetaOnlyNumber]=\"true\"\n          [ngModel]=\"filter.value?.lessThan\"\n          (ngModelChange)=\"filter.value.lessThan=$event\"/>\n        </teta-input>\n      </div>\n    }\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[tetaOnlyNumber]", inputs: ["tetaOnlyNumber", "allowDecimals", "allowSign", "decimalSeparator", "commaSeparator", "onlyPositive"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: NumericFilterComponent, isStandalone: true, selector: "teta-numeric-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "@if (locale | async; as loc) {\n<div class=\"form-row padding-3\">\n  <teta-input [label]=\"loc.from\">\n    <input\n      class=\"input\"\n      type=\"text\"\n      style=\"width: 110px\"\n      [tetaOnlyNumber]=\"true\"\n      [ngModel]=\"filter.value?.greaterThan\"\n      (ngModelChange)=\"filter.value.greaterThan = $event\"\n    />\n  </teta-input>\n  <teta-input [label]=\"loc.to\">\n    <input\n      class=\"input\"\n      type=\"text\"\n      style=\"width: 110px\"\n      [tetaOnlyNumber]=\"true\"\n      [ngModel]=\"filter.value?.lessThan\"\n      (ngModelChange)=\"filter.value.lessThan = $event\"\n    />\n  </teta-input>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[tetaOnlyNumber]", inputs: ["tetaOnlyNumber", "allowDecimals", "allowSign", "decimalSeparator", "commaSeparator", "onlyPositive"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: NumericFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-numeric-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        InputComponent,
-                        FormsModule,
-                        OnlyNumberDirective,
-                        AsyncPipe,
-                    ], template: "@if (locale | async; as loc) {\n  <div class=\"form-row padding-3\">\n    <teta-input [label]=\"loc.from\">\n      <input class=\"input\" type=\"text\"\n        style=\"width: 110px\"\n        [tetaOnlyNumber]=\"true\"\n        [ngModel]=\"filter.value?.greaterThan\"\n        (ngModelChange)=\"filter.value.greaterThan=$event\"/>\n      </teta-input>\n      <teta-input [label]=\"loc.to\">\n        <input class=\"input\" type=\"text\"\n          style=\"width: 110px\"\n          [tetaOnlyNumber]=\"true\"\n          [ngModel]=\"filter.value?.lessThan\"\n          (ngModelChange)=\"filter.value.lessThan=$event\"/>\n        </teta-input>\n      </div>\n    }\n" }]
+            args: [{ selector: 'teta-numeric-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [InputComponent, FormsModule, OnlyNumberDirective, AsyncPipe], template: "@if (locale | async; as loc) {\n<div class=\"form-row padding-3\">\n  <teta-input [label]=\"loc.from\">\n    <input\n      class=\"input\"\n      type=\"text\"\n      style=\"width: 110px\"\n      [tetaOnlyNumber]=\"true\"\n      [ngModel]=\"filter.value?.greaterThan\"\n      (ngModelChange)=\"filter.value.greaterThan = $event\"\n    />\n  </teta-input>\n  <teta-input [label]=\"loc.to\">\n    <input\n      class=\"input\"\n      type=\"text\"\n      style=\"width: 110px\"\n      [tetaOnlyNumber]=\"true\"\n      [ngModel]=\"filter.value?.lessThan\"\n      (ngModelChange)=\"filter.value.lessThan = $event\"\n    />\n  </teta-input>\n</div>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: TetaConfigService }], propDecorators: { column: [{
                 type: Input
             }], data: [{
@@ -4319,8 +4190,7 @@ class StringFilterComponent extends FilterComponentBase {
         this.filterChanged = new EventEmitter();
         this.locale = this._config.locale;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     setFilter() {
         this.filterChanged.emit(this.filter);
     }
@@ -4338,15 +4208,11 @@ class StringFilterComponent extends FilterComponentBase {
         return filter;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: StringFilterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: StringFilterComponent, isStandalone: true, selector: "teta-string-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "<div class=\"padding-3\">\n  <teta-input [label]=\"(locale | async)?.search\">\n    <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" (keydown.enter)=\"setFilter()\" />\n  </teta-input>\n</div>\n\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: StringFilterComponent, isStandalone: true, selector: "teta-string-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "<div class=\"padding-3\">\n  <teta-input [label]=\"(locale | async)?.search\">\n    <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" (keydown.enter)=\"setFilter()\" />\n  </teta-input>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: StringFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-string-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        InputComponent,
-                        FormsModule,
-                        AsyncPipe,
-                    ], template: "<div class=\"padding-3\">\n  <teta-input [label]=\"(locale | async)?.search\">\n    <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" (keydown.enter)=\"setFilter()\" />\n  </teta-input>\n</div>\n\n" }]
+            args: [{ selector: 'teta-string-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [InputComponent, FormsModule, AsyncPipe], template: "<div class=\"padding-3\">\n  <teta-input [label]=\"(locale | async)?.search\">\n    <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" (keydown.enter)=\"setFilter()\" />\n  </teta-input>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: TetaConfigService }], propDecorators: { column: [{
                 type: Input
             }], data: [{
@@ -4362,7 +4228,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class RadioComponent {
     set disabled(val) {
         this.disabled$ = val;
-        this.buttons$.forEach(b => (b.disabled = this.disabled));
+        this.buttons$.forEach((b) => (b.disabled = this.disabled));
     }
     get disabled() {
         return this.disabled$;
@@ -4473,7 +4339,7 @@ class RadioComponent {
         if (this.checkedButton$) {
             this.checkedButton$.checked = false;
         }
-        this.checkedButton$ = this.buttons$.find(b => b.value === obj);
+        this.checkedButton$ = this.buttons$.find((b) => b.value === obj);
         if (this.checkedButton$) {
             this.checkedButton$.checked = true;
         }
@@ -4508,9 +4374,7 @@ class RadioComponent {
             return;
         }
         const length = this.buttons$.length;
-        let newIndex = this.selectedButton$
-            ? this.buttons$.indexOf(this.selectedButton$)
-            : 0;
+        let newIndex = this.selectedButton$ ? this.buttons$.indexOf(this.selectedButton$) : 0;
         let firstCycle = true;
         do {
             newIndex++;
@@ -4529,9 +4393,7 @@ class RadioComponent {
         if (this.selectFirst()) {
             return;
         }
-        let newIndex = this.selectedButton$
-            ? this.buttons$.indexOf(this.selectedButton$)
-            : 0;
+        let newIndex = this.selectedButton$ ? this.buttons$.indexOf(this.selectedButton$) : 0;
         let firstCycle = true;
         do {
             newIndex--;
@@ -4561,7 +4423,7 @@ class RadioComponent {
                 useExisting: forwardRef(() => RadioComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "<ng-content></ng-content>", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: RadioComponent, decorators: [{
             type: Component,
@@ -4571,7 +4433,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                             useExisting: forwardRef(() => RadioComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<ng-content></ng-content>" }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<ng-content></ng-content>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { tabindex: [{
                 type: HostBinding,
                 args: ['tabindex']
@@ -4629,11 +4491,11 @@ class RadioButtonComponent {
         this.radio._removeButton(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: RadioButtonComponent, deps: [{ token: i0.ViewContainerRef }, { token: RadioComponent, host: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: RadioButtonComponent, isStandalone: true, selector: "teta-radio-button", inputs: { checked: "checked", disabled: "disabled", value: "value" }, host: { listeners: { "click": "hostClick()" }, properties: { "class.radio-button": "this.radioButton", "class.radio-button-selected": "this.selected", "class.radio-button-checked": "this.checked", "class.radio-button_disabled": "this.disabled" } }, ngImport: i0, template: "<div class=\"radio-button-icon\">\n  @if (checked) {\n    <div class=\"radio-button-small-icon\"></div>\n  }\n</div>\n<ng-content></ng-content>\n", styles: [""], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: RadioButtonComponent, isStandalone: true, selector: "teta-radio-button", inputs: { checked: "checked", disabled: "disabled", value: "value" }, host: { listeners: { "click": "hostClick()" }, properties: { "class.radio-button": "this.radioButton", "class.radio-button-selected": "this.selected", "class.radio-button-checked": "this.checked", "class.radio-button_disabled": "this.disabled" } }, ngImport: i0, template: "<div class=\"radio-button-icon\">\n  @if (checked) {\n  <div class=\"radio-button-small-icon\"></div>\n  }\n</div>\n<ng-content></ng-content>\n", styles: [""], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: RadioButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-radio-button', encapsulation: ViewEncapsulation.None, standalone: true, template: "<div class=\"radio-button-icon\">\n  @if (checked) {\n    <div class=\"radio-button-small-icon\"></div>\n  }\n</div>\n<ng-content></ng-content>\n" }]
+            args: [{ selector: 'teta-radio-button', encapsulation: ViewEncapsulation.None, standalone: true, template: "<div class=\"radio-button-icon\">\n  @if (checked) {\n  <div class=\"radio-button-small-icon\"></div>\n  }\n</div>\n<ng-content></ng-content>\n" }]
         }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: RadioComponent, decorators: [{
                     type: Host
                 }] }], propDecorators: { radioButton: [{
@@ -4676,8 +4538,7 @@ class BooleanFilterComponent extends FilterComponentBase {
         this.filterChanged = new EventEmitter();
         this.locale = this._config.locale;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     setFilter() {
         this.filterChanged.emit(this.filter);
     }
@@ -4693,16 +4554,11 @@ class BooleanFilterComponent extends FilterComponentBase {
         return filter;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: BooleanFilterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: BooleanFilterComponent, isStandalone: true, selector: "teta-boolean-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "@if (locale | async; as loc) {\n  <div class=\"padding-3\">\n    <teta-radio [ngModel]=\"filter.value\" (ngModelChange)=\"setFilter()\">\n      <teta-radio-button [value]=\"null\">{{loc?.notSelected}}</teta-radio-button>\n      <teta-radio-button [value]=\"true\">{{loc?.yes}}</teta-radio-button>\n      <teta-radio-button [value]=\"false\">{{loc?.no}}</teta-radio-button>\n    </teta-radio>\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "component", type: RadioComponent, selector: "teta-radio", inputs: ["inline", "checkChangeSelected", "disabled", "value"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: RadioButtonComponent, selector: "teta-radio-button", inputs: ["checked", "disabled", "value"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: BooleanFilterComponent, isStandalone: true, selector: "teta-boolean-filter", inputs: { column: "column", data: "data", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "@if (locale | async; as loc) {\n<div class=\"padding-3\">\n  <teta-radio [ngModel]=\"filter.value\" (ngModelChange)=\"setFilter()\">\n    <teta-radio-button [value]=\"null\">{{ loc?.notSelected }}</teta-radio-button>\n    <teta-radio-button [value]=\"true\">{{ loc?.yes }}</teta-radio-button>\n    <teta-radio-button [value]=\"false\">{{ loc?.no }}</teta-radio-button>\n  </teta-radio>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "component", type: RadioComponent, selector: "teta-radio", inputs: ["inline", "checkChangeSelected", "disabled", "value"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: RadioButtonComponent, selector: "teta-radio-button", inputs: ["checked", "disabled", "value"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: BooleanFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-boolean-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        RadioComponent,
-                        FormsModule,
-                        RadioButtonComponent,
-                        AsyncPipe,
-                    ], template: "@if (locale | async; as loc) {\n  <div class=\"padding-3\">\n    <teta-radio [ngModel]=\"filter.value\" (ngModelChange)=\"setFilter()\">\n      <teta-radio-button [value]=\"null\">{{loc?.notSelected}}</teta-radio-button>\n      <teta-radio-button [value]=\"true\">{{loc?.yes}}</teta-radio-button>\n      <teta-radio-button [value]=\"false\">{{loc?.no}}</teta-radio-button>\n    </teta-radio>\n  </div>\n}\n" }]
+            args: [{ selector: 'teta-boolean-filter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [RadioComponent, FormsModule, RadioButtonComponent, AsyncPipe], template: "@if (locale | async; as loc) {\n<div class=\"padding-3\">\n  <teta-radio [ngModel]=\"filter.value\" (ngModelChange)=\"setFilter()\">\n    <teta-radio-button [value]=\"null\">{{ loc?.notSelected }}</teta-radio-button>\n    <teta-radio-button [value]=\"true\">{{ loc?.yes }}</teta-radio-button>\n    <teta-radio-button [value]=\"false\">{{ loc?.no }}</teta-radio-button>\n  </teta-radio>\n</div>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: TetaConfigService }], propDecorators: { column: [{
                 type: Input
             }], data: [{
@@ -4732,9 +4588,7 @@ const filterComponentsMap = new Map()
     .set(FilterType.string, StringFilterComponent)
     .set(FilterType.boolean, BooleanFilterComponent)
     .set(FilterType.custom, StringFilterComponent);
-const getFilterComponent = (item) => filterComponentsMap.has(item.filterType)
-    ? filterComponentsMap.get(item.filterType)
-    : StringFilterComponent;
+const getFilterComponent = (item) => filterComponentsMap.has(item.filterType) ? filterComponentsMap.get(item.filterType) : StringFilterComponent;
 class FilterHostComponent {
     set column(val) {
@@ -4774,8 +4628,7 @@ class FilterHostComponent {
         if (!FilterComponentBase.isPrototypeOf(this._column.filterComponent)) {
             this._column.filterComponent = getFilterComponent(this._column);
         }
-        this._componentRef =
-            this.viewContainerRef.createComponent(this._column.filterComponent);
+        this._componentRef = this.viewContainerRef.createComponent(this._column.filterComponent);
         this._componentRef.instance.column = this._column;
         this._componentRef.instance.state = this._state;
         this._componentRef.instance.data = this._data;
@@ -4815,8 +4668,7 @@ class IconFileComponent {
         return result.join(' ');
     }
     constructor() { }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     getName() {
         return `#${this.name}`;
     }
@@ -4881,7 +4733,7 @@ class ColorInputComponent {
                 useExisting: forwardRef(() => ColorInputComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<input type='color'\n       #input\n       [disabled]='disabled'\n       (blur)='emitBlur();'\n       [ngModel]=\"getHexColor(value)\"\n       (ngModelChange)=\"value = $event;onChange($event)\"\n       [ngModelOptions]='{updateOn: \"blur\"}'/>\n", styles: [":host{display:inline-flex;align-items:center}input[type=color]{height:12px;width:12px;padding:0;border:0}input[type=color]::-webkit-color-swatch,input[type=color]::-webkit-color-swatch-wrapper{border:0;padding:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<input\n  type=\"color\"\n  #input\n  [disabled]=\"disabled\"\n  (blur)=\"emitBlur()\"\n  [ngModel]=\"getHexColor(value)\"\n  (ngModelChange)=\"value = $event; onChange($event)\"\n  [ngModelOptions]=\"{ updateOn: 'blur' }\"\n/>\n", styles: [":host{display:inline-flex;align-items:center}input[type=color]{height:12px;width:12px;padding:0;border:0}input[type=color]::-webkit-color-swatch,input[type=color]::-webkit-color-swatch-wrapper{border:0;padding:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ColorInputComponent, decorators: [{
             type: Component,
@@ -4891,7 +4743,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                             useExisting: forwardRef(() => ColorInputComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FormsModule], template: "<input type='color'\n       #input\n       [disabled]='disabled'\n       (blur)='emitBlur();'\n       [ngModel]=\"getHexColor(value)\"\n       (ngModelChange)=\"value = $event;onChange($event)\"\n       [ngModelOptions]='{updateOn: \"blur\"}'/>\n", styles: [":host{display:inline-flex;align-items:center}input[type=color]{height:12px;width:12px;padding:0;border:0}input[type=color]::-webkit-color-swatch,input[type=color]::-webkit-color-swatch-wrapper{border:0;padding:0}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FormsModule], template: "<input\n  type=\"color\"\n  #input\n  [disabled]=\"disabled\"\n  (blur)=\"emitBlur()\"\n  [ngModel]=\"getHexColor(value)\"\n  (ngModelChange)=\"value = $event; onChange($event)\"\n  [ngModelOptions]=\"{ updateOn: 'blur' }\"\n/>\n", styles: [":host{display:inline-flex;align-items:center}input[type=color]{height:12px;width:12px;padding:0;border:0}input[type=color]::-webkit-color-swatch,input[type=color]::-webkit-color-swatch-wrapper{border:0;padding:0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { disabled: [{
                 type: Input
             }], input: [{
@@ -4946,13 +4798,13 @@ class MessageService {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MessageService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: 'root',
                 }]
         }], ctorParameters: () => [] });
 class Message {
     constructor(options) {
-        this.viewType = "rounded";
+        this.viewType = 'rounded';
         this.duration = 10000;
         this.palette = 'primary';
         if (options) {
@@ -5019,15 +4871,11 @@ class MessageComponent {
         this.reset();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MessageComponent, isStandalone: true, selector: "teta-message", inputs: { message: "message", index: "index", class: "class" }, outputs: { closed: "closed" }, host: { listeners: { "mouseleave": "init()", "mouseenter": "reset()" }, properties: { "class": "this.getClass" } }, ngImport: i0, template: "<div class=\"row align-center justify-content-between\">\n  <div class=\"font-title-2 padding-left-4\">\n    {{message.title}}\n  </div>\n  <button teta-button\n    type=\"button\"\n    [square]=\"true\"\n    [view]=\"'ghost'\"\n    (click)=\"closeMe($event)\">\n    <teta-icon class=\"fill-text-90\" [name]=\"'closeBig'\"></teta-icon>\n  </button>\n</div>\n@if (!message.template && message.text) {\n  <div class=\"font-body-3 padding-v-2 padding-left-4\">\n    {{message.text}}\n  </div>\n}\n@if (message.template) {\n  <ng-container *ngTemplateOutlet=\"message.template; context: {$implicit: message}\"></ng-container>\n}\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MessageComponent, isStandalone: true, selector: "teta-message", inputs: { message: "message", index: "index", class: "class" }, outputs: { closed: "closed" }, host: { listeners: { "mouseleave": "init()", "mouseenter": "reset()" }, properties: { "class": "this.getClass" } }, ngImport: i0, template: "<div class=\"row align-center justify-content-between\">\n  <div class=\"font-title-2 padding-left-4\">\n    {{ message.title }}\n  </div>\n  <button teta-button type=\"button\" [square]=\"true\" [view]=\"'ghost'\" (click)=\"closeMe($event)\">\n    <teta-icon class=\"fill-text-90\" [name]=\"'closeBig'\"></teta-icon>\n  </button>\n</div>\n@if (!message.template && message.text) {\n<div class=\"font-body-3 padding-v-2 padding-left-4\">\n  {{ message.text }}\n</div>\n} @if (message.template) {\n<ng-container *ngTemplateOutlet=\"message.template; context: { $implicit: message }\"></ng-container>\n}\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MessageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-message', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        ButtonComponent,
-                        IconComponent,
-                        NgTemplateOutlet,
-                    ], template: "<div class=\"row align-center justify-content-between\">\n  <div class=\"font-title-2 padding-left-4\">\n    {{message.title}}\n  </div>\n  <button teta-button\n    type=\"button\"\n    [square]=\"true\"\n    [view]=\"'ghost'\"\n    (click)=\"closeMe($event)\">\n    <teta-icon class=\"fill-text-90\" [name]=\"'closeBig'\"></teta-icon>\n  </button>\n</div>\n@if (!message.template && message.text) {\n  <div class=\"font-body-3 padding-v-2 padding-left-4\">\n    {{message.text}}\n  </div>\n}\n@if (message.template) {\n  <ng-container *ngTemplateOutlet=\"message.template; context: {$implicit: message}\"></ng-container>\n}\n" }]
+            args: [{ selector: 'teta-message', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ButtonComponent, IconComponent, NgTemplateOutlet], template: "<div class=\"row align-center justify-content-between\">\n  <div class=\"font-title-2 padding-left-4\">\n    {{ message.title }}\n  </div>\n  <button teta-button type=\"button\" [square]=\"true\" [view]=\"'ghost'\" (click)=\"closeMe($event)\">\n    <teta-icon class=\"fill-text-90\" [name]=\"'closeBig'\"></teta-icon>\n  </button>\n</div>\n@if (!message.template && message.text) {\n<div class=\"font-body-3 padding-v-2 padding-left-4\">\n  {{ message.text }}\n</div>\n} @if (message.template) {\n<ng-container *ngTemplateOutlet=\"message.template; context: { $implicit: message }\"></ng-container>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { message: [{
                 type: Input
             }], index: [{
@@ -5076,9 +4924,7 @@ class MessageHostComponent {
         this._alive = true;
     }
     ngOnInit() {
-        this._svc.message
-            .pipe(takeWhile((_) => this._alive))
-            .subscribe((messages) => {
+        this._svc.message.pipe(takeWhile((_) => this._alive)).subscribe((messages) => {
             if (messages) {
                 if (!this.messages) {
                     this.messages = [];
@@ -5087,9 +4933,7 @@ class MessageHostComponent {
             }
             this._cdr.markForCheck();
         });
-        this._svc.clear
-            .pipe(takeWhile((_) => this._alive))
-            .subscribe((x) => {
+        this._svc.clear.pipe(takeWhile((_) => this._alive)).subscribe((x) => {
             if (!x) {
                 this.messages = [];
             }
@@ -5109,11 +4953,11 @@ class MessageHostComponent {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MessageHostComponent, deps: [{ token: MessageService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MessageHostComponent, isStandalone: true, selector: "teta-message-host", inputs: { class: "class", align: "align", verticalAlign: "verticalAlign" }, outputs: { itemClose: "itemClose" }, host: { properties: { "class": "this.getClass" } }, ngImport: i0, template: "@for (message of messages; track message; let i = $index) {\n  <teta-message\n    (closed)=\"closedItem($event)\"\n    [message]=\"message\"\n    [index]=\"i\">\n  </teta-message>\n}\n", styles: [""], dependencies: [{ kind: "component", type: MessageComponent, selector: "teta-message", inputs: ["message", "index", "class"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MessageHostComponent, isStandalone: true, selector: "teta-message-host", inputs: { class: "class", align: "align", verticalAlign: "verticalAlign" }, outputs: { itemClose: "itemClose" }, host: { properties: { "class": "this.getClass" } }, ngImport: i0, template: "@for (message of messages; track message; let i = $index) {\n<teta-message (closed)=\"closedItem($event)\" [message]=\"message\" [index]=\"i\"> </teta-message>\n}\n", styles: [""], dependencies: [{ kind: "component", type: MessageComponent, selector: "teta-message", inputs: ["message", "index", "class"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MessageHostComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-message-host', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MessageComponent], template: "@for (message of messages; track message; let i = $index) {\n  <teta-message\n    (closed)=\"closedItem($event)\"\n    [message]=\"message\"\n    [index]=\"i\">\n  </teta-message>\n}\n" }]
+            args: [{ selector: 'teta-message-host', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MessageComponent], template: "@for (message of messages; track message; let i = $index) {\n<teta-message (closed)=\"closedItem($event)\" [message]=\"message\" [index]=\"i\"> </teta-message>\n}\n" }]
         }], ctorParameters: () => [{ type: MessageService }, { type: i0.ChangeDetectorRef }], propDecorators: { class: [{
                 type: Input
             }], align: [{
@@ -5165,8 +5009,7 @@ class ModalContainerComponent {
         }
     }
     click(event) {
-        if (this.config.closeOnBackdropClick === true &&
-            this.elRef$.nativeElement === event.target) {
+        if (this.config.closeOnBackdropClick === true && this.elRef$.nativeElement === event.target) {
             this.closeEvent.emit({
                 reason: ModalCloseReason.backdrop,
             });
@@ -5175,10 +5018,7 @@ class ModalContainerComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ModalContainerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ModalContainerComponent, isStandalone: true, selector: "teta-modal-container", inputs: { config: "config" }, outputs: { closeEvent: "closeEvent" }, host: { listeners: { "keyup": "keyup($event)", "click": "click($event)" }, properties: { "attr.tabindex": "this.tabindex", "@dialog": "this.dialog", "class": "this.classList" } }, ngImport: i0, template: "<div class=\"modal__container\" [class.modal__container_resize]=\"config?.resizable\">\n  <ng-content></ng-content>\n</div>\n", styles: [""], animations: [
             trigger('dialog', [
-                transition('void => *', [
-                    style({ top: '-100%' }),
-                    animate('150ms ease-in', style({ top: '0' })),
-                ]),
+                transition('void => *', [style({ top: '-100%' }), animate('150ms ease-in', style({ top: '0' }))]),
                 transition('* => void', [animate('150ms ease-in', style({ top: '-100%' }))]),
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -5187,10 +5027,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Component,
             args: [{ selector: 'teta-modal-container', animations: [
                         trigger('dialog', [
-                            transition('void => *', [
-                                style({ top: '-100%' }),
-                                animate('150ms ease-in', style({ top: '0' })),
-                            ]),
+                            transition('void => *', [style({ top: '-100%' }), animate('150ms ease-in', style({ top: '0' }))]),
                             transition('* => void', [animate('150ms ease-in', style({ top: '-100%' }))]),
                         ]),
                     ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"modal__container\" [class.modal__container_resize]=\"config?.resizable\">\n  <ng-content></ng-content>\n</div>\n" }]
@@ -5235,16 +5072,11 @@ class DialogComponent {
     }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DialogComponent, deps: [{ token: CurrentModal }, { token: DynamicData }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DialogComponent, isStandalone: true, selector: "teta-dialog", inputs: { message: "message", buttonText: "buttonText", buttonIcon: "buttonIcon", buttonPalette: "buttonPalette", showCancelButton: "showCancelButton" }, ngImport: i0, template: "<div class=\"padding-2 font-body-2\">\n  {{message | transloco}}\n</div>\n<teta-toolbar class=\"justify-content-end\">\n  @if (showCancelButton) {\n    <button teta-button\n      (click)=\"cancel()\"\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\">\n      {{'common.cancel' | transloco}}\n    </button>\n  }\n\n  <button teta-button\n    (click)=\"ok()\"\n    [square]=\"!buttonText?.length\"\n    [palette]=\"buttonPalette\">\n    @if (buttonIcon) {\n      <teta-icon [name]=\"buttonIcon\"></teta-icon>\n    }\n    @if (buttonText?.length > 0) {\n      {{buttonText | transloco}}\n    }\n  </button>\n</teta-toolbar>\n", styles: [":host{display:flex;flex-direction:column;width:300px}\n"], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$2.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DialogComponent, isStandalone: true, selector: "teta-dialog", inputs: { message: "message", buttonText: "buttonText", buttonIcon: "buttonIcon", buttonPalette: "buttonPalette", showCancelButton: "showCancelButton" }, ngImport: i0, template: "<div class=\"padding-2 font-body-2\">\n  {{ message | transloco }}\n</div>\n<teta-toolbar class=\"justify-content-end\">\n  @if (showCancelButton) {\n  <button teta-button (click)=\"cancel()\" [palette]=\"'text'\" [view]=\"'ghost'\">\n    {{ 'common.cancel' | transloco }}\n  </button>\n  }\n\n  <button teta-button (click)=\"ok()\" [square]=\"!buttonText?.length\" [palette]=\"buttonPalette\">\n    @if (buttonIcon) {\n    <teta-icon [name]=\"buttonIcon\"></teta-icon>\n    } @if (buttonText?.length > 0) {\n    {{ buttonText | transloco }}\n    }\n  </button>\n</teta-toolbar>\n", styles: [":host{display:flex;flex-direction:column;width:300px}\n"], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$2.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-dialog', standalone: true, imports: [
-                        ToolbarComponent,
-                        ButtonComponent,
-                        IconComponent,
-                        TranslocoModule,
-                    ], template: "<div class=\"padding-2 font-body-2\">\n  {{message | transloco}}\n</div>\n<teta-toolbar class=\"justify-content-end\">\n  @if (showCancelButton) {\n    <button teta-button\n      (click)=\"cancel()\"\n      [palette]=\"'text'\"\n      [view]=\"'ghost'\">\n      {{'common.cancel' | transloco}}\n    </button>\n  }\n\n  <button teta-button\n    (click)=\"ok()\"\n    [square]=\"!buttonText?.length\"\n    [palette]=\"buttonPalette\">\n    @if (buttonIcon) {\n      <teta-icon [name]=\"buttonIcon\"></teta-icon>\n    }\n    @if (buttonText?.length > 0) {\n      {{buttonText | transloco}}\n    }\n  </button>\n</teta-toolbar>\n", styles: [":host{display:flex;flex-direction:column;width:300px}\n"] }]
+            args: [{ selector: 'teta-dialog', standalone: true, imports: [ToolbarComponent, ButtonComponent, IconComponent, TranslocoModule], template: "<div class=\"padding-2 font-body-2\">\n  {{ message | transloco }}\n</div>\n<teta-toolbar class=\"justify-content-end\">\n  @if (showCancelButton) {\n  <button teta-button (click)=\"cancel()\" [palette]=\"'text'\" [view]=\"'ghost'\">\n    {{ 'common.cancel' | transloco }}\n  </button>\n  }\n\n  <button teta-button (click)=\"ok()\" [square]=\"!buttonText?.length\" [palette]=\"buttonPalette\">\n    @if (buttonIcon) {\n    <teta-icon [name]=\"buttonIcon\"></teta-icon>\n    } @if (buttonText?.length > 0) {\n    {{ buttonText | transloco }}\n    }\n  </button>\n</teta-toolbar>\n", styles: [":host{display:flex;flex-direction:column;width:300px}\n"] }]
         }], ctorParameters: () => [{ type: CurrentModal }, { type: DynamicData }], propDecorators: { message: [{
                 type: Input
             }], buttonText: [{
@@ -5259,28 +5091,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class ModalModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.1", ngImport: i0, type: ModalModule, imports: [CommonModule,
-            TranslocoModule,
-            ModalContainerComponent, DialogComponent], exports: [ModalContainerComponent, DialogComponent] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.1", ngImport: i0, type: ModalModule, imports: [CommonModule, TranslocoModule, ModalContainerComponent, DialogComponent], exports: [ModalContainerComponent, DialogComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ModalModule, providers: [
             {
                 provide: TRANSLOCO_SCOPE,
                 useValue: { scope: 'common', alias: 'common' },
                 multi: true,
             },
-        ], imports: [CommonModule,
-            TranslocoModule,
-            DialogComponent] }); }
+        ], imports: [CommonModule, TranslocoModule, DialogComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ModalModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [ModalContainerComponent, DialogComponent],
-                    imports: [
-                        CommonModule,
-                        TranslocoModule,
-                        ModalContainerComponent, DialogComponent,
-                    ],
+                    imports: [CommonModule, TranslocoModule, ModalContainerComponent, DialogComponent],
                     providers: [
                         {
                             provide: TRANSLOCO_SCOPE,
@@ -5495,7 +5319,8 @@ class PagerState {
         if (options) {
             this.pageSize = options.pageSize || 30;
             this.count = options.count !== null && options.count !== undefined ? options.count : this.count;
-            this.totalCount = options.totalCount !== null && options.totalCount !== undefined ? options.totalCount : this.totalCount;
+            this.totalCount =
+                options.totalCount !== null && options.totalCount !== undefined ? options.totalCount : this.totalCount;
             this.page = options.page !== null && options.page !== undefined ? options.page : 0;
             this.createPages();
         }
@@ -5551,10 +5376,7 @@ class PanelComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: PanelComponent, isStandalone: true, selector: "teta-panel", inputs: { width: "width" }, host: { properties: { "@panel": "this.panel", "class.column": "this.column", "class.column_fixed": "this.auto" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], animations: [
             trigger('panel', [
-                transition('void => *', [
-                    style({ opacity: '0' }),
-                    animate(300, style({ opacity: '1' })),
-                ]),
+                transition('void => *', [style({ opacity: '0' }), animate(300, style({ opacity: '1' }))]),
                 transition('* => void', [animate(150, style({ opacity: '0' }))]),
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -5563,10 +5385,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Component,
             args: [{ selector: 'teta-panel', changeDetection: ChangeDetectionStrategy.OnPush, animations: [
                         trigger('panel', [
-                            transition('void => *', [
-                                style({ opacity: '0' }),
-                                animate(300, style({ opacity: '1' })),
-                            ]),
+                            transition('void => *', [style({ opacity: '0' }), animate(300, style({ opacity: '1' }))]),
                             transition('* => void', [animate(150, style({ opacity: '0' }))]),
                         ]),
                     ], standalone: true, template: "<ng-content></ng-content>\n" }]
@@ -5624,8 +5443,7 @@ class ProgressBarComponent {
         };
         this.getMousePositionInPercents = (event) => {
             const position = event.clientX - this.containerPosition.min;
-            let percent = (100 / (this.containerPosition.max - this.containerPosition.min)) *
-                position;
+            let percent = (100 / (this.containerPosition.max - this.containerPosition.min)) * position;
             percent = percent <= 0 ? 0 : percent > 100 ? 100 : percent;
             this.setValue(this.getValueFromPercent(percent));
         };
@@ -5669,7 +5487,7 @@ class ProgressBarComponent {
         if (!this.step || this.step <= 0 || isNaN(this.step)) {
             return exactValue;
         }
-        return (Math.round((exactValue - this.min) / this.step) * this.step + this.min);
+        return Math.round((exactValue - this.min) / this.step) * this.step + this.min;
     }
     addListener() {
         this._document.addEventListener('mousemove', this.mousemove);
@@ -5682,11 +5500,11 @@ class ProgressBarComponent {
         return (100 / range) * (this.value - this.min);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ProgressBarComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ProgressBarComponent, isStandalone: true, selector: "teta-progress-bar", inputs: { min: "min", max: "max", step: "step" }, host: { listeners: { "document:mouseup": "mouseup($event)", "click": "click($event)" }, properties: { "class.progress": "this.progressBar" } }, providers: [SLIDER_CONTROL_VALUE_ACCESSOR], viewQueries: [{ propertyName: "slider", first: true, predicate: ["progressSlider"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"progress-bar\" [style.width.%]=\"percent\"></div>\n<div class=\"progress-slider\"\n     [class.progress-slider_visible]=\"moving\"\n     #progressSlider\n     (mousedown)=\"mousedown()\"\n     (click)=\"click($event)\"\n     [style.left.%]=\"percent\"></div>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ProgressBarComponent, isStandalone: true, selector: "teta-progress-bar", inputs: { min: "min", max: "max", step: "step" }, host: { listeners: { "document:mouseup": "mouseup($event)", "click": "click($event)" }, properties: { "class.progress": "this.progressBar" } }, providers: [SLIDER_CONTROL_VALUE_ACCESSOR], viewQueries: [{ propertyName: "slider", first: true, predicate: ["progressSlider"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"progress-bar\" [style.width.%]=\"percent\"></div>\n<div\n  class=\"progress-slider\"\n  [class.progress-slider_visible]=\"moving\"\n  #progressSlider\n  (mousedown)=\"mousedown()\"\n  (click)=\"click($event)\"\n  [style.left.%]=\"percent\"\n></div>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ProgressBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-progress-bar', providers: [SLIDER_CONTROL_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"progress-bar\" [style.width.%]=\"percent\"></div>\n<div class=\"progress-slider\"\n     [class.progress-slider_visible]=\"moving\"\n     #progressSlider\n     (mousedown)=\"mousedown()\"\n     (click)=\"click($event)\"\n     [style.left.%]=\"percent\"></div>\n" }]
+            args: [{ selector: 'teta-progress-bar', providers: [SLIDER_CONTROL_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"progress-bar\" [style.width.%]=\"percent\"></div>\n<div\n  class=\"progress-slider\"\n  [class.progress-slider_visible]=\"moving\"\n  #progressSlider\n  (mousedown)=\"mousedown()\"\n  (click)=\"click($event)\"\n  [style.left.%]=\"percent\"\n></div>\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -5729,7 +5547,7 @@ function boolOrFuncCallback(variable) {
 class FormsUtil {
     static validateAllFormFields(formGroup) {
         formGroup.updateValueAndValidity();
-        Object.keys(formGroup.controls).forEach(field => {
+        Object.keys(formGroup.controls).forEach((field) => {
             const control = formGroup.get(field);
             if (control instanceof UntypedFormControl) {
                 control.markAsTouched({ onlySelf: true });
@@ -5741,8 +5559,7 @@ class FormsUtil {
         });
     }
     static controlIsInvalid(formGroup, controlName) {
-        return (formGroup.controls[controlName]?.invalid &&
-            formGroup.controls[controlName]?.dirty);
+        return formGroup.controls[controlName]?.invalid && formGroup.controls[controlName]?.dirty;
     }
     static getControlErrors(formGroup, controlName) {
         if (FormsUtil.controlIsInvalid(formGroup, controlName)) {
@@ -5751,19 +5568,12 @@ class FormsUtil {
         return [];
     }
     static matchValuesValidator(matchTo) {
-        return (control) => !!control.parent &&
-            !!control.parent.value &&
-            control.value === control.parent.controls[matchTo].value
+        return (control) => !!control.parent && !!control.parent.value && control.value === control.parent.controls[matchTo].value
             ? null
             : { isMatching: false };
     }
     static requiredIf(value) {
-        return (control) => !!control.parent &&
-            !!control.parent.value &&
-            control.value != null &&
-            value
-            ? null
-            : { isMatching: false };
+        return (control) => !!control.parent && !!control.parent.value && control.value != null && value ? null : { isMatching: false };
     }
     static initFormFromColumns(columns, dataItem) {
         const form = new UntypedFormGroup({});
@@ -5780,10 +5590,7 @@ class FormsUtil {
             disabled: !column.editable,
         }, {
             validators: FormsUtil.getValidators(column),
-            updateOn: column.filterType === FilterType.number ||
-                column.filterType === FilterType.string
-                ? 'blur'
-                : 'change',
+            updateOn: column.filterType === FilterType.number || column.filterType === FilterType.string ? 'blur' : 'change',
         });
     }
     static getValidators(column) {
@@ -5836,7 +5643,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaPropertyGridItemDescription]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }], propDecorators: { name: [{
                 type: Input,
@@ -5881,7 +5688,7 @@ class TableColumn extends FilterItem {
         this.minValue = options?.minValue;
         this.maxLength = options?.maxLength;
         this.required = options?.required;
-        this.columns = options?.columns?.map(x => new TableColumn(x)) ?? [];
+        this.columns = options?.columns?.map((x) => new TableColumn(x)) ?? [];
         this.validators = options?.validators;
     }
 }
@@ -5936,11 +5743,11 @@ class ToggleComponent {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ToggleComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ToggleComponent, isStandalone: true, selector: "teta-toggle", inputs: { palette: "palette", noLabel: "noLabel", disabled: "disabled" }, host: { listeners: { "click": "changeValue()" }, properties: { "attr.tabindex": "this.tabindex", "class.toggle": "this.toggleClass", "class.toggle_disabled": "this.disabled" } }, providers: [TOGGLE_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "@if (!noLabel) {\n  <span class=\"font-body-3 row_auto\">\n    <ng-content></ng-content>\n  </span>\n}\n<div class=\"toggle-button\" [class.toggle-button-on]=\"model\" [ngClass]=\"paletteClass\">\n  <div class=\"toggle-button-circle\"></div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ToggleComponent, isStandalone: true, selector: "teta-toggle", inputs: { palette: "palette", noLabel: "noLabel", disabled: "disabled" }, host: { listeners: { "click": "changeValue()" }, properties: { "attr.tabindex": "this.tabindex", "class.toggle": "this.toggleClass", "class.toggle_disabled": "this.disabled" } }, providers: [TOGGLE_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "@if (!noLabel) {\n<span class=\"font-body-3 row_auto\">\n  <ng-content></ng-content>\n</span>\n}\n<div class=\"toggle-button\" [class.toggle-button-on]=\"model\" [ngClass]=\"paletteClass\">\n  <div class=\"toggle-button-circle\"></div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ToggleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-toggle', providers: [TOGGLE_CONTROL_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass], template: "@if (!noLabel) {\n  <span class=\"font-body-3 row_auto\">\n    <ng-content></ng-content>\n  </span>\n}\n<div class=\"toggle-button\" [class.toggle-button-on]=\"model\" [ngClass]=\"paletteClass\">\n  <div class=\"toggle-button-circle\"></div>\n</div>\n" }]
+            args: [{ selector: 'teta-toggle', providers: [TOGGLE_CONTROL_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass], template: "@if (!noLabel) {\n<span class=\"font-body-3 row_auto\">\n  <ng-content></ng-content>\n</span>\n}\n<div class=\"toggle-button\" [class.toggle-button-on]=\"model\" [ngClass]=\"paletteClass\">\n  <div class=\"toggle-button-circle\"></div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { tabindex: [{
                 type: HostBinding,
                 args: ['attr.tabindex']
@@ -5972,7 +5779,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaSelectOption]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -5987,7 +5794,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaSelectValue]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -6005,7 +5812,7 @@ class HighlightDirective {
                 .toLowerCase()
                 .replace(pattern, '\\$&')
                 .split(' ')
-                .filter(t => t.length > 0)
+                .filter((t) => t.length > 0)
                 .join('|');
             this._initialElement = this.elementRef.nativeElement.innerHTML;
             this.recursiveReplaceNode(this.elementRef.nativeElement.childNodes, searchWithOutRegExp);
@@ -6021,7 +5828,7 @@ class HighlightDirective {
         nodes.forEach((node) => {
             cacheNodes.push(node);
         });
-        cacheNodes.forEach(node => {
+        cacheNodes.forEach((node) => {
             if (node.nodeType === 3) {
                 if (node.nodeValue && node.nodeValue.search(new RegExp(searchWithOutRegExp, 'i')) > -1) {
                     match = true;
@@ -6039,8 +5846,7 @@ class HighlightDirective {
             return;
         }
         const tempDiv = document.createElement('div');
-        tempDiv.innerHTML = textNode.nodeValue
-            .replace(new RegExp(searchWithOutRegExp, 'gi'), match => `<mark>${match}</mark>`);
+        tempDiv.innerHTML = textNode.nodeValue.replace(new RegExp(searchWithOutRegExp, 'gi'), (match) => `<mark>${match}</mark>`);
         const parentNode = textNode.parentNode;
         if (parentNode) {
             while (tempDiv.firstChild) {
@@ -6065,9 +5871,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class SelectComponent {
     set options(options) {
         this._options = options;
-        if (this._internalValue !== null &&
-            this._internalValue !== undefined &&
-            this.options) {
+        if (this._internalValue !== null && this._internalValue !== undefined && this.options) {
             this.getSelectedValue(this._internalValue);
         }
     }
@@ -6084,9 +5888,7 @@ class SelectComponent {
         if (!this.searchText) {
             return this.options;
         }
-        return this.options?.filter(option => this.getSearchString(option)
-            .toLowerCase()
-            .indexOf(this.searchText.toLowerCase()) >= 0);
+        return this.options?.filter((option) => this.getSearchString(option).toLowerCase().indexOf(this.searchText.toLowerCase()) >= 0);
     }
     constructor(_cdr, _elementRef, _config) {
         this._cdr = _cdr;
@@ -6130,7 +5932,7 @@ class SelectComponent {
             else {
                 this.value = [...this.value, option];
             }
-            this._internalValue = this.value.map(_ => this.getValue(_));
+            this._internalValue = this.value.map((_) => this.getValue(_));
             this.onChange(this._internalValue);
         }
         else {
@@ -6153,11 +5955,11 @@ class SelectComponent {
     removeItemClick(option, event) {
         event.stopPropagation();
         this.removeItem(option);
-        this._internalValue = this.value.map(_ => this.getValue(_));
+        this._internalValue = this.value.map((_) => this.getValue(_));
         this.onChange(this._internalValue);
     }
     removeItem(option) {
-        this.value = this.value.filter(_ => _ !== option);
+        this.value = this.value.filter((_) => _ !== option);
     }
     search(text) {
         this.searchText = text;
@@ -6216,14 +6018,10 @@ class SelectComponent {
     getSelectedValue(value) {
         if (this.multiple) {
             this.value =
-                value && this.options
-                    ? this.options.filter(option => value.indexOf(this.getValue(option)) > -1)
-                    : [];
+                value && this.options ? this.options.filter((option) => value.indexOf(this.getValue(option)) > -1) : [];
         }
         else {
-            this.value =
-                this.options &&
-                    this.options?.find(option => this.getValue(option) === value);
+            this.value = this.options && this.options?.find((option) => this.getValue(option) === value);
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: TetaConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
@@ -6233,7 +6031,7 @@ class SelectComponent {
                 useExisting: forwardRef(() => SelectComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "optionDirective", first: true, predicate: SelectOptionDirective, descendants: true, static: true }, { propertyName: "valueDirective", first: true, predicate: SelectValueDirective, descendants: true, static: true }], ngImport: i0, template: "@if (locale|async; as loc){\n  <teta-dropdown [align]='align'\n    [verticalAlign]='verticalAlign'\n    [autoClose]='autoClose'\n    [autoCloseIgnore]='autoCloseIgnore'\n    [(open)]='open'\n    [appendToBody]='appendToBody'\n    [disabled]='disabled'\n    [viewType]='viewType'\n    class='row row_auto'>\n    <div tetaDropdownHead\n      [class]=\"'row row_auto select-head select_'+viewType\"\n      [class.select-head_invalid]='invalid'>\n      <div class='row_auto flex align-center'>\n        @if (icon) {\n          <teta-icon [name]='icon' [palette]=\"'text'\" class='margin-right-1'></teta-icon>\n        }\n        @if ((value=== null ||value=== undefined || value?.length === 0)&&!multiple) {\n          <span class='placeholder'>\n            {{placeholder || loc.notSelected}}\n          </span>\n        }\n        <ng-container\n        *ngTemplateOutlet='valueDirective ? valueDirective.template : valueDefault; context: {$implicit: value, value: value}'></ng-container>\n      </div>\n      <teta-icon [name]=\"'arrowDownSmall'\" [palette]=\"'text'\"></teta-icon>\n    </div>\n    @if (options?.length) {\n      <div\n        tetaDropdownContent\n        class='select-body row_auto'\n        (click)='$event.preventDefault()'>\n        @if (searchRef) {\n          <div class='select-search padding-h-2'>\n            <teta-text-field [ngModel]='searchText'\n              [class]=\"'select_'+viewType\"\n              (ngModelChange)='search($event)'\n              [placeholder]='loc.search'\n            [leftIconName]=\"'search'\"></teta-text-field>\n          </div>\n        }\n        @if (visibleOptions?.length) {\n          @if (!multiple && allowNull) {\n            <div [class]=\"'margin-h-2 list-item list-item_interactive select_'+viewType\"\n              (click)='clear()'>\n              {{loc.notSelected}}\n            </div>\n            <div class='list-divider margin-bottom-0'></div>\n          }\n          @if (virtual) {\n            <teta-scrollable class='column column_auto padding-h-2'>\n              <cdk-virtual-scroll-viewport tetaScrollable\n                [itemSize]='40'\n                minBufferPx='200'\n                maxBufferPx='600'>\n                <div [class]=\"'list-item list-item_interactive justify-content-between select_'+viewType\"\n                  *cdkVirtualFor='let option of visibleOptions; templateCacheSize: 0;'\n                  [class.list-item_active]='itemSelected(option)'\n                  [tetaHighlight]='searchText'\n                  (click)='clickOption(option, $event)'>\n                  <div [tetaHighlight]='searchText'>\n                    <ng-container\n                      *ngTemplateOutlet='optionDirective ? optionDirective.template : optionDefault; context: {$implicit: option, option: option}'>\n                    </ng-container>\n                  </div>\n                  @if (itemSelected(option)) {\n                    <teta-icon [name]=\"'tick'\" [palette]=\"'text'\"\n                    class='margin-left-2'></teta-icon>\n                  }\n                </div>\n              </cdk-virtual-scroll-viewport>\n            </teta-scrollable>\n          } @else {\n            <teta-scrollable class='column column_auto padding-h-2' [contentClass]=\"['column', 'column_auto']\">\n              <div class='list'>\n                @for (option of visibleOptions; track option) {\n                  <div [class]=\"'list-item list-item_interactive justify-content-between  select_'+viewType\"\n                    [class.list-item_active]='itemSelected(option)'\n                    (click)='clickOption(option, $event)'>\n                    <span [tetaHighlight]='searchText'>\n                      <ng-container\n                        *ngTemplateOutlet='optionDirective ? optionDirective.template : optionDefault; context: {$implicit: option, option: option}'>\n                      </ng-container>\n                    </span>\n                    @if (itemSelected(option) && multiple) {\n                      <teta-icon [name]=\"'tick'\" [palette]=\"'text'\"></teta-icon>\n                    }\n                  </div>\n                }\n              </div>\n            </teta-scrollable>\n          }\n        } @else {\n          <p\n          class='padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option'>{{notFoundText || loc.notFound}}</p>\n        }\n        @if (multiple && value?.length) {\n          <div class='row row_auto select-chip-field flex-wrap'>\n            @for (item of value; track item) {\n              <div class='tag'>\n                <p>{{getText(item)}}</p>\n                <teta-icon class='cursor-pointer' [palette]=\"'text'\" [name]=\"'closeCircle'\"\n                (click)='removeItemClick(item, $event)'></teta-icon>\n              </div>\n            }\n          </div>\n        }\n      </div>\n    }\n  </teta-dropdown>\n  <ng-template #notFound>\n    <p\n    class='padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option'>{{notFoundText || loc.notFound}}</p>\n  </ng-template>\n  <ng-template #optionDefault let-option>\n    {{getText(option)}}\n  </ng-template>\n  <ng-template #valueDefault let-value>\n    @if (multiple) {\n      <div class='row_auto overflow-hidden text-overflow-ellipsis'>\n        {{loc.selected + ' ' + value?.length}}\n      </div>\n    }\n    @if (!multiple) {\n      <span class='row row_auto overflow-hidden text-overflow-ellipsis'>{{getText(value)}}</span>\n    }\n  </ng-template>\n}\n\n", styles: [""], dependencies: [{ kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "component", type: TextFieldComponent, selector: "teta-text-field", inputs: ["placeholder", "leftIconName", "disabled", "onlyNumber", "decimalPart", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ScrollableDirective, selector: "[tetaScrollable]" }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: HighlightDirective, selector: "[tetaHighlight]", inputs: ["tetaHighlight"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "optionDirective", first: true, predicate: SelectOptionDirective, descendants: true, static: true }, { propertyName: "valueDirective", first: true, predicate: SelectValueDirective, descendants: true, static: true }], ngImport: i0, template: "@if (locale|async; as loc){\n<teta-dropdown\n  [align]=\"align\"\n  [verticalAlign]=\"verticalAlign\"\n  [autoClose]=\"autoClose\"\n  [autoCloseIgnore]=\"autoCloseIgnore\"\n  [(open)]=\"open\"\n  [appendToBody]=\"appendToBody\"\n  [disabled]=\"disabled\"\n  [viewType]=\"viewType\"\n  class=\"row row_auto\"\n>\n  <div tetaDropdownHead [class]=\"'row row_auto select-head select_' + viewType\" [class.select-head_invalid]=\"invalid\">\n    <div class=\"row_auto flex align-center\">\n      @if (icon) {\n      <teta-icon [name]=\"icon\" [palette]=\"'text'\" class=\"margin-right-1\"></teta-icon>\n      } @if ((value=== null ||value=== undefined || value?.length === 0)&&!multiple) {\n      <span class=\"placeholder\">\n        {{ placeholder || loc.notSelected }}\n      </span>\n      }\n      <ng-container\n        *ngTemplateOutlet=\"\n          valueDirective ? valueDirective.template : valueDefault;\n          context: { $implicit: value, value: value }\n        \"\n      ></ng-container>\n    </div>\n    <teta-icon [name]=\"'arrowDownSmall'\" [palette]=\"'text'\"></teta-icon>\n  </div>\n  @if (options?.length) {\n  <div tetaDropdownContent class=\"select-body row_auto\" (click)=\"$event.preventDefault()\">\n    @if (searchRef) {\n    <div class=\"select-search padding-h-2\">\n      <teta-text-field\n        [ngModel]=\"searchText\"\n        [class]=\"'select_' + viewType\"\n        (ngModelChange)=\"search($event)\"\n        [placeholder]=\"loc.search\"\n        [leftIconName]=\"'search'\"\n      ></teta-text-field>\n    </div>\n    } @if (visibleOptions?.length) { @if (!multiple && allowNull) {\n    <div [class]=\"'margin-h-2 list-item list-item_interactive select_' + viewType\" (click)=\"clear()\">\n      {{ loc.notSelected }}\n    </div>\n    <div class=\"list-divider margin-bottom-0\"></div>\n    } @if (virtual) {\n    <teta-scrollable class=\"column column_auto padding-h-2\">\n      <cdk-virtual-scroll-viewport tetaScrollable [itemSize]=\"40\" minBufferPx=\"200\" maxBufferPx=\"600\">\n        <div\n          [class]=\"'list-item list-item_interactive justify-content-between select_' + viewType\"\n          *cdkVirtualFor=\"let option of visibleOptions; templateCacheSize: 0\"\n          [class.list-item_active]=\"itemSelected(option)\"\n          [tetaHighlight]=\"searchText\"\n          (click)=\"clickOption(option, $event)\"\n        >\n          <div [tetaHighlight]=\"searchText\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                optionDirective ? optionDirective.template : optionDefault;\n                context: { $implicit: option, option: option }\n              \"\n            >\n            </ng-container>\n          </div>\n          @if (itemSelected(option)) {\n          <teta-icon [name]=\"'tick'\" [palette]=\"'text'\" class=\"margin-left-2\"></teta-icon>\n          }\n        </div>\n      </cdk-virtual-scroll-viewport>\n    </teta-scrollable>\n    } @else {\n    <teta-scrollable class=\"column column_auto padding-h-2\" [contentClass]=\"['column', 'column_auto']\">\n      <div class=\"list\">\n        @for (option of visibleOptions; track option) {\n        <div\n          [class]=\"'list-item list-item_interactive justify-content-between  select_' + viewType\"\n          [class.list-item_active]=\"itemSelected(option)\"\n          (click)=\"clickOption(option, $event)\"\n        >\n          <span [tetaHighlight]=\"searchText\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                optionDirective ? optionDirective.template : optionDefault;\n                context: { $implicit: option, option: option }\n              \"\n            >\n            </ng-container>\n          </span>\n          @if (itemSelected(option) && multiple) {\n          <teta-icon [name]=\"'tick'\" [palette]=\"'text'\"></teta-icon>\n          }\n        </div>\n        }\n      </div>\n    </teta-scrollable>\n    } } @else {\n    <p class=\"padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option\">\n      {{ notFoundText || loc.notFound }}\n    </p>\n    } @if (multiple && value?.length) {\n    <div class=\"row row_auto select-chip-field flex-wrap\">\n      @for (item of value; track item) {\n      <div class=\"tag\">\n        <p>{{ getText(item) }}</p>\n        <teta-icon\n          class=\"cursor-pointer\"\n          [palette]=\"'text'\"\n          [name]=\"'closeCircle'\"\n          (click)=\"removeItemClick(item, $event)\"\n        ></teta-icon>\n      </div>\n      }\n    </div>\n    }\n  </div>\n  }\n</teta-dropdown>\n<ng-template #notFound>\n  <p class=\"padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option\">\n    {{ notFoundText || loc.notFound }}\n  </p>\n</ng-template>\n<ng-template #optionDefault let-option>\n  {{ getText(option) }}\n</ng-template>\n<ng-template #valueDefault let-value>\n  @if (multiple) {\n  <div class=\"row_auto overflow-hidden text-overflow-ellipsis\">\n    {{ loc.selected + ' ' + value?.length }}\n  </div>\n  } @if (!multiple) {\n  <span class=\"row row_auto overflow-hidden text-overflow-ellipsis\">{{ getText(value) }}</span>\n  }\n</ng-template>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "component", type: TextFieldComponent, selector: "teta-text-field", inputs: ["placeholder", "leftIconName", "disabled", "onlyNumber", "decimalPart", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ScrollableDirective, selector: "[tetaScrollable]" }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: HighlightDirective, selector: "[tetaHighlight]", inputs: ["tetaHighlight"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
@@ -6259,7 +6057,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         CdkVirtualForOf,
                         HighlightDirective,
                         AsyncPipe,
-                    ], template: "@if (locale|async; as loc){\n  <teta-dropdown [align]='align'\n    [verticalAlign]='verticalAlign'\n    [autoClose]='autoClose'\n    [autoCloseIgnore]='autoCloseIgnore'\n    [(open)]='open'\n    [appendToBody]='appendToBody'\n    [disabled]='disabled'\n    [viewType]='viewType'\n    class='row row_auto'>\n    <div tetaDropdownHead\n      [class]=\"'row row_auto select-head select_'+viewType\"\n      [class.select-head_invalid]='invalid'>\n      <div class='row_auto flex align-center'>\n        @if (icon) {\n          <teta-icon [name]='icon' [palette]=\"'text'\" class='margin-right-1'></teta-icon>\n        }\n        @if ((value=== null ||value=== undefined || value?.length === 0)&&!multiple) {\n          <span class='placeholder'>\n            {{placeholder || loc.notSelected}}\n          </span>\n        }\n        <ng-container\n        *ngTemplateOutlet='valueDirective ? valueDirective.template : valueDefault; context: {$implicit: value, value: value}'></ng-container>\n      </div>\n      <teta-icon [name]=\"'arrowDownSmall'\" [palette]=\"'text'\"></teta-icon>\n    </div>\n    @if (options?.length) {\n      <div\n        tetaDropdownContent\n        class='select-body row_auto'\n        (click)='$event.preventDefault()'>\n        @if (searchRef) {\n          <div class='select-search padding-h-2'>\n            <teta-text-field [ngModel]='searchText'\n              [class]=\"'select_'+viewType\"\n              (ngModelChange)='search($event)'\n              [placeholder]='loc.search'\n            [leftIconName]=\"'search'\"></teta-text-field>\n          </div>\n        }\n        @if (visibleOptions?.length) {\n          @if (!multiple && allowNull) {\n            <div [class]=\"'margin-h-2 list-item list-item_interactive select_'+viewType\"\n              (click)='clear()'>\n              {{loc.notSelected}}\n            </div>\n            <div class='list-divider margin-bottom-0'></div>\n          }\n          @if (virtual) {\n            <teta-scrollable class='column column_auto padding-h-2'>\n              <cdk-virtual-scroll-viewport tetaScrollable\n                [itemSize]='40'\n                minBufferPx='200'\n                maxBufferPx='600'>\n                <div [class]=\"'list-item list-item_interactive justify-content-between select_'+viewType\"\n                  *cdkVirtualFor='let option of visibleOptions; templateCacheSize: 0;'\n                  [class.list-item_active]='itemSelected(option)'\n                  [tetaHighlight]='searchText'\n                  (click)='clickOption(option, $event)'>\n                  <div [tetaHighlight]='searchText'>\n                    <ng-container\n                      *ngTemplateOutlet='optionDirective ? optionDirective.template : optionDefault; context: {$implicit: option, option: option}'>\n                    </ng-container>\n                  </div>\n                  @if (itemSelected(option)) {\n                    <teta-icon [name]=\"'tick'\" [palette]=\"'text'\"\n                    class='margin-left-2'></teta-icon>\n                  }\n                </div>\n              </cdk-virtual-scroll-viewport>\n            </teta-scrollable>\n          } @else {\n            <teta-scrollable class='column column_auto padding-h-2' [contentClass]=\"['column', 'column_auto']\">\n              <div class='list'>\n                @for (option of visibleOptions; track option) {\n                  <div [class]=\"'list-item list-item_interactive justify-content-between  select_'+viewType\"\n                    [class.list-item_active]='itemSelected(option)'\n                    (click)='clickOption(option, $event)'>\n                    <span [tetaHighlight]='searchText'>\n                      <ng-container\n                        *ngTemplateOutlet='optionDirective ? optionDirective.template : optionDefault; context: {$implicit: option, option: option}'>\n                      </ng-container>\n                    </span>\n                    @if (itemSelected(option) && multiple) {\n                      <teta-icon [name]=\"'tick'\" [palette]=\"'text'\"></teta-icon>\n                    }\n                  </div>\n                }\n              </div>\n            </teta-scrollable>\n          }\n        } @else {\n          <p\n          class='padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option'>{{notFoundText || loc.notFound}}</p>\n        }\n        @if (multiple && value?.length) {\n          <div class='row row_auto select-chip-field flex-wrap'>\n            @for (item of value; track item) {\n              <div class='tag'>\n                <p>{{getText(item)}}</p>\n                <teta-icon class='cursor-pointer' [palette]=\"'text'\" [name]=\"'closeCircle'\"\n                (click)='removeItemClick(item, $event)'></teta-icon>\n              </div>\n            }\n          </div>\n        }\n      </div>\n    }\n  </teta-dropdown>\n  <ng-template #notFound>\n    <p\n    class='padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option'>{{notFoundText || loc.notFound}}</p>\n  </ng-template>\n  <ng-template #optionDefault let-option>\n    {{getText(option)}}\n  </ng-template>\n  <ng-template #valueDefault let-value>\n    @if (multiple) {\n      <div class='row_auto overflow-hidden text-overflow-ellipsis'>\n        {{loc.selected + ' ' + value?.length}}\n      </div>\n    }\n    @if (!multiple) {\n      <span class='row row_auto overflow-hidden text-overflow-ellipsis'>{{getText(value)}}</span>\n    }\n  </ng-template>\n}\n\n" }]
+                    ], template: "@if (locale|async; as loc){\n<teta-dropdown\n  [align]=\"align\"\n  [verticalAlign]=\"verticalAlign\"\n  [autoClose]=\"autoClose\"\n  [autoCloseIgnore]=\"autoCloseIgnore\"\n  [(open)]=\"open\"\n  [appendToBody]=\"appendToBody\"\n  [disabled]=\"disabled\"\n  [viewType]=\"viewType\"\n  class=\"row row_auto\"\n>\n  <div tetaDropdownHead [class]=\"'row row_auto select-head select_' + viewType\" [class.select-head_invalid]=\"invalid\">\n    <div class=\"row_auto flex align-center\">\n      @if (icon) {\n      <teta-icon [name]=\"icon\" [palette]=\"'text'\" class=\"margin-right-1\"></teta-icon>\n      } @if ((value=== null ||value=== undefined || value?.length === 0)&&!multiple) {\n      <span class=\"placeholder\">\n        {{ placeholder || loc.notSelected }}\n      </span>\n      }\n      <ng-container\n        *ngTemplateOutlet=\"\n          valueDirective ? valueDirective.template : valueDefault;\n          context: { $implicit: value, value: value }\n        \"\n      ></ng-container>\n    </div>\n    <teta-icon [name]=\"'arrowDownSmall'\" [palette]=\"'text'\"></teta-icon>\n  </div>\n  @if (options?.length) {\n  <div tetaDropdownContent class=\"select-body row_auto\" (click)=\"$event.preventDefault()\">\n    @if (searchRef) {\n    <div class=\"select-search padding-h-2\">\n      <teta-text-field\n        [ngModel]=\"searchText\"\n        [class]=\"'select_' + viewType\"\n        (ngModelChange)=\"search($event)\"\n        [placeholder]=\"loc.search\"\n        [leftIconName]=\"'search'\"\n      ></teta-text-field>\n    </div>\n    } @if (visibleOptions?.length) { @if (!multiple && allowNull) {\n    <div [class]=\"'margin-h-2 list-item list-item_interactive select_' + viewType\" (click)=\"clear()\">\n      {{ loc.notSelected }}\n    </div>\n    <div class=\"list-divider margin-bottom-0\"></div>\n    } @if (virtual) {\n    <teta-scrollable class=\"column column_auto padding-h-2\">\n      <cdk-virtual-scroll-viewport tetaScrollable [itemSize]=\"40\" minBufferPx=\"200\" maxBufferPx=\"600\">\n        <div\n          [class]=\"'list-item list-item_interactive justify-content-between select_' + viewType\"\n          *cdkVirtualFor=\"let option of visibleOptions; templateCacheSize: 0\"\n          [class.list-item_active]=\"itemSelected(option)\"\n          [tetaHighlight]=\"searchText\"\n          (click)=\"clickOption(option, $event)\"\n        >\n          <div [tetaHighlight]=\"searchText\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                optionDirective ? optionDirective.template : optionDefault;\n                context: { $implicit: option, option: option }\n              \"\n            >\n            </ng-container>\n          </div>\n          @if (itemSelected(option)) {\n          <teta-icon [name]=\"'tick'\" [palette]=\"'text'\" class=\"margin-left-2\"></teta-icon>\n          }\n        </div>\n      </cdk-virtual-scroll-viewport>\n    </teta-scrollable>\n    } @else {\n    <teta-scrollable class=\"column column_auto padding-h-2\" [contentClass]=\"['column', 'column_auto']\">\n      <div class=\"list\">\n        @for (option of visibleOptions; track option) {\n        <div\n          [class]=\"'list-item list-item_interactive justify-content-between  select_' + viewType\"\n          [class.list-item_active]=\"itemSelected(option)\"\n          (click)=\"clickOption(option, $event)\"\n        >\n          <span [tetaHighlight]=\"searchText\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                optionDirective ? optionDirective.template : optionDefault;\n                context: { $implicit: option, option: option }\n              \"\n            >\n            </ng-container>\n          </span>\n          @if (itemSelected(option) && multiple) {\n          <teta-icon [name]=\"'tick'\" [palette]=\"'text'\"></teta-icon>\n          }\n        </div>\n        }\n      </div>\n    </teta-scrollable>\n    } } @else {\n    <p class=\"padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option\">\n      {{ notFoundText || loc.notFound }}\n    </p>\n    } @if (multiple && value?.length) {\n    <div class=\"row row_auto select-chip-field flex-wrap\">\n      @for (item of value; track item) {\n      <div class=\"tag\">\n        <p>{{ getText(item) }}</p>\n        <teta-icon\n          class=\"cursor-pointer\"\n          [palette]=\"'text'\"\n          [name]=\"'closeCircle'\"\n          (click)=\"removeItemClick(item, $event)\"\n        ></teta-icon>\n      </div>\n      }\n    </div>\n    }\n  </div>\n  }\n</teta-dropdown>\n<ng-template #notFound>\n  <p class=\"padding-h-3 text-overflow-ellipsis overflow-hidden select-not-found-option\">\n    {{ notFoundText || loc.notFound }}\n  </p>\n</ng-template>\n<ng-template #optionDefault let-option>\n  {{ getText(option) }}\n</ng-template>\n<ng-template #valueDefault let-value>\n  @if (multiple) {\n  <div class=\"row_auto overflow-hidden text-overflow-ellipsis\">\n    {{ loc.selected + ' ' + value?.length }}\n  </div>\n  } @if (!multiple) {\n  <span class=\"row row_auto overflow-hidden text-overflow-ellipsis\">{{ getText(value) }}</span>\n  }\n</ng-template>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: TetaConfigService }], propDecorators: { multiple: [{
                 type: HostBinding,
                 args: ['class.select_multiple']
@@ -6350,7 +6148,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class PropertyGridItemComponent {
     get template() {
-        return this.itemTemplates.find(item => item.name === this.column.name);
+        return this.itemTemplates.find((item) => item.name === this.column.name);
     }
     get formGroup() {
         if (this._formGroup instanceof FormGroup) {
@@ -6384,8 +6182,7 @@ class PropertyGridItemComponent {
     getDict() {
         const dict = this.dict ? this.dict[this.column.name] : [];
         if (this.column.parentName?.length > 0) {
-            return dict?.filter((dictItem) => dictItem.parentId ===
-                this.formGroup?.getRawValue()[this.column.parentName]);
+            return dict?.filter((dictItem) => dictItem.parentId === this.formGroup?.getRawValue()[this.column.parentName]);
         }
         return dict;
     }
@@ -6424,7 +6221,7 @@ class PropertyGridItemComponent {
             this._formSub?.unsubscribe();
             this._formSub = this.formGroup?.controls[this.column.name]?.valueChanges
                 .pipe(takeWhile(() => this._alive))
-                .subscribe(_ => {
+                .subscribe((_) => {
                 this.controlValueChange.emit({
                     id: _,
                     name: this.column.name,
@@ -6433,7 +6230,7 @@ class PropertyGridItemComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PropertyGridItemComponent, deps: [{ token: i1$2.TranslocoService }, { token: i2.ControlContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: PropertyGridItemComponent, isStandalone: true, selector: "teta-property-grid-item", inputs: { column: "column", hideNonEditable: "hideNonEditable", dict: "dict", decimalPart: "decimalPart", item: "item", itemTemplates: "itemTemplates", horizontal: "horizontal" }, outputs: { controlValueChange: "controlValueChange" }, usesOnChanges: true, ngImport: i0, template: "@if (editable || !hideNonEditable) {\n  <teta-input [label]=\"caption\"\n              [hint]=\"column.hint\"\n              [formGroup]=\"formGroup\"\n              [horizontal]=\"horizontal\"\n              [required]=\"column.required\"\n  >\n    @if (template) {\n      <ng-container\n        *ngTemplateOutlet=\"template.template;context: {$implicit: formGroup?.get(column.name)}\"></ng-container>\n    } @else {\n      @if (formGroup?.get(column.name)) {\n        @switch (column.filterType) {\n          @case (filterTypeEnum.list) {\n            <teta-select class=\"row_auto\"\n                         [tetaDisableControl]=\"!editable\"\n                         [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n                         [allowNull]=\"!column.required\"\n                         [appendToBody]=\"true\"\n                         [invalid]=\"controlIsInvalid(column.name)\"\n                         [formControlName]=\"column.name\"\n                         [options]=\"getDict()\"\n                         [valueRef]=\"'id'\"\n                         [textRef]=\"'name'\"\n                         [multiple]=\"false\"></teta-select>\n          }\n          @case (filterTypeEnum.date) {\n            <teta-date-picker\n              class=\"row_auto\"\n              [appendToBody]=\"true\"\n              [tetaDisableControl]=\"!editable\"\n              [invalid]=\"controlIsInvalid(column.name)\"\n              [formControlName]=\"column.name\"></teta-date-picker>\n          }\n          @case (filterTypeEnum.boolean) {\n            <teta-toggle\n              [tetaDisableControl]=\"!editable\"\n              [formControlName]=\"column.name\">\n              {{ column.caption }}\n            </teta-toggle>\n          }\n          @default {\n            <teta-text-field class=\"row_auto\"\n                             [tetaDisableControl]=\"!editable\"\n                             [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n                             [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n                             [placeholder]=\"column.caption\"\n                             [invalid]=\"controlIsInvalid(column.name)\"\n                             [formControlName]=\"column.name\"></teta-text-field>\n          }\n        }\n      }\n    }\n    <ng-template #default>\n      @if (formGroup?.get(column.name)) {\n        @switch (column.filterType) {\n          @case (filterTypeEnum.list) {\n            <teta-select class=\"row_auto\"\n                         [tetaDisableControl]=\"!editable\"\n                         [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n                         [allowNull]=\"!column.required\"\n                         [appendToBody]=\"true\"\n                         [invalid]=\"controlIsInvalid(column.name)\"\n                         [formControlName]=\"column.name\"\n                         [options]=\"getDict()\"\n                         [valueRef]=\"'id'\"\n                         [textRef]=\"'name'\"\n                         [multiple]=\"false\"></teta-select>\n          }\n          @case (filterTypeEnum.date) {\n            <teta-date-picker\n              class=\"row_auto\"\n              [appendToBody]=\"true\"\n              [tetaDisableControl]=\"!editable\"\n              [invalid]=\"controlIsInvalid(column.name)\"\n              [formControlName]=\"column.name\"></teta-date-picker>\n          }\n          @case (filterTypeEnum.boolean) {\n            <teta-toggle\n              [tetaDisableControl]=\"!editable\"\n              [formControlName]=\"column.name\">\n              {{ column.caption }}\n            </teta-toggle>\n          }\n          @default {\n            <teta-text-field class=\"row_auto\"\n                             [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n                             [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n                             [placeholder]=\"column.caption\"\n                             [invalid]=\"controlIsInvalid(column.name)\"\n                             [tetaDisableControl]=\"!editable\"\n                             [formControlName]=\"column.name\"></teta-text-field>\n          }\n        }\n      }\n    </ng-template>\n    @if (controlIsInvalid(column.name)) {\n      <div\n        ngProjectAs=\"message\"\n        class=\"color-red-50\">\n        {{ getError(column) }}\n      </div>\n    }\n  </teta-input>\n}\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SelectComponent, selector: "teta-select", inputs: ["multiple", "options", "invalid", "align", "verticalAlign", "autoClose", "autoCloseIgnore", "disabled", "itemSize", "virtual", "icon", "placeholder", "appendToBody", "allowNull", "viewType", "notFoundText", "valueRef", "textRef", "searchRef"] }, { kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "component", type: ToggleComponent, selector: "teta-toggle", inputs: ["palette", "noLabel", "disabled"] }, { kind: "component", type: TextFieldComponent, selector: "teta-text-field", inputs: ["placeholder", "leftIconName", "disabled", "onlyNumber", "decimalPart", "invalid"] }, { kind: "directive", type: DisableControlDirective, selector: "[tetaDisableControl]", inputs: ["tetaDisableControl"] }], viewProviders: [FormsUtil.formProvider] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: PropertyGridItemComponent, isStandalone: true, selector: "teta-property-grid-item", inputs: { column: "column", hideNonEditable: "hideNonEditable", dict: "dict", decimalPart: "decimalPart", item: "item", itemTemplates: "itemTemplates", horizontal: "horizontal" }, outputs: { controlValueChange: "controlValueChange" }, usesOnChanges: true, ngImport: i0, template: "@if (editable || !hideNonEditable) {\n<teta-input\n  [label]=\"caption\"\n  [hint]=\"column.hint\"\n  [formGroup]=\"formGroup\"\n  [horizontal]=\"horizontal\"\n  [required]=\"column.required\"\n>\n  @if (template) {\n  <ng-container\n    *ngTemplateOutlet=\"template.template; context: { $implicit: formGroup?.get(column.name) }\"\n  ></ng-container>\n  } @else { @if (formGroup?.get(column.name)) { @switch (column.filterType) { @case (filterTypeEnum.list) {\n  <teta-select\n    class=\"row_auto\"\n    [tetaDisableControl]=\"!editable\"\n    [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n    [allowNull]=\"!column.required\"\n    [appendToBody]=\"true\"\n    [invalid]=\"controlIsInvalid(column.name)\"\n    [formControlName]=\"column.name\"\n    [options]=\"getDict()\"\n    [valueRef]=\"'id'\"\n    [textRef]=\"'name'\"\n    [multiple]=\"false\"\n  ></teta-select>\n  } @case (filterTypeEnum.date) {\n  <teta-date-picker\n    class=\"row_auto\"\n    [appendToBody]=\"true\"\n    [tetaDisableControl]=\"!editable\"\n    [invalid]=\"controlIsInvalid(column.name)\"\n    [formControlName]=\"column.name\"\n  ></teta-date-picker>\n  } @case (filterTypeEnum.boolean) {\n  <teta-toggle [tetaDisableControl]=\"!editable\" [formControlName]=\"column.name\">\n    {{ column.caption }}\n  </teta-toggle>\n  } @default {\n  <teta-text-field\n    class=\"row_auto\"\n    [tetaDisableControl]=\"!editable\"\n    [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n    [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n    [placeholder]=\"column.caption\"\n    [invalid]=\"controlIsInvalid(column.name)\"\n    [formControlName]=\"column.name\"\n  ></teta-text-field>\n  } } } }\n  <ng-template #default>\n    @if (formGroup?.get(column.name)) { @switch (column.filterType) { @case (filterTypeEnum.list) {\n    <teta-select\n      class=\"row_auto\"\n      [tetaDisableControl]=\"!editable\"\n      [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n      [allowNull]=\"!column.required\"\n      [appendToBody]=\"true\"\n      [invalid]=\"controlIsInvalid(column.name)\"\n      [formControlName]=\"column.name\"\n      [options]=\"getDict()\"\n      [valueRef]=\"'id'\"\n      [textRef]=\"'name'\"\n      [multiple]=\"false\"\n    ></teta-select>\n    } @case (filterTypeEnum.date) {\n    <teta-date-picker\n      class=\"row_auto\"\n      [appendToBody]=\"true\"\n      [tetaDisableControl]=\"!editable\"\n      [invalid]=\"controlIsInvalid(column.name)\"\n      [formControlName]=\"column.name\"\n    ></teta-date-picker>\n    } @case (filterTypeEnum.boolean) {\n    <teta-toggle [tetaDisableControl]=\"!editable\" [formControlName]=\"column.name\">\n      {{ column.caption }}\n    </teta-toggle>\n    } @default {\n    <teta-text-field\n      class=\"row_auto\"\n      [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n      [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n      [placeholder]=\"column.caption\"\n      [invalid]=\"controlIsInvalid(column.name)\"\n      [tetaDisableControl]=\"!editable\"\n      [formControlName]=\"column.name\"\n    ></teta-text-field>\n    } } }\n  </ng-template>\n  @if (controlIsInvalid(column.name)) {\n  <div ngProjectAs=\"message\" class=\"color-red-50\">\n    {{ getError(column) }}\n  </div>\n  }\n</teta-input>\n}\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "teta-input", inputs: ["label", "hint", "viewType", "horizontal", "required"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SelectComponent, selector: "teta-select", inputs: ["multiple", "options", "invalid", "align", "verticalAlign", "autoClose", "autoCloseIgnore", "disabled", "itemSize", "virtual", "icon", "placeholder", "appendToBody", "allowNull", "viewType", "notFoundText", "valueRef", "textRef", "searchRef"] }, { kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "component", type: ToggleComponent, selector: "teta-toggle", inputs: ["palette", "noLabel", "disabled"] }, { kind: "component", type: TextFieldComponent, selector: "teta-text-field", inputs: ["placeholder", "leftIconName", "disabled", "onlyNumber", "decimalPart", "invalid"] }, { kind: "directive", type: DisableControlDirective, selector: "[tetaDisableControl]", inputs: ["tetaDisableControl"] }], viewProviders: [FormsUtil.formProvider] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PropertyGridItemComponent, decorators: [{
             type: Component,
@@ -6447,7 +6244,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         ToggleComponent,
                         TextFieldComponent,
                         DisableControlDirective,
-                    ], template: "@if (editable || !hideNonEditable) {\n  <teta-input [label]=\"caption\"\n              [hint]=\"column.hint\"\n              [formGroup]=\"formGroup\"\n              [horizontal]=\"horizontal\"\n              [required]=\"column.required\"\n  >\n    @if (template) {\n      <ng-container\n        *ngTemplateOutlet=\"template.template;context: {$implicit: formGroup?.get(column.name)}\"></ng-container>\n    } @else {\n      @if (formGroup?.get(column.name)) {\n        @switch (column.filterType) {\n          @case (filterTypeEnum.list) {\n            <teta-select class=\"row_auto\"\n                         [tetaDisableControl]=\"!editable\"\n                         [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n                         [allowNull]=\"!column.required\"\n                         [appendToBody]=\"true\"\n                         [invalid]=\"controlIsInvalid(column.name)\"\n                         [formControlName]=\"column.name\"\n                         [options]=\"getDict()\"\n                         [valueRef]=\"'id'\"\n                         [textRef]=\"'name'\"\n                         [multiple]=\"false\"></teta-select>\n          }\n          @case (filterTypeEnum.date) {\n            <teta-date-picker\n              class=\"row_auto\"\n              [appendToBody]=\"true\"\n              [tetaDisableControl]=\"!editable\"\n              [invalid]=\"controlIsInvalid(column.name)\"\n              [formControlName]=\"column.name\"></teta-date-picker>\n          }\n          @case (filterTypeEnum.boolean) {\n            <teta-toggle\n              [tetaDisableControl]=\"!editable\"\n              [formControlName]=\"column.name\">\n              {{ column.caption }}\n            </teta-toggle>\n          }\n          @default {\n            <teta-text-field class=\"row_auto\"\n                             [tetaDisableControl]=\"!editable\"\n                             [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n                             [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n                             [placeholder]=\"column.caption\"\n                             [invalid]=\"controlIsInvalid(column.name)\"\n                             [formControlName]=\"column.name\"></teta-text-field>\n          }\n        }\n      }\n    }\n    <ng-template #default>\n      @if (formGroup?.get(column.name)) {\n        @switch (column.filterType) {\n          @case (filterTypeEnum.list) {\n            <teta-select class=\"row_auto\"\n                         [tetaDisableControl]=\"!editable\"\n                         [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n                         [allowNull]=\"!column.required\"\n                         [appendToBody]=\"true\"\n                         [invalid]=\"controlIsInvalid(column.name)\"\n                         [formControlName]=\"column.name\"\n                         [options]=\"getDict()\"\n                         [valueRef]=\"'id'\"\n                         [textRef]=\"'name'\"\n                         [multiple]=\"false\"></teta-select>\n          }\n          @case (filterTypeEnum.date) {\n            <teta-date-picker\n              class=\"row_auto\"\n              [appendToBody]=\"true\"\n              [tetaDisableControl]=\"!editable\"\n              [invalid]=\"controlIsInvalid(column.name)\"\n              [formControlName]=\"column.name\"></teta-date-picker>\n          }\n          @case (filterTypeEnum.boolean) {\n            <teta-toggle\n              [tetaDisableControl]=\"!editable\"\n              [formControlName]=\"column.name\">\n              {{ column.caption }}\n            </teta-toggle>\n          }\n          @default {\n            <teta-text-field class=\"row_auto\"\n                             [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n                             [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n                             [placeholder]=\"column.caption\"\n                             [invalid]=\"controlIsInvalid(column.name)\"\n                             [tetaDisableControl]=\"!editable\"\n                             [formControlName]=\"column.name\"></teta-text-field>\n          }\n        }\n      }\n    </ng-template>\n    @if (controlIsInvalid(column.name)) {\n      <div\n        ngProjectAs=\"message\"\n        class=\"color-red-50\">\n        {{ getError(column) }}\n      </div>\n    }\n  </teta-input>\n}\n" }]
+                    ], template: "@if (editable || !hideNonEditable) {\n<teta-input\n  [label]=\"caption\"\n  [hint]=\"column.hint\"\n  [formGroup]=\"formGroup\"\n  [horizontal]=\"horizontal\"\n  [required]=\"column.required\"\n>\n  @if (template) {\n  <ng-container\n    *ngTemplateOutlet=\"template.template; context: { $implicit: formGroup?.get(column.name) }\"\n  ></ng-container>\n  } @else { @if (formGroup?.get(column.name)) { @switch (column.filterType) { @case (filterTypeEnum.list) {\n  <teta-select\n    class=\"row_auto\"\n    [tetaDisableControl]=\"!editable\"\n    [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n    [allowNull]=\"!column.required\"\n    [appendToBody]=\"true\"\n    [invalid]=\"controlIsInvalid(column.name)\"\n    [formControlName]=\"column.name\"\n    [options]=\"getDict()\"\n    [valueRef]=\"'id'\"\n    [textRef]=\"'name'\"\n    [multiple]=\"false\"\n  ></teta-select>\n  } @case (filterTypeEnum.date) {\n  <teta-date-picker\n    class=\"row_auto\"\n    [appendToBody]=\"true\"\n    [tetaDisableControl]=\"!editable\"\n    [invalid]=\"controlIsInvalid(column.name)\"\n    [formControlName]=\"column.name\"\n  ></teta-date-picker>\n  } @case (filterTypeEnum.boolean) {\n  <teta-toggle [tetaDisableControl]=\"!editable\" [formControlName]=\"column.name\">\n    {{ column.caption }}\n  </teta-toggle>\n  } @default {\n  <teta-text-field\n    class=\"row_auto\"\n    [tetaDisableControl]=\"!editable\"\n    [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n    [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n    [placeholder]=\"column.caption\"\n    [invalid]=\"controlIsInvalid(column.name)\"\n    [formControlName]=\"column.name\"\n  ></teta-text-field>\n  } } } }\n  <ng-template #default>\n    @if (formGroup?.get(column.name)) { @switch (column.filterType) { @case (filterTypeEnum.list) {\n    <teta-select\n      class=\"row_auto\"\n      [tetaDisableControl]=\"!editable\"\n      [searchRef]=\"getDict()?.length > 10 ? 'name' : ''\"\n      [allowNull]=\"!column.required\"\n      [appendToBody]=\"true\"\n      [invalid]=\"controlIsInvalid(column.name)\"\n      [formControlName]=\"column.name\"\n      [options]=\"getDict()\"\n      [valueRef]=\"'id'\"\n      [textRef]=\"'name'\"\n      [multiple]=\"false\"\n    ></teta-select>\n    } @case (filterTypeEnum.date) {\n    <teta-date-picker\n      class=\"row_auto\"\n      [appendToBody]=\"true\"\n      [tetaDisableControl]=\"!editable\"\n      [invalid]=\"controlIsInvalid(column.name)\"\n      [formControlName]=\"column.name\"\n    ></teta-date-picker>\n    } @case (filterTypeEnum.boolean) {\n    <teta-toggle [tetaDisableControl]=\"!editable\" [formControlName]=\"column.name\">\n      {{ column.caption }}\n    </teta-toggle>\n    } @default {\n    <teta-text-field\n      class=\"row_auto\"\n      [decimalPart]=\"column.filterType === filterTypeEnum.number ? decimalPart : null\"\n      [onlyNumber]=\"column.filterType === filterTypeEnum.number\"\n      [placeholder]=\"column.caption\"\n      [invalid]=\"controlIsInvalid(column.name)\"\n      [tetaDisableControl]=\"!editable\"\n      [formControlName]=\"column.name\"\n    ></teta-text-field>\n    } } }\n  </ng-template>\n  @if (controlIsInvalid(column.name)) {\n  <div ngProjectAs=\"message\" class=\"color-red-50\">\n    {{ getError(column) }}\n  </div>\n  }\n</teta-input>\n}\n" }]
         }], ctorParameters: () => [{ type: i1$2.TranslocoService }, { type: i2.ControlContainer, decorators: [{
                     type: Optional
                 }] }], propDecorators: { column: [{
@@ -6492,11 +6289,11 @@ class PropertyGridGroupComponent {
         return column.name;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PropertyGridGroupComponent, deps: [{ token: i2.ControlContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: PropertyGridGroupComponent, isStandalone: true, selector: "teta-property-grid-group", inputs: { column: "column", hideNonEditable: "hideNonEditable", dict: "dict", item: "item", horizontal: "horizontal", decimalPart: "decimalPart", itemTemplates: "itemTemplates" }, outputs: { controlValueChange: "controlValueChange" }, ngImport: i0, template: "<teta-expand-item>\n  <span ngProjectAs='head'>\n    {{column.caption}}\n  </span>\n  <div class=\"form-container\">\n    @for (col of column.columns; track trackColumns($index, col)) {\n      @if (col.columns?.length < 1) {\n        @if (column.editable || !hideNonEditable) {\n          <teta-property-grid-item\n            [id]=\"col.name\"\n            [dict]=\"dict\"\n            [column]=\"col\"\n            [item]=\"item\"\n            [itemTemplates]=\"itemTemplates\"\n            [decimalPart]=\"decimalPart\"\n            [hideNonEditable]=\"hideNonEditable\"\n            (controlValueChange)=\"controlValueChange.emit($event)\"\n          [horizontal]=\"horizontal\"></teta-property-grid-item>\n        }\n      }\n      @if (col.columns?.length > 0) {\n        <teta-property-grid-group [id]=\"col.name\"\n          [dict]=\"dict\"\n          [column]=\"col\"\n          [item]=\"item\"\n          [itemTemplates]=\"itemTemplates\"\n          [decimalPart]=\"decimalPart\"\n          [hideNonEditable]=\"hideNonEditable\"\n          [horizontal]=\"horizontal\"\n        (controlValueChange)=\"controlValueChange.emit($event)\"></teta-property-grid-group>\n      }\n    }\n  </div>\n</teta-expand-item>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "component", type: PropertyGridGroupComponent, selector: "teta-property-grid-group", inputs: ["column", "hideNonEditable", "dict", "item", "horizontal", "decimalPart", "itemTemplates"], outputs: ["controlValueChange"] }, { kind: "component", type: ExpandItemComponent, selector: "teta-expand-item", inputs: ["open"], outputs: ["openChange"], exportAs: ["expand-item"] }, { kind: "component", type: PropertyGridItemComponent, selector: "teta-property-grid-item", inputs: ["column", "hideNonEditable", "dict", "decimalPart", "item", "itemTemplates", "horizontal"], outputs: ["controlValueChange"] }], viewProviders: [FormsUtil.formProvider] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: PropertyGridGroupComponent, isStandalone: true, selector: "teta-property-grid-group", inputs: { column: "column", hideNonEditable: "hideNonEditable", dict: "dict", item: "item", horizontal: "horizontal", decimalPart: "decimalPart", itemTemplates: "itemTemplates" }, outputs: { controlValueChange: "controlValueChange" }, ngImport: i0, template: "<teta-expand-item>\n  <span ngProjectAs=\"head\">\n    {{ column.caption }}\n  </span>\n  <div class=\"form-container\">\n    @for (col of column.columns; track trackColumns($index, col)) { @if (col.columns?.length < 1) { @if (column.editable\n    || !hideNonEditable) {\n    <teta-property-grid-item\n      [id]=\"col.name\"\n      [dict]=\"dict\"\n      [column]=\"col\"\n      [item]=\"item\"\n      [itemTemplates]=\"itemTemplates\"\n      [decimalPart]=\"decimalPart\"\n      [hideNonEditable]=\"hideNonEditable\"\n      (controlValueChange)=\"controlValueChange.emit($event)\"\n      [horizontal]=\"horizontal\"\n    ></teta-property-grid-item>\n    } } @if (col.columns?.length > 0) {\n    <teta-property-grid-group\n      [id]=\"col.name\"\n      [dict]=\"dict\"\n      [column]=\"col\"\n      [item]=\"item\"\n      [itemTemplates]=\"itemTemplates\"\n      [decimalPart]=\"decimalPart\"\n      [hideNonEditable]=\"hideNonEditable\"\n      [horizontal]=\"horizontal\"\n      (controlValueChange)=\"controlValueChange.emit($event)\"\n    ></teta-property-grid-group>\n    } }\n  </div>\n</teta-expand-item>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "component", type: PropertyGridGroupComponent, selector: "teta-property-grid-group", inputs: ["column", "hideNonEditable", "dict", "item", "horizontal", "decimalPart", "itemTemplates"], outputs: ["controlValueChange"] }, { kind: "component", type: ExpandItemComponent, selector: "teta-expand-item", inputs: ["open"], outputs: ["openChange"], exportAs: ["expand-item"] }, { kind: "component", type: PropertyGridItemComponent, selector: "teta-property-grid-item", inputs: ["column", "hideNonEditable", "dict", "decimalPart", "item", "itemTemplates", "horizontal"], outputs: ["controlValueChange"] }], viewProviders: [FormsUtil.formProvider] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PropertyGridGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-property-grid-group', viewProviders: [FormsUtil.formProvider], standalone: true, imports: [ExpandItemComponent, PropertyGridItemComponent], template: "<teta-expand-item>\n  <span ngProjectAs='head'>\n    {{column.caption}}\n  </span>\n  <div class=\"form-container\">\n    @for (col of column.columns; track trackColumns($index, col)) {\n      @if (col.columns?.length < 1) {\n        @if (column.editable || !hideNonEditable) {\n          <teta-property-grid-item\n            [id]=\"col.name\"\n            [dict]=\"dict\"\n            [column]=\"col\"\n            [item]=\"item\"\n            [itemTemplates]=\"itemTemplates\"\n            [decimalPart]=\"decimalPart\"\n            [hideNonEditable]=\"hideNonEditable\"\n            (controlValueChange)=\"controlValueChange.emit($event)\"\n          [horizontal]=\"horizontal\"></teta-property-grid-item>\n        }\n      }\n      @if (col.columns?.length > 0) {\n        <teta-property-grid-group [id]=\"col.name\"\n          [dict]=\"dict\"\n          [column]=\"col\"\n          [item]=\"item\"\n          [itemTemplates]=\"itemTemplates\"\n          [decimalPart]=\"decimalPart\"\n          [hideNonEditable]=\"hideNonEditable\"\n          [horizontal]=\"horizontal\"\n        (controlValueChange)=\"controlValueChange.emit($event)\"></teta-property-grid-group>\n      }\n    }\n  </div>\n</teta-expand-item>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
+            args: [{ selector: 'teta-property-grid-group', viewProviders: [FormsUtil.formProvider], standalone: true, imports: [ExpandItemComponent, PropertyGridItemComponent], template: "<teta-expand-item>\n  <span ngProjectAs=\"head\">\n    {{ column.caption }}\n  </span>\n  <div class=\"form-container\">\n    @for (col of column.columns; track trackColumns($index, col)) { @if (col.columns?.length < 1) { @if (column.editable\n    || !hideNonEditable) {\n    <teta-property-grid-item\n      [id]=\"col.name\"\n      [dict]=\"dict\"\n      [column]=\"col\"\n      [item]=\"item\"\n      [itemTemplates]=\"itemTemplates\"\n      [decimalPart]=\"decimalPart\"\n      [hideNonEditable]=\"hideNonEditable\"\n      (controlValueChange)=\"controlValueChange.emit($event)\"\n      [horizontal]=\"horizontal\"\n    ></teta-property-grid-item>\n    } } @if (col.columns?.length > 0) {\n    <teta-property-grid-group\n      [id]=\"col.name\"\n      [dict]=\"dict\"\n      [column]=\"col\"\n      [item]=\"item\"\n      [itemTemplates]=\"itemTemplates\"\n      [decimalPart]=\"decimalPart\"\n      [hideNonEditable]=\"hideNonEditable\"\n      [horizontal]=\"horizontal\"\n      (controlValueChange)=\"controlValueChange.emit($event)\"\n    ></teta-property-grid-group>\n    } }\n  </div>\n</teta-expand-item>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
         }], ctorParameters: () => [{ type: i2.ControlContainer, decorators: [{
                     type: Optional
                 }] }], propDecorators: { column: [{
@@ -6551,9 +6348,9 @@ class PropertyGridComponent {
         });
     }
     onControlValueChange(event) {
-        const affected = this.columns.filter(_ => _.parentName === event.name);
+        const affected = this.columns.filter((_) => _.parentName === event.name);
         if (affected?.length) {
-            affected.forEach(item => {
+            affected.forEach((item) => {
                 const value = this.formGroup.getRawValue()[item.name];
                 if (value) {
                     const dictValue = this.getDictValue(value, item.name);
@@ -6574,19 +6371,14 @@ class PropertyGridComponent {
         return column.name;
     }
     getDictValue(value, name) {
-        return this.dict[name]?.find(_ => _.id === value);
+        return this.dict[name]?.find((_) => _.id === value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PropertyGridComponent, deps: [{ token: i2.ControlContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: PropertyGridComponent, isStandalone: true, selector: "teta-property-grid", inputs: { hideNonEditable: "hideNonEditable", columns: "columns", dict: "dict", item: "item", horizontal: "horizontal", decimalPart: "decimalPart" }, outputs: { controlValueChange: "controlValueChange" }, host: { properties: { "class.form-container": "this.formClass" } }, queries: [{ propertyName: "itemTemplates", predicate: PropertyGridItemDescriptionDirective }], ngImport: i0, template: "@if (columns?.length) {\n  @for (column of columns; track trackColumns($index, column)) {\n    @if (column.columns?.length < 1 && (getEditable(column) || !hideNonEditable)) {\n      <teta-property-grid-item\n        [dict]='dict'\n        [column]='column'\n        [item]='item'\n        [id]='column.name'\n        [itemTemplates]='itemTemplates'\n        [decimalPart]='decimalPart'\n        [formGroup]='formGroup'\n        [horizontal]='horizontal'\n        (controlValueChange)='onControlValueChange($event)'\n      [hideNonEditable]='hideNonEditable'></teta-property-grid-item>\n    }\n    @if (column.columns?.length > 0 && (getEditable(column) || !hideNonEditable)) {\n      <teta-property-grid-group\n        [id]='column.name'\n        [dict]='dict'\n        [column]='column'\n        [item]='item'\n        [itemTemplates]='itemTemplates'\n        [decimalPart]='decimalPart'\n        [formGroup]='formGroup'\n        [horizontal]='horizontal'\n        (controlValueChange)='onControlValueChange($event)'\n      [hideNonEditable]='hideNonEditable'></teta-property-grid-group>\n    }\n  }\n}\n", styles: [":host{padding:12px 8px}\n"], dependencies: [{ kind: "component", type: PropertyGridItemComponent, selector: "teta-property-grid-item", inputs: ["column", "hideNonEditable", "dict", "decimalPart", "item", "itemTemplates", "horizontal"], outputs: ["controlValueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: PropertyGridGroupComponent, selector: "teta-property-grid-group", inputs: ["column", "hideNonEditable", "dict", "item", "horizontal", "decimalPart", "itemTemplates"], outputs: ["controlValueChange"] }], viewProviders: [FormsUtil.formProvider] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: PropertyGridComponent, isStandalone: true, selector: "teta-property-grid", inputs: { hideNonEditable: "hideNonEditable", columns: "columns", dict: "dict", item: "item", horizontal: "horizontal", decimalPart: "decimalPart" }, outputs: { controlValueChange: "controlValueChange" }, host: { properties: { "class.form-container": "this.formClass" } }, queries: [{ propertyName: "itemTemplates", predicate: PropertyGridItemDescriptionDirective }], ngImport: i0, template: "@if (columns?.length) { @for (column of columns; track trackColumns($index, column)) { @if (column.columns?.length < 1\n&& (getEditable(column) || !hideNonEditable)) {\n<teta-property-grid-item\n  [dict]=\"dict\"\n  [column]=\"column\"\n  [item]=\"item\"\n  [id]=\"column.name\"\n  [itemTemplates]=\"itemTemplates\"\n  [decimalPart]=\"decimalPart\"\n  [formGroup]=\"formGroup\"\n  [horizontal]=\"horizontal\"\n  (controlValueChange)=\"onControlValueChange($event)\"\n  [hideNonEditable]=\"hideNonEditable\"\n></teta-property-grid-item>\n} @if (column.columns?.length > 0 && (getEditable(column) || !hideNonEditable)) {\n<teta-property-grid-group\n  [id]=\"column.name\"\n  [dict]=\"dict\"\n  [column]=\"column\"\n  [item]=\"item\"\n  [itemTemplates]=\"itemTemplates\"\n  [decimalPart]=\"decimalPart\"\n  [formGroup]=\"formGroup\"\n  [horizontal]=\"horizontal\"\n  (controlValueChange)=\"onControlValueChange($event)\"\n  [hideNonEditable]=\"hideNonEditable\"\n></teta-property-grid-group>\n} } }\n", styles: [":host{padding:12px 8px}\n"], dependencies: [{ kind: "component", type: PropertyGridItemComponent, selector: "teta-property-grid-item", inputs: ["column", "hideNonEditable", "dict", "decimalPart", "item", "itemTemplates", "horizontal"], outputs: ["controlValueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: PropertyGridGroupComponent, selector: "teta-property-grid-group", inputs: ["column", "hideNonEditable", "dict", "item", "horizontal", "decimalPart", "itemTemplates"], outputs: ["controlValueChange"] }], viewProviders: [FormsUtil.formProvider] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: PropertyGridComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-property-grid', viewProviders: [FormsUtil.formProvider], standalone: true, imports: [
-                        PropertyGridItemComponent,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        PropertyGridGroupComponent,
-                    ], template: "@if (columns?.length) {\n  @for (column of columns; track trackColumns($index, column)) {\n    @if (column.columns?.length < 1 && (getEditable(column) || !hideNonEditable)) {\n      <teta-property-grid-item\n        [dict]='dict'\n        [column]='column'\n        [item]='item'\n        [id]='column.name'\n        [itemTemplates]='itemTemplates'\n        [decimalPart]='decimalPart'\n        [formGroup]='formGroup'\n        [horizontal]='horizontal'\n        (controlValueChange)='onControlValueChange($event)'\n      [hideNonEditable]='hideNonEditable'></teta-property-grid-item>\n    }\n    @if (column.columns?.length > 0 && (getEditable(column) || !hideNonEditable)) {\n      <teta-property-grid-group\n        [id]='column.name'\n        [dict]='dict'\n        [column]='column'\n        [item]='item'\n        [itemTemplates]='itemTemplates'\n        [decimalPart]='decimalPart'\n        [formGroup]='formGroup'\n        [horizontal]='horizontal'\n        (controlValueChange)='onControlValueChange($event)'\n      [hideNonEditable]='hideNonEditable'></teta-property-grid-group>\n    }\n  }\n}\n", styles: [":host{padding:12px 8px}\n"] }]
+            args: [{ selector: 'teta-property-grid', viewProviders: [FormsUtil.formProvider], standalone: true, imports: [PropertyGridItemComponent, FormsModule, ReactiveFormsModule, PropertyGridGroupComponent], template: "@if (columns?.length) { @for (column of columns; track trackColumns($index, column)) { @if (column.columns?.length < 1\n&& (getEditable(column) || !hideNonEditable)) {\n<teta-property-grid-item\n  [dict]=\"dict\"\n  [column]=\"column\"\n  [item]=\"item\"\n  [id]=\"column.name\"\n  [itemTemplates]=\"itemTemplates\"\n  [decimalPart]=\"decimalPart\"\n  [formGroup]=\"formGroup\"\n  [horizontal]=\"horizontal\"\n  (controlValueChange)=\"onControlValueChange($event)\"\n  [hideNonEditable]=\"hideNonEditable\"\n></teta-property-grid-item>\n} @if (column.columns?.length > 0 && (getEditable(column) || !hideNonEditable)) {\n<teta-property-grid-group\n  [id]=\"column.name\"\n  [dict]=\"dict\"\n  [column]=\"column\"\n  [item]=\"item\"\n  [itemTemplates]=\"itemTemplates\"\n  [decimalPart]=\"decimalPart\"\n  [formGroup]=\"formGroup\"\n  [horizontal]=\"horizontal\"\n  (controlValueChange)=\"onControlValueChange($event)\"\n  [hideNonEditable]=\"hideNonEditable\"\n></teta-property-grid-group>\n} } }\n", styles: [":host{padding:12px 8px}\n"] }]
         }], ctorParameters: () => [{ type: i2.ControlContainer, decorators: [{
                     type: Optional
                 }] }], propDecorators: { formClass: [{
@@ -6680,12 +6472,9 @@ class SidebarComponent {
     }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: SidebarComponent, isStandalone: true, selector: "teta-sidebar", inputs: { position: "position", backdrop: "backdrop", open: "open", className: "className" }, outputs: { openChange: "openChange" }, host: { properties: { "style.z-index": "this.zIndex" } }, ngImport: i0, template: "@if (backdrop && open) {\n  <div\n    [@sidebar]\n    (click)=\"setOpen(false)\"\n  class=\"sidebar-backdrop\"></div>\n}\n@if (open) {\n  <div class=\"sidebar\"\n    [@sidebar]\n    [ngClass]=\"className\"\n    [class.sidebar-top]=\"position === sidebarPosition.top\"\n    [class.sidebar-bottom]=\"position === sidebarPosition.bottom\"\n    [class.sidebar-left]=\"position === sidebarPosition.left\"\n    [class.sidebar-right]=\"position === sidebarPosition.right\"\n    >\n    <ng-content></ng-content>\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: SidebarComponent, isStandalone: true, selector: "teta-sidebar", inputs: { position: "position", backdrop: "backdrop", open: "open", className: "className" }, outputs: { openChange: "openChange" }, host: { properties: { "style.z-index": "this.zIndex" } }, ngImport: i0, template: "@if (backdrop && open) {\n<div [@sidebar] (click)=\"setOpen(false)\" class=\"sidebar-backdrop\"></div>\n} @if (open) {\n<div\n  class=\"sidebar\"\n  [@sidebar]\n  [ngClass]=\"className\"\n  [class.sidebar-top]=\"position === sidebarPosition.top\"\n  [class.sidebar-bottom]=\"position === sidebarPosition.bottom\"\n  [class.sidebar-left]=\"position === sidebarPosition.left\"\n  [class.sidebar-right]=\"position === sidebarPosition.right\"\n>\n  <ng-content></ng-content>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
             trigger('sidebar', [
-                transition('void => *', [
-                    style({ opacity: '0' }),
-                    animate(300, style({ opacity: '1' })),
-                ]),
+                transition('void => *', [style({ opacity: '0' }), animate(300, style({ opacity: '1' }))]),
                 transition('* => void', [animate(300, style({ opacity: '0' }))]),
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -6694,13 +6483,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Component,
             args: [{ selector: 'teta-sidebar', changeDetection: ChangeDetectionStrategy.OnPush, animations: [
                         trigger('sidebar', [
-                            transition('void => *', [
-                                style({ opacity: '0' }),
-                                animate(300, style({ opacity: '1' })),
-                            ]),
+                            transition('void => *', [style({ opacity: '0' }), animate(300, style({ opacity: '1' }))]),
                             transition('* => void', [animate(300, style({ opacity: '0' }))]),
                         ]),
-                    ], standalone: true, imports: [NgClass], template: "@if (backdrop && open) {\n  <div\n    [@sidebar]\n    (click)=\"setOpen(false)\"\n  class=\"sidebar-backdrop\"></div>\n}\n@if (open) {\n  <div class=\"sidebar\"\n    [@sidebar]\n    [ngClass]=\"className\"\n    [class.sidebar-top]=\"position === sidebarPosition.top\"\n    [class.sidebar-bottom]=\"position === sidebarPosition.bottom\"\n    [class.sidebar-left]=\"position === sidebarPosition.left\"\n    [class.sidebar-right]=\"position === sidebarPosition.right\"\n    >\n    <ng-content></ng-content>\n  </div>\n}\n" }]
+                    ], standalone: true, imports: [NgClass], template: "@if (backdrop && open) {\n<div [@sidebar] (click)=\"setOpen(false)\" class=\"sidebar-backdrop\"></div>\n} @if (open) {\n<div\n  class=\"sidebar\"\n  [@sidebar]\n  [ngClass]=\"className\"\n  [class.sidebar-top]=\"position === sidebarPosition.top\"\n  [class.sidebar-bottom]=\"position === sidebarPosition.bottom\"\n  [class.sidebar-left]=\"position === sidebarPosition.left\"\n  [class.sidebar-right]=\"position === sidebarPosition.right\"\n>\n  <ng-content></ng-content>\n</div>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { position: [{
                 type: Input
             }], backdrop: [{
@@ -6730,7 +6516,7 @@ class SwitchService {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SwitchService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: 'root',
                 }]
         }], ctorParameters: () => [] });
@@ -6761,18 +6547,15 @@ class SwitchComponent {
         this.svc.setValue(model);
         this.cdr.markForCheck();
     }
-    onChange(_) {
-    }
-    onTouched() {
-    }
+    onChange(_) { }
+    onTouched() { }
     registerOnChange(fn) {
         this.onChange = fn;
     }
     registerOnTouched(fn) {
         this.onTouched = fn;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     ngOnDestroy() {
         this._alive = false;
     }
@@ -6795,8 +6578,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class SwitchButtonComponent {
     get getClass() {
         const result = [this.class, 'switch-button'];
-        if (this.svcValue === this.value ||
-            (this.svcValue instanceof Array && this.svcValue.indexOf(this.value) >= 0)) {
+        if (this.svcValue === this.value || (this.svcValue instanceof Array && this.svcValue.indexOf(this.value) >= 0)) {
             result.push('switch-button_active');
         }
         return result.join(' ');
@@ -6989,9 +6771,7 @@ class DateUtil {
         return res;
     }
     static toISOString(date) {
-        return (new Date(date - new Date().getTimezoneOffset() * 60000)
-            .toISOString()
-            .slice(0, -5) + 'Z');
+        return new Date(date - new Date().getTimezoneOffset() * 60000).toISOString().slice(0, -5) + 'Z';
     }
     static isValidDate(date) {
         return date instanceof Date && !isNaN(date.getTime());
@@ -7120,32 +6900,25 @@ class StateUtil {
     }
     static hasFilteredColumns(state) {
         let hasFilters = false;
-        if (state.stringFilters &&
-            state.stringFilters.some((filter) => filter.value && filter.value.length)) {
+        if (state.stringFilters && state.stringFilters.some((filter) => filter.value && filter.value.length)) {
             hasFilters = true;
         }
-        if (state.listFilters &&
-            state.listFilters.some((filter) => filter.value && filter.value.length)) {
+        if (state.listFilters && state.listFilters.some((filter) => filter.value && filter.value.length)) {
             hasFilters = true;
         }
         if (state.numericFilters &&
             state.numericFilters.some((filter) => filter &&
                 filter.value &&
-                ((filter.value.lessThan !== null &&
-                    filter.value.lessThan !== undefined) ||
-                    (filter.value.greaterThan !== null &&
-                        filter.value.greaterThan !== undefined) ||
-                    (filter.value.equalsTo !== null &&
-                        filter.value.equalsTo !== undefined)))) {
+                ((filter.value.lessThan !== null && filter.value.lessThan !== undefined) ||
+                    (filter.value.greaterThan !== null && filter.value.greaterThan !== undefined) ||
+                    (filter.value.equalsTo !== null && filter.value.equalsTo !== undefined)))) {
             hasFilters = true;
         }
         if (state.dateFilters &&
             state.dateFilters.some((filter) => filter &&
                 filter.value &&
-                ((filter.value.lessThan !== null &&
-                    filter.value.lessThan !== undefined) ||
-                    (filter.value.greaterThan !== null &&
-                        filter.value.greaterThan !== undefined)))) {
+                ((filter.value.lessThan !== null && filter.value.lessThan !== undefined) ||
+                    (filter.value.greaterThan !== null && filter.value.greaterThan !== undefined)))) {
             hasFilters = true;
         }
         return hasFilters;
@@ -7186,12 +6959,9 @@ class StateUtil {
                     const filter = state.numericFilters.find((x) => x.field === column.filterField);
                     if (filter &&
                         filter.value &&
-                        ((filter.value.lessThan !== null &&
-                            filter.value.lessThan !== undefined) ||
-                            (filter.value.greaterThan !== null &&
-                                filter.value.greaterThan !== undefined) ||
-                            (filter.value.equalsTo !== null &&
-                                filter.value.equalsTo !== undefined))) {
+                        ((filter.value.lessThan !== null && filter.value.lessThan !== undefined) ||
+                            (filter.value.greaterThan !== null && filter.value.greaterThan !== undefined) ||
+                            (filter.value.equalsTo !== null && filter.value.equalsTo !== undefined))) {
                         filtered = true;
                     }
                 }
@@ -7201,10 +6971,8 @@ class StateUtil {
                     const filter = state.dateFilters.find((x) => x.field === column.filterField);
                     if (filter &&
                         filter.value &&
-                        ((filter.value.lessThan !== null &&
-                            filter.value.lessThan !== undefined) ||
-                            (filter.value.greaterThan !== null &&
-                                filter.value.greaterThan !== undefined))) {
+                        ((filter.value.lessThan !== null && filter.value.lessThan !== undefined) ||
+                            (filter.value.greaterThan !== null && filter.value.greaterThan !== undefined))) {
                         filtered = true;
                     }
                 }
@@ -7326,7 +7094,7 @@ class TableService {
         this.scrollIndex = this._scrollIndex.asObservable();
     }
     setData(data) {
-        this._displayData.next(data?.map(item => new TableRow({
+        this._displayData.next(data?.map((item) => new TableRow({
             data: item,
         })) ?? []);
     }
@@ -7337,13 +7105,8 @@ class TableService {
         this._filterOptions.next(filterOptions);
     }
     setColumns(columns) {
-        this.initialColumns = columns ? columns.map(_ => new TableColumn(_)) : [];
-        const excludeKeys = [
-            'editable',
-            'cellComponent',
-            'headCellComponent',
-            'headDropdownConfig',
-        ];
+        this.initialColumns = columns ? columns.map((_) => new TableColumn(_)) : [];
+        const excludeKeys = ['editable', 'cellComponent', 'headCellComponent', 'headDropdownConfig'];
         this.initialColumnsHash = objectHash(this.initialColumns, {
             algorithm: 'sha1',
             ignoreUnknown: true,
@@ -7371,7 +7134,7 @@ class TableService {
         if (this._columnsCookieName) {
             localStorage.setItem(this._columnsCookieName, JSON.stringify({
                 hash: this.initialColumnsHash,
-                columns: this.displayColumns.map(_ => new TableColumnStore(_)),
+                columns: this.displayColumns.map((_) => new TableColumnStore(_)),
             }));
         }
     }
@@ -7381,7 +7144,7 @@ class TableService {
         }
     }
     setDisplayColumns(columns) {
-        this.displayColumns = columns ? columns.map(_ => new TableColumn(_)) : [];
+        this.displayColumns = columns ? columns.map((_) => new TableColumn(_)) : [];
         this._columns.next(this.displayColumns);
     }
     restoreColumns() {
@@ -7395,7 +7158,7 @@ class TableService {
     }
     restoreColumnsState(columns) {
         return columns.map((column) => {
-            const found = ArrayUtil.findRecursive(this.initialColumns, item => item.name === column.name, 'columns');
+            const found = ArrayUtil.findRecursive(this.initialColumns, (item) => item.name === column.name, 'columns');
             const resultColumn = new TableColumn(found);
             resultColumn.width = column.width;
             resultColumn.flex = column.flex;
@@ -7419,9 +7182,7 @@ class TableService {
     }
     restoreState() {
         let state;
-        if (this._cookieName &&
-            this._cookieName?.length > 0 &&
-            FilterState.restore(this._cookieName)) {
+        if (this._cookieName && this._cookieName?.length > 0 && FilterState.restore(this._cookieName)) {
             let newState = Object.assign(this._state.value, FilterState.restore(this._cookieName));
             newState = DateUtil.convertDateStringsToDates(newState);
             state = new FilterState(newState);
@@ -7515,7 +7276,7 @@ class TableService {
     lockPreviousColumns(column, element) {
         const flat = ArrayUtil.flatten(this.displayColumns, 'columns', true).sort((a, b) => Number(b.locked) - Number(a.locked));
         const index = flat.indexOf(column);
-        const previous = flat.slice(0, index).filter(_ => _.flex > 0);
+        const previous = flat.slice(0, index).filter((_) => _.flex > 0);
         if (previous?.length > 0) {
             const tableElement = this.getTableElement(element);
             previous.forEach((item) => {
@@ -7544,7 +7305,7 @@ class TableService {
     autosizeAllColumns(target) {
         const tableElement = this.getTableElement(target);
         const flat = ArrayUtil.flatten(this.displayColumns, 'columns', true);
-        flat.forEach(col => this.setColumnAutoWidth(col, tableElement));
+        flat.forEach((col) => this.setColumnAutoWidth(col, tableElement));
         this._columns.next(this.displayColumns);
         this.saveColumnsState();
     }
@@ -7590,23 +7351,20 @@ class TableService {
         }
     }
     startEditCell(cellEvent) {
-        if (this._currentEditCell?.column !== cellEvent?.column ||
-            this._currentEditCell?.row !== cellEvent?.row) {
+        if (this._currentEditCell?.column !== cellEvent?.column || this._currentEditCell?.row !== cellEvent?.row) {
             if (this._currentEditCell != null) {
                 this._editCellStop.next(this._currentEditCell);
             }
             const column = this.getColumnByName(cellEvent?.column);
-            if (boolOrFuncCallback(this.rowEditable)(this.getRowByIndex(cellEvent?.row)?.data)
-                &&
-                    boolOrFuncCallback(column?.editable)({
-                        row: this.getRowByIndex(cellEvent?.row)?.data,
-                        column: column,
-                    })) {
+            if (boolOrFuncCallback(this.rowEditable)(this.getRowByIndex(cellEvent?.row)?.data) &&
+                boolOrFuncCallback(column?.editable)({
+                    row: this.getRowByIndex(cellEvent?.row)?.data,
+                    column: column,
+                })) {
                 this._editCellStart.next(cellEvent);
                 this._currentEditCell = cellEvent;
                 const key = cellEvent?.event?.key;
-                if (key &&
-                    (key.length === 1 || (key === 'Delete' && !column.required))) {
+                if (key && (key.length === 1 || (key === 'Delete' && !column.required))) {
                     this.clearValue(cellEvent);
                 }
             }
@@ -7620,23 +7378,23 @@ class TableService {
     }
     selectOrDeselectRow(row) {
         if (this._selectedRows.value.indexOf(row) >= 0) {
-            this._selectedRows.next(this._selectedRows.value.filter(_ => _ !== row));
+            this._selectedRows.next(this._selectedRows.value.filter((_) => _ !== row));
         }
         else {
             this._selectedRows.next([...this._selectedRows.value, row]);
         }
     }
     selectRange(row) {
-        const index = this._displayData.value.findIndex(_ => _.data === row);
+        const index = this._displayData.value.findIndex((_) => _.data === row);
         let minIndex = this._selectedRows.value.reduce((prev, curr) => {
-            const newIndex = this._displayData.value.findIndex(_ => _.data === curr);
+            const newIndex = this._displayData.value.findIndex((_) => _.data === curr);
             if (newIndex < prev) {
                 return newIndex;
             }
             return prev;
         }, this._displayData.value.length);
         let maxIndex = this._selectedRows.value.reduce((prev, curr) => {
-            const newIndex = this._displayData.value.findIndex(_ => _.data === curr);
+            const newIndex = this._displayData.value.findIndex((_) => _.data === curr);
             if (newIndex > prev) {
                 return newIndex;
             }
@@ -7651,9 +7409,7 @@ class TableService {
         if (minIndex < index && index < maxIndex) {
             maxIndex = index;
         }
-        this._selectedRows.next([
-            ...this._displayData.value.slice(minIndex, maxIndex + 1).map(_ => _.data),
-        ]);
+        this._selectedRows.next([...this._displayData.value.slice(minIndex, maxIndex + 1).map((_) => _.data)]);
     }
     selectRow(row) {
         if (this.selectType === SelectType.none) {
@@ -7665,10 +7421,10 @@ class TableService {
         if (this.selectType === SelectType.none) {
             return;
         }
-        this._selectedRows.next(this._selectedRows.value.filter(_ => _ !== row));
+        this._selectedRows.next(this._selectedRows.value.filter((_) => _ !== row));
     }
     selectAll() {
-        this._selectedRows.next(this._displayData.value.map(_ => _.data));
+        this._selectedRows.next(this._displayData.value.map((_) => _.data));
     }
     deselectAll() {
         this._selectedRows.next([]);
@@ -7676,12 +7432,10 @@ class TableService {
     allRowsSelected() {
         if (this._displayData.value?.length &&
             this._selectedRows.value?.length &&
-            this._displayData.value.every(_ => this._selectedRows.value.findIndex(selected => selected === _.data) >=
-                0)) {
+            this._displayData.value.every((_) => this._selectedRows.value.findIndex((selected) => selected === _.data) >= 0)) {
             return true;
         }
-        else if (this._selectedRows.value == null ||
-            this._selectedRows.value.length === 0) {
+        else if (this._selectedRows.value == null || this._selectedRows.value.length === 0) {
             return false;
         }
         return null;
@@ -7698,8 +7452,7 @@ class TableService {
     }
     setValue(cellValue) {
         let value;
-        if (typeof cellValue.row === 'object' &&
-            typeof cellValue.column === 'object') {
+        if (typeof cellValue.row === 'object' && typeof cellValue.column === 'object') {
             value = {
                 row: this.getRowIndex(cellValue.row.data),
                 column: cellValue.column.name,
@@ -7718,7 +7471,7 @@ class TableService {
         return undefined;
     }
     getRowIndex(row) {
-        return this._displayData.value.findIndex(_ => _.data === row);
+        return this._displayData.value.findIndex((_) => _.data === row);
     }
     getEventCell(event) {
         return event.composedPath().find((target) => {
@@ -7800,9 +7553,7 @@ class TableService {
         const columns = this.getFlatColumns();
         const colIndex = columns.findIndex((col) => col.name === coords?.column);
         const rowIndex = coords?.row;
-        if (colIndex >= 0 &&
-            rowIndex >= 0 &&
-            rowIndex < this._displayData.value.length - 1) {
+        if (colIndex >= 0 && rowIndex >= 0 && rowIndex < this._displayData.value.length - 1) {
             return {
                 column: columns[colIndex]?.name,
                 row: rowIndex + 1,
@@ -7823,14 +7574,14 @@ class TableService {
         return null;
     }
     getColumnByName(columnName) {
-        return ArrayUtil.findRecursive(this.displayColumns, iterableNode => columnName === iterableNode.name, 'columns');
+        return ArrayUtil.findRecursive(this.displayColumns, (iterableNode) => columnName === iterableNode.name, 'columns');
     }
     scrollToIndex(index) {
         this._scrollIndex.next(null);
         this._scrollIndex.next(index);
     }
     getVisibleColumns() {
-        const visible = ArrayUtil.flatten(this._columns.value, 'columns', true).filter(_ => this._hiddenColumns.value.indexOf(_.name) < 0);
+        const visible = ArrayUtil.flatten(this._columns.value, 'columns', true).filter((_) => this._hiddenColumns.value.indexOf(_.name) < 0);
         return visible.sort((a, b) => Number(b.locked) - Number(a.locked));
     }
     getCellInstance(coords) {
@@ -7845,7 +7596,7 @@ class TableService {
         return ArrayUtil.flatten(this.displayColumns, 'columns', true).sort((a, b) => Number(b.locked) - Number(a.locked));
     }
     findParent(column, columns) {
-        const found = columns.find(x => x.name === column.name);
+        const found = columns.find((x) => x.name === column.name);
         if (found !== null && found !== undefined) {
             return columns;
         }
@@ -7861,7 +7612,7 @@ class TableService {
         return null;
     }
     findParentColumn(column, columns) {
-        const found = columns.find(x => x.columns.indexOf(column) >= 0);
+        const found = columns.find((x) => x.columns.indexOf(column) >= 0);
         if (found !== null && found !== undefined) {
             return found;
         }
@@ -7882,13 +7633,13 @@ class TableService {
     setColumnAutoWidth(column, table) {
         const cells = table.querySelectorAll(`teta-cell[data-column="${column.name}"] .cell-text`);
         let maxWidth = 0;
-        cells.forEach(cell => {
+        cells.forEach((cell) => {
             if (cell.scrollWidth > maxWidth) {
                 maxWidth = cell.scrollWidth;
             }
         });
         const aggCells = table.querySelectorAll(`.aggregate-cell[data-column="${column.name}"] .cell-text`);
-        aggCells?.forEach(cell => {
+        aggCells?.forEach((cell) => {
             if (cell.scrollWidth > maxWidth) {
                 maxWidth = cell.scrollWidth;
             }
@@ -7984,9 +7735,7 @@ class CellComponentBase {
     }
     ngOnInit() {
         this.init();
-        this.formGroup?.controls[this.column.name]?.valueChanges
-            .pipe(takeWhile(() => this._alive))
-            .subscribe(value => {
+        this.formGroup?.controls[this.column.name]?.valueChanges.pipe(takeWhile(() => this._alive)).subscribe((value) => {
             this.formGroup.updateValueAndValidity();
             this.row.valid = this.formGroup?.valid;
             this.row.data[this.column.name] = this.control.value;
@@ -7997,9 +7746,7 @@ class CellComponentBase {
         });
     }
     init() {
-        this.svc.editRowStart
-            .pipe(takeWhile(_ => this._alive))
-            .subscribe((cell) => {
+        this.svc.editRowStart.pipe(takeWhile((_) => this._alive)).subscribe((cell) => {
             if (this.index === cell?.row && !this._edit) {
                 this.start(cell, 'row');
             }
@@ -8007,24 +7754,16 @@ class CellComponentBase {
                 this.stop();
             }
         });
-        this.svc.editCellStart
-            .pipe(takeWhile(_ => this._alive))
-            .subscribe((cell) => {
-            if (this.index === cell?.row &&
-                this.column.name === cell?.column &&
-                !this._edit) {
+        this.svc.editCellStart.pipe(takeWhile((_) => this._alive)).subscribe((cell) => {
+            if (this.index === cell?.row && this.column.name === cell?.column && !this._edit) {
                 this.start(cell, 'cell');
             }
-            if ((this.index !== cell?.row || this.column.name !== cell?.column) &&
-                this._edit) {
+            if ((this.index !== cell?.row || this.column.name !== cell?.column) && this._edit) {
                 this.stop();
             }
         });
-        this.svc.valueSet
-            .pipe(takeWhile(_ => this._alive))
-            .subscribe((cellValue) => {
-            if (this.index === cellValue.row &&
-                this.column.name === cellValue.column) {
+        this.svc.valueSet.pipe(takeWhile((_) => this._alive)).subscribe((cellValue) => {
+            if (this.index === cellValue.row && this.column.name === cellValue.column) {
                 this.row.data[this.column.name] = cellValue.value;
                 this.setupControl();
                 this.formGroup.updateValueAndValidity();
@@ -8102,16 +7841,11 @@ class NumericCellComponent extends CellComponentBase {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: NumericCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: NumericCellComponent, isStandalone: true, selector: "teta-numeric-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [class.cell-text_disabled]=\"!editable\">\n  {{control?.value | tetaNumber : 2}}\n</span>\n@if (edit) {\n  <input #input\n    [tetaOnlyNumber]=\"true\"\n    type=\"text\"\n    class=\"input row_auto border-radius-0\"\n    (keydown.enter)='input.blur()'\n    [formControl]=\"control\"/>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: OnlyNumberDirective, selector: "[tetaOnlyNumber]", inputs: ["tetaOnlyNumber", "allowDecimals", "allowSign", "decimalSeparator", "commaSeparator", "onlyPositive"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: NumberPipe, name: "tetaNumber" }], viewProviders: [FormsUtil.formProvider], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: NumericCellComponent, isStandalone: true, selector: "teta-numeric-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value | tetaNumber : 2 }}\n</span>\n@if (edit) {\n<input\n  #input\n  [tetaOnlyNumber]=\"true\"\n  type=\"text\"\n  class=\"input row_auto border-radius-0\"\n  (keydown.enter)=\"input.blur()\"\n  [formControl]=\"control\"\n/>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: OnlyNumberDirective, selector: "[tetaOnlyNumber]", inputs: ["tetaOnlyNumber", "allowDecimals", "allowSign", "decimalSeparator", "commaSeparator", "onlyPositive"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: NumberPipe, name: "tetaNumber" }], viewProviders: [FormsUtil.formProvider], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: NumericCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-numeric-cell', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [FormsUtil.formProvider], standalone: true, imports: [
-                        FormsModule,
-                        OnlyNumberDirective,
-                        ReactiveFormsModule,
-                        NumberPipe,
-                    ], template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [class.cell-text_disabled]=\"!editable\">\n  {{control?.value | tetaNumber : 2}}\n</span>\n@if (edit) {\n  <input #input\n    [tetaOnlyNumber]=\"true\"\n    type=\"text\"\n    class=\"input row_auto border-radius-0\"\n    (keydown.enter)='input.blur()'\n    [formControl]=\"control\"/>\n}\n" }]
+            args: [{ selector: 'teta-numeric-cell', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [FormsUtil.formProvider], standalone: true, imports: [FormsModule, OnlyNumberDirective, ReactiveFormsModule, NumberPipe], template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value | tetaNumber : 2 }}\n</span>\n@if (edit) {\n<input\n  #input\n  [tetaOnlyNumber]=\"true\"\n  type=\"text\"\n  class=\"input row_auto border-radius-0\"\n  (keydown.enter)=\"input.blur()\"\n  [formControl]=\"control\"\n/>\n}\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input', { static: false }]
@@ -8138,16 +7872,11 @@ class DateCellComponent extends CellComponentBase {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateCellComponent, isStandalone: true, selector: "teta-date-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class='cell-text'\n  [class.cell-text_disabled]='!editable'>\n  {{control?.value | date : 'dd.MM.yyyy'}}\n</span>\n@if (edit) {\n  <teta-date-picker class='datepicker-table'\n    #input\n    [allowNull]='!column.required'\n    [appendToBody]='true'\n    [showTime]='false'\n  [formControl]='control'></teta-date-picker>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateCellComponent, isStandalone: true, selector: "teta-date-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value | date : 'dd.MM.yyyy' }}\n</span>\n@if (edit) {\n<teta-date-picker\n  class=\"datepicker-table\"\n  #input\n  [allowNull]=\"!column.required\"\n  [appendToBody]=\"true\"\n  [showTime]=\"false\"\n  [formControl]=\"control\"\n></teta-date-picker>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-date-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        DatePickerComponent,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        DatePipe,
-                    ], template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class='cell-text'\n  [class.cell-text_disabled]='!editable'>\n  {{control?.value | date : 'dd.MM.yyyy'}}\n</span>\n@if (edit) {\n  <teta-date-picker class='datepicker-table'\n    #input\n    [allowNull]='!column.required'\n    [appendToBody]='true'\n    [showTime]='false'\n  [formControl]='control'></teta-date-picker>\n}\n" }]
+            args: [{ selector: 'teta-date-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DatePickerComponent, FormsModule, ReactiveFormsModule, DatePipe], template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value | date : 'dd.MM.yyyy' }}\n</span>\n@if (edit) {\n<teta-date-picker\n  class=\"datepicker-table\"\n  #input\n  [allowNull]=\"!column.required\"\n  [appendToBody]=\"true\"\n  [showTime]=\"false\"\n  [formControl]=\"control\"\n></teta-date-picker>\n}\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input', { static: false }]
@@ -8158,7 +7887,7 @@ class ListCellComponent extends CellComponentBase {
         if (this.column?.parentName?.length > 0) {
             const parentValue = this.row.data[this.column.parentName];
             if (parentValue) {
-                return this.filterOptions.filter(_ => _.parentId === parentValue);
+                return this.filterOptions.filter((_) => _.parentId === parentValue);
             }
         }
         return this.filterOptions;
@@ -8184,27 +7913,21 @@ class ListCellComponent extends CellComponentBase {
         super.ngOnInit();
     }
     getValue(value) {
-        if (this.filterOptions === null ||
-            this.filterOptions === undefined ||
-            !(this.filterOptions instanceof Array)) {
+        if (this.filterOptions === null || this.filterOptions === undefined || !(this.filterOptions instanceof Array)) {
             return '';
         }
-        const item = this.filterOptions.find(option => option.id === value);
+        const item = this.filterOptions.find((option) => option.id === value);
         if (item === null || item === undefined) {
             return '';
         }
         return item.name;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ListCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ListCellComponent, isStandalone: true, selector: "teta-list-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class='cell-text'\n  [class.cell-text_disabled]='!editable'>\n  {{getValue(control.value)}}\n</span>\n@if (edit) {\n  <teta-select #input\n    class='row_auto select-table'\n    [allowNull]='!column.required'\n    [verticalAlign]='verticalAlign.auto'\n    [appendToBody]='true'\n    [options]='displayFilterOptions'\n    [valueRef]=\"'id'\"\n    [textRef]=\"'name'\"\n    [searchRef]=\"displayFilterOptions?.length > 20 ? 'name' : ''\"\n    [formControl]='control'>\n  </teta-select>\n}\n", styles: [""], dependencies: [{ kind: "component", type: SelectComponent, selector: "teta-select", inputs: ["multiple", "options", "invalid", "align", "verticalAlign", "autoClose", "autoCloseIgnore", "disabled", "itemSize", "virtual", "icon", "placeholder", "appendToBody", "allowNull", "viewType", "notFoundText", "valueRef", "textRef", "searchRef"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: ListCellComponent, isStandalone: true, selector: "teta-list-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ getValue(control.value) }}\n</span>\n@if (edit) {\n<teta-select\n  #input\n  class=\"row_auto select-table\"\n  [allowNull]=\"!column.required\"\n  [verticalAlign]=\"verticalAlign.auto\"\n  [appendToBody]=\"true\"\n  [options]=\"displayFilterOptions\"\n  [valueRef]=\"'id'\"\n  [textRef]=\"'name'\"\n  [searchRef]=\"displayFilterOptions?.length > 20 ? 'name' : ''\"\n  [formControl]=\"control\"\n>\n</teta-select>\n}\n", styles: [""], dependencies: [{ kind: "component", type: SelectComponent, selector: "teta-select", inputs: ["multiple", "options", "invalid", "align", "verticalAlign", "autoClose", "autoCloseIgnore", "disabled", "itemSize", "virtual", "icon", "placeholder", "appendToBody", "allowNull", "viewType", "notFoundText", "valueRef", "textRef", "searchRef"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ListCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-list-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        SelectComponent,
-                        FormsModule,
-                        ReactiveFormsModule,
-                    ], template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class='cell-text'\n  [class.cell-text_disabled]='!editable'>\n  {{getValue(control.value)}}\n</span>\n@if (edit) {\n  <teta-select #input\n    class='row_auto select-table'\n    [allowNull]='!column.required'\n    [verticalAlign]='verticalAlign.auto'\n    [appendToBody]='true'\n    [options]='displayFilterOptions'\n    [valueRef]=\"'id'\"\n    [textRef]=\"'name'\"\n    [searchRef]=\"displayFilterOptions?.length > 20 ? 'name' : ''\"\n    [formControl]='control'>\n  </teta-select>\n}\n" }]
+            args: [{ selector: 'teta-list-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [SelectComponent, FormsModule, ReactiveFormsModule], template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ getValue(control.value) }}\n</span>\n@if (edit) {\n<teta-select\n  #input\n  class=\"row_auto select-table\"\n  [allowNull]=\"!column.required\"\n  [verticalAlign]=\"verticalAlign.auto\"\n  [appendToBody]=\"true\"\n  [options]=\"displayFilterOptions\"\n  [valueRef]=\"'id'\"\n  [textRef]=\"'name'\"\n  [searchRef]=\"displayFilterOptions?.length > 20 ? 'name' : ''\"\n  [formControl]=\"control\"\n>\n</teta-select>\n}\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input', { static: false }]
@@ -8231,15 +7954,11 @@ class StringCellComponent extends CellComponentBase {
         this.cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: StringCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: StringCellComponent, isStandalone: true, selector: "teta-string-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [tetaHint]=\"row[column.name]\"\n  [align]=\"align.auto\"\n  [appendToBody]=\"true\"\n  [overflownOnly]=\"true\"\n  [class.cell-text_disabled]=\"!editable\">\n  {{control.value}}\n</span>\n@if (edit) {\n  <input #input\n    type=\"text\"\n    class=\"input row_auto border-radius-0\"\n    (keydown.enter)='input.blur()'\n    [formControl]='control'/>\n}\n\n", styles: [""], dependencies: [{ kind: "directive", type: HintDirective, selector: "[tetaHint]", inputs: ["tetaHint", "align", "verticalAlign", "delay", "viewType", "overflownOnly"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: StringCellComponent, isStandalone: true, selector: "teta-string-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span\n  [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [tetaHint]=\"row[column.name]\"\n  [align]=\"align.auto\"\n  [appendToBody]=\"true\"\n  [overflownOnly]=\"true\"\n  [class.cell-text_disabled]=\"!editable\"\n>\n  {{ control.value }}\n</span>\n@if (edit) {\n<input\n  #input\n  type=\"text\"\n  class=\"input row_auto border-radius-0\"\n  (keydown.enter)=\"input.blur()\"\n  [formControl]=\"control\"\n/>\n}\n", styles: [""], dependencies: [{ kind: "directive", type: HintDirective, selector: "[tetaHint]", inputs: ["tetaHint", "align", "verticalAlign", "delay", "viewType", "overflownOnly"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: StringCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-string-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        HintDirective,
-                        FormsModule,
-                        ReactiveFormsModule,
-                    ], template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [tetaHint]=\"row[column.name]\"\n  [align]=\"align.auto\"\n  [appendToBody]=\"true\"\n  [overflownOnly]=\"true\"\n  [class.cell-text_disabled]=\"!editable\">\n  {{control.value}}\n</span>\n@if (edit) {\n  <input #input\n    type=\"text\"\n    class=\"input row_auto border-radius-0\"\n    (keydown.enter)='input.blur()'\n    [formControl]='control'/>\n}\n\n" }]
+            args: [{ selector: 'teta-string-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HintDirective, FormsModule, ReactiveFormsModule], template: "<span\n  [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [tetaHint]=\"row[column.name]\"\n  [align]=\"align.auto\"\n  [appendToBody]=\"true\"\n  [overflownOnly]=\"true\"\n  [class.cell-text_disabled]=\"!editable\"\n>\n  {{ control.value }}\n</span>\n@if (edit) {\n<input\n  #input\n  type=\"text\"\n  class=\"input row_auto border-radius-0\"\n  (keydown.enter)=\"input.blur()\"\n  [formControl]=\"control\"\n/>\n}\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input', { static: false }]
@@ -8266,15 +7985,11 @@ class BooleanCellComponent extends CellComponentBase {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: BooleanCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: BooleanCellComponent, isStandalone: true, selector: "teta-boolean-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value }}\n</span>\n@if (edit) {\n  <teta-checkbox\n    #input\n    [binary]=\"true\"\n    [formControl]='control'\n  ></teta-checkbox>\n}\n", styles: [""], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: BooleanCellComponent, isStandalone: true, selector: "teta-boolean-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value }}\n</span>\n@if (edit) {\n<teta-checkbox #input [binary]=\"true\" [formControl]=\"control\"></teta-checkbox>\n}\n", styles: [""], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: BooleanCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-boolean-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        CheckboxComponent,
-                        FormsModule,
-                        ReactiveFormsModule,
-                    ], template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class=\"cell-text\"\n  [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value }}\n</span>\n@if (edit) {\n  <teta-checkbox\n    #input\n    [binary]=\"true\"\n    [formControl]='control'\n  ></teta-checkbox>\n}\n" }]
+            args: [{ selector: 'teta-boolean-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckboxComponent, FormsModule, ReactiveFormsModule], template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value }}\n</span>\n@if (edit) {\n<teta-checkbox #input [binary]=\"true\" [formControl]=\"control\"></teta-checkbox>\n}\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input', { static: false }]
@@ -8287,9 +8002,7 @@ const cellComponentsMap = new Map()
     .set(FilterType.string, StringCellComponent)
     .set(FilterType.boolean, BooleanCellComponent)
     .set(FilterType.custom, StringCellComponent);
-const getCellComponent = (column) => cellComponentsMap.has(column.filterType)
-    ? cellComponentsMap.get(column.filterType)
-    : StringCellComponent;
+const getCellComponent = (column) => cellComponentsMap.has(column.filterType) ? cellComponentsMap.get(column.filterType) : StringCellComponent;
 class CellHostComponent {
     constructor(viewContainerRef) {
@@ -8345,11 +8058,11 @@ class CellComponent {
         this.tableCellClass = true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: CellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: CellComponent, isStandalone: true, selector: "teta-cell", inputs: { column: "column", filterOptions: "filterOptions", dict: "dict", row: "row" }, host: { properties: { "class.cell": "this.tableCellClass" } }, ngImport: i0, template: "<teta-cell-host [row]=\"row\"\n                [column]=\"column\"\n                [filterOptions]=\"filterOptions\"\n                [dict]=\"dict\"></teta-cell-host>\n", styles: [""], dependencies: [{ kind: "component", type: CellHostComponent, selector: "teta-cell-host", inputs: ["column", "row", "filterOptions", "dict"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: CellComponent, isStandalone: true, selector: "teta-cell", inputs: { column: "column", filterOptions: "filterOptions", dict: "dict", row: "row" }, host: { properties: { "class.cell": "this.tableCellClass" } }, ngImport: i0, template: "<teta-cell-host [row]=\"row\" [column]=\"column\" [filterOptions]=\"filterOptions\" [dict]=\"dict\"></teta-cell-host>\n", styles: [""], dependencies: [{ kind: "component", type: CellHostComponent, selector: "teta-cell-host", inputs: ["column", "row", "filterOptions", "dict"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: CellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CellHostComponent], template: "<teta-cell-host [row]=\"row\"\n                [column]=\"column\"\n                [filterOptions]=\"filterOptions\"\n                [dict]=\"dict\"></teta-cell-host>\n" }]
+            args: [{ selector: 'teta-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CellHostComponent], template: "<teta-cell-host [row]=\"row\" [column]=\"column\" [filterOptions]=\"filterOptions\" [dict]=\"dict\"></teta-cell-host>\n" }]
         }], propDecorators: { column: [{
                 type: Input
             }], filterOptions: [{
@@ -8380,9 +8093,7 @@ class SelectionCellComponent {
         }
     }
     ngOnInit() {
-        this._svc.selectedRows
-            .pipe(takeWhile((_) => this._alive))
-            .subscribe((_) => {
+        this._svc.selectedRows.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             this.selectedRows = _;
             this._cdr.markForCheck();
         });
@@ -8391,11 +8102,11 @@ class SelectionCellComponent {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SelectionCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: SelectionCellComponent, isStandalone: true, selector: "teta-selection-cell", inputs: { row: "row" }, host: { properties: { "class.cell": "this.tableCellClass" } }, ngImport: i0, template: "<teta-checkbox [binary]=\"true\"\n               [noLabel]=\"true\"\n               [ngModel]=\"selectedRows?.indexOf(row) >= 0\"\n               (ngModelChange)=\"selectRow($event)\"\n               (click)=\"$event.stopPropagation()\"></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: SelectionCellComponent, isStandalone: true, selector: "teta-selection-cell", inputs: { row: "row" }, host: { properties: { "class.cell": "this.tableCellClass" } }, ngImport: i0, template: "<teta-checkbox\n  [binary]=\"true\"\n  [noLabel]=\"true\"\n  [ngModel]=\"selectedRows?.indexOf(row) >= 0\"\n  (ngModelChange)=\"selectRow($event)\"\n  (click)=\"$event.stopPropagation()\"\n></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SelectionCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-selection-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckboxComponent, FormsModule], template: "<teta-checkbox [binary]=\"true\"\n               [noLabel]=\"true\"\n               [ngModel]=\"selectedRows?.indexOf(row) >= 0\"\n               (ngModelChange)=\"selectRow($event)\"\n               (click)=\"$event.stopPropagation()\"></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'teta-selection-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckboxComponent, FormsModule], template: "<teta-checkbox\n  [binary]=\"true\"\n  [noLabel]=\"true\"\n  [ngModel]=\"selectedRows?.indexOf(row) >= 0\"\n  (ngModelChange)=\"selectRow($event)\"\n  (click)=\"$event.stopPropagation()\"\n></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { row: [{
                 type: Input
             }], tableCellClass: [{
@@ -8450,8 +8161,8 @@ class TableBodyComponent {
     }
     set columns(columns) {
         this._columns = columns;
-        this.locked = this._columns?.filter(_ => _.locked === true);
-        this.unlocked = this._columns?.filter(_ => _.locked === false);
+        this.locked = this._columns?.filter((_) => _.locked === true);
+        this.unlocked = this._columns?.filter((_) => _.locked === false);
         const startWidth = this.selectType === SelectType.checkBox ? 28 : 0;
         this.lockedFlex = this.locked.reduce((prev, curr) => prev + curr.flex, 0);
         this.lockedWidth = this.locked.reduce((prev, curr) => prev + curr.width, startWidth);
@@ -8488,25 +8199,23 @@ class TableBodyComponent {
     ngOnInit() {
         this.locale = this._config.locale;
         combineLatest([this._svc.columns, this._svc.hiddenColumns])
-            .pipe(takeWhile(_ => this._alive))
+            .pipe(takeWhile((_) => this._alive))
             .subscribe((values) => {
             const [columns, hiddenColumns] = values;
             this._hiddenColumns = hiddenColumns;
-            this.columns = ArrayUtil.flatten(columns, 'columns', true).filter(_ => this._hiddenColumns.indexOf(_.name) < 0);
+            this.columns = ArrayUtil.flatten(columns, 'columns', true).filter((_) => this._hiddenColumns.indexOf(_.name) < 0);
             this._cdr.markForCheck();
         });
-        this._svc.displayData.pipe(takeWhile(_ => this._alive)).subscribe(_ => {
+        this._svc.displayData.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             this.data = _;
             this._cdr.markForCheck();
             this.viewport?.checkViewportSize();
         });
-        this._svc.dict.pipe(takeWhile(_ => this._alive)).subscribe(_ => {
+        this._svc.dict.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             this.dict = _;
             this._cdr.markForCheck();
         });
-        this._svc.scrollIndex
-            .pipe(takeWhile(() => this._alive))
-            .subscribe(async (index) => {
+        this._svc.scrollIndex.pipe(takeWhile(() => this._alive)).subscribe(async (index) => {
             if (this.viewport) {
                 this.viewport.scrollToIndex(index, 'auto');
             }
@@ -8516,7 +8225,7 @@ class TableBodyComponent {
             }
             this._cdr.markForCheck();
         });
-        this._svc.activeRow.pipe(takeWhile(_ => this._alive)).subscribe(async (_) => {
+        this._svc.activeRow.pipe(takeWhile((_) => this._alive)).subscribe(async (_) => {
             this.activeRow = _;
             this._cdr.markForCheck();
         });
@@ -8560,7 +8269,7 @@ class TableBodyComponent {
         this.scrollChange.emit(event);
     }
     addResizeObserver() {
-        this._obs = new ResizeObserver(_ => {
+        this._obs = new ResizeObserver((_) => {
             this.viewport?.checkViewportSize();
         });
         this._obs.observe(this._elementRef.nativeElement);
@@ -8576,17 +8285,13 @@ class TableBodyComponent {
         }, 0);
     }
     getMin(columnName) {
-        return this.data?.reduce((accum, current) => accum != null && accum <= current.data[columnName]
-            ? accum
-            : current.data[columnName], null);
+        return this.data?.reduce((accum, current) => accum != null && accum <= current.data[columnName] ? accum : current.data[columnName], null);
     }
     getMax(columnName) {
-        return this.data?.reduce((accum, current) => accum != null && accum >= current.data[columnName]
-            ? accum
-            : current.data[columnName], null);
+        return this.data?.reduce((accum, current) => (accum != null && accum >= current.data[columnName] ? accum : current.data[columnName]), null);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableBodyComponent, deps: [{ token: TableService }, { token: i0.ElementRef }, { token: TetaConfigService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TableBodyComponent, isStandalone: true, selector: "teta-table-body", inputs: { virtual: "virtual", activeRow: "activeRow", selectedRows: "selectedRows", additionalComponent: "additionalComponent", aggregate: "aggregate", selectType: "selectType", rowClass: "rowClass", trackRow: "trackRow", trackColumns: "trackColumns" }, outputs: { scrollChange: "scrollChange" }, host: { properties: { "class.table-body": "this.tableBodyClass" } }, viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], ngImport: i0, template: "@if (virtual && data.length > 0) {\n  <teta-scrollable class=\"table-body-container\"\n                   style=\"padding-bottom: 12px\"\n                   [showScrollbars]=\"true\"\n  >\n    <cdk-virtual-scroll-viewport tetaScrollable\n                                 class=\"table-body-container\"\n                                 (scroll)=\"emitScroll($event)\"\n                                 [itemSize]=\"28\">\n      <ng-container\n        *cdkVirtualFor=\"let row of data;templateCacheSize: 0; let rowIndex = index; trackBy: trackTableRow;\">\n        <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n      </ng-container>\n    </cdk-virtual-scroll-viewport>\n  </teta-scrollable>\n} @else {\n  <teta-scrollable class=\"table-body-container\"\n                   style=\"padding-bottom: 12px\"\n                   direction=\"column\"\n                   [showScrollbars]=\"true\"\n                   (scroll)=\"emitScroll($event)\">\n    <div class=\"table-body-container\">\n      @if (!data?.length) {\n        <div class=\"column column_auto\"\n             style=\"position: absolute; top:0; bottom:16px;left:0;right:0;\"\n        >\n          <ng-content></ng-content>\n        </div>\n      }\n      @for (row of data; track trackTableRow(rowIndex, row); let rowIndex = $index) {\n        <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n      }\n      @if (aggregate) {\n        <ng-container *ngTemplateOutlet=\"aggTemplate;\"></ng-container>\n      }\n      <ng-container *ngTemplateOutlet=\"emptyRow;\"></ng-container>\n    </div>\n  </teta-scrollable>\n}\n\n<ng-template #bodyTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <!--  <div class=\"table-row\"-->\n  <!--    ngForm-->\n  <!--    (click)=\"setActiveRow(row.data, $event)\"-->\n  <!--    [attr.data-row]=\"rowIndex\"-->\n  <!--    [class.table-row_odd]=\"rowIndex % 2 === 1\"-->\n  <!--    [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"-->\n  <!--    [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"-->\n  <!--    [style.flex-grow]=\"totalFlex\"-->\n  <!--    [style.flex-basis.px]=\"totalWidth\"-->\n  <!--    [style.min-width.px]=\"totalWidth\">-->\n  <!--    @if (locked.length > 0) {-->\n  <!--      <div class=\"table-row_locked\"-->\n  <!--        [style.flex-grow]=\"lockedFlex\"-->\n  <!--        [style.flex-basis.px]=\"lockedWidth\"-->\n  <!--        [style.min-width.px]=\"lockedWidth\"-->\n  <!--        [style.zIndex]=\"row.data === activeRow ? 2 : 1\">-->\n  <!--        @if (selectType === selectTypeEnum.checkBox && locked.length) {-->\n  <!--          <teta-selection-cell-->\n  <!--            [row]=\"row.data\"-->\n  <!--          style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--        }-->\n  <!--        @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--          <teta-cell-->\n  <!--            [attr.data-row]=\"rowIndex\"-->\n  <!--            [attr.data-column]=\"column.name\"-->\n  <!--            [column]=\"column\"-->\n  <!--            [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--            [dict]=\"dict\"-->\n  <!--            [row]=\"row\"-->\n  <!--            [ngClass]=\"column.cellClass\"-->\n  <!--            [attr.tabindex]=\"0\"-->\n  <!--            [style.flex-grow]=\"column.flex\"-->\n  <!--            [style.flex-basis.px]=\"column.width\"-->\n  <!--          ></teta-cell>-->\n  <!--        }-->\n  <!--      </div>-->\n  <!--    }-->\n  <!--    @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {-->\n  <!--      <teta-selection-cell-->\n  <!--        [row]=\"row.data\"-->\n  <!--      style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--    }-->\n  <!--    @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--      <teta-cell-->\n  <!--        [attr.data-row]=\"rowIndex\"-->\n  <!--        [attr.data-column]=\"column.name\"-->\n  <!--        [column]=\"column\"-->\n  <!--        [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--        [dict]=\"dict\"-->\n  <!--        [row]=\"row\"-->\n  <!--        [ngClass]=\"column.cellClass\"-->\n  <!--        [attr.tabindex]=\"0\"-->\n  <!--        [style.flex-grow]=\"column.flex\"-->\n  <!--        [style.flex-basis.px]=\"column.width\"-->\n  <!--      ></teta-cell>-->\n  <!--    }-->\n  <!--  </div>-->\n  <teta-table-row class=\"table-row\"\n                  ngForm\n                  [row]=\"row\"\n                  (click)=\"setActiveRow(row.data, $event)\"\n                  [attr.data-row]=\"rowIndex\"\n                  [class.table-row_odd]=\"rowIndex % 2 === 1\"\n                  [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"\n                  [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"\n                  [style.flex-grow]=\"totalFlex\"\n                  [style.flex-basis.px]=\"totalWidth\"\n                  [style.min-width.px]=\"totalWidth\">\n    @if (locked.length > 0) {\n      <div class=\"table-row_locked\"\n           [style.flex-grow]=\"lockedFlex\"\n           [style.flex-basis.px]=\"lockedWidth\"\n           [style.min-width.px]=\"lockedWidth\"\n           [style.zIndex]=\"row.data === activeRow ? 2 : 1\">\n        @if (selectType === selectTypeEnum.checkBox && locked.length) {\n          <teta-selection-cell\n            [row]=\"row.data\"\n            style=\"width: 28px;\"></teta-selection-cell>\n        }\n        @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n          <teta-cell\n            [attr.data-row]=\"rowIndex\"\n            [attr.data-column]=\"column.name\"\n            [column]=\"column\"\n            [filterOptions]=\"dict?dict[column.name]:[]\"\n            [dict]=\"dict\"\n            [row]=\"row\"\n            [ngClass]=\"column.cellClass\"\n            [attr.tabindex]=\"0\"\n            [style.flex-grow]=\"column.flex\"\n            [style.flex-basis.px]=\"column.width\"\n          ></teta-cell>\n        }\n      </div>\n    }\n    @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n      <teta-selection-cell\n        [row]=\"row.data\"\n        style=\"width: 28px;\"></teta-selection-cell>\n    }\n    @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n      <teta-cell\n        [attr.data-row]=\"rowIndex\"\n        [attr.data-column]=\"column.name\"\n        [column]=\"column\"\n        [filterOptions]=\"dict?dict[column.name]:[]\"\n        [dict]=\"dict\"\n        [row]=\"row\"\n        [ngClass]=\"column.cellClass\"\n        [attr.tabindex]=\"0\"\n        [style.flex-grow]=\"column.flex\"\n        [style.flex-basis.px]=\"column.width\"\n      ></teta-cell>\n    }\n  </teta-table-row>\n</ng-template>\n\n<ng-template #aggTemplate>\n  @if (locale | async; as loc) {\n    @if (aggregate) {\n      <div class=\"table-row\"\n           [class.table-row_virtual]=\"virtual\"\n           [style.flex-grow]=\"totalFlex\"\n           [style.flex-basis.px]=\"totalWidth\"\n           [style.min-width.px]=\"totalWidth\">\n        @if (locked.length > 0) {\n          <div class=\"table-row_locked\"\n               [style.flex-grow]=\"lockedFlex\"\n               [style.flex-basis.px]=\"lockedWidth\"\n               [style.min-width.px]=\"lockedWidth\">\n            @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n              <div class=\"cell align-center justify-content-center\"\n                   style=\"width: 28px;\"\n              >\n                <teta-icon [name]=\"'sumColor'\"></teta-icon>\n              </div>\n            }\n            @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n              <div class=\"cell cell-component aggregate-cell\"\n                   [attr.data-column]=\"column.name\"\n                   [ngClass]=\"column.cellClass\"\n                   [attr.tabindex]=\"0\"\n                   [style.flex-grow]=\"column.flex\"\n                   [style.flex-basis.px]=\"column.width\">\n                @if (column.aggregate !== aggregationType.none) {\n                  <span class=\"cell-text cell-text_numeric font-title-3\"\n                  >\n                    {{ loc[getAggregateText(column)] }}:\n                    {{ getAggregateValue(column) | tetaNumber : 2 }}\n                  </span>\n                }\n              </div>\n            }\n          </div>\n        }\n        @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n          <div class=\"cell align-center justify-content-center\"\n               style=\"width: 28px;\"\n          >\n            <teta-icon [name]=\"'sumColor'\"></teta-icon>\n          </div>\n        }\n        @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n          <div class=\"cell cell-component aggregate-cell\"\n               [attr.data-column]=\"column.name\"\n               [ngClass]=\"column.cellClass\"\n               [attr.tabindex]=\"0\"\n               [style.flex-grow]=\"column.flex\"\n               [style.flex-basis.px]=\"column.width\">\n            @if (column.aggregate !== aggregationType.none) {\n              <span class=\"cell-text cell-text_numeric font-title-3\"\n              >\n                {{ loc[getAggregateText(column)] }}:\n                {{ getAggregateValue(column) | tetaNumber : 2 }}\n              </span>\n            }\n          </div>\n        }\n      </div>\n    }\n  }\n</ng-template>\n<ng-template #emptyRow>\n  <div class=\"empty-table-row\"\n       style=\"height: 0.1px\"\n       [style.flex-grow]=\"totalFlex\"\n       [style.flex-basis.px]=\"totalWidth\"\n       [style.min-width.px]=\"totalWidth\">\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ScrollableDirective, selector: "[tetaScrollable]" }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SelectionCellComponent, selector: "teta-selection-cell", inputs: ["row"] }, { kind: "component", type: CellComponent, selector: "teta-cell", inputs: ["column", "filterOptions", "dict", "row"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: NumberPipe, name: "tetaNumber" }, { kind: "component", type: TableRowComponent, selector: "teta-table-row", inputs: ["row"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TableBodyComponent, isStandalone: true, selector: "teta-table-body", inputs: { virtual: "virtual", activeRow: "activeRow", selectedRows: "selectedRows", additionalComponent: "additionalComponent", aggregate: "aggregate", selectType: "selectType", rowClass: "rowClass", trackRow: "trackRow", trackColumns: "trackColumns" }, outputs: { scrollChange: "scrollChange" }, host: { properties: { "class.table-body": "this.tableBodyClass" } }, viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], ngImport: i0, template: "@if (virtual && data.length > 0) {\n<teta-scrollable class=\"table-body-container\" style=\"padding-bottom: 12px\" [showScrollbars]=\"true\">\n  <cdk-virtual-scroll-viewport\n    tetaScrollable\n    class=\"table-body-container\"\n    (scroll)=\"emitScroll($event)\"\n    [itemSize]=\"28\"\n  >\n    <ng-container *cdkVirtualFor=\"let row of data; templateCacheSize: 0; let rowIndex = index; trackBy: trackTableRow\">\n      <ng-container *ngTemplateOutlet=\"bodyTemplate; context: { row: row, rowIndex: rowIndex }\"></ng-container>\n    </ng-container>\n  </cdk-virtual-scroll-viewport>\n</teta-scrollable>\n} @else {\n<teta-scrollable\n  class=\"table-body-container\"\n  style=\"padding-bottom: 12px\"\n  direction=\"column\"\n  [showScrollbars]=\"true\"\n  (scroll)=\"emitScroll($event)\"\n>\n  <div class=\"table-body-container\">\n    @if (!data?.length) {\n    <div class=\"column column_auto\" style=\"position: absolute; top: 0; bottom: 16px; left: 0; right: 0\">\n      <ng-content></ng-content>\n    </div>\n    } @for (row of data; track trackTableRow(rowIndex, row); let rowIndex = $index) {\n    <ng-container *ngTemplateOutlet=\"bodyTemplate; context: { row: row, rowIndex: rowIndex }\"></ng-container>\n    } @if (aggregate) {\n    <ng-container *ngTemplateOutlet=\"aggTemplate\"></ng-container>\n    }\n    <ng-container *ngTemplateOutlet=\"emptyRow\"></ng-container>\n  </div>\n</teta-scrollable>\n}\n\n<ng-template #bodyTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <!--  <div class=\"table-row\"-->\n  <!--    ngForm-->\n  <!--    (click)=\"setActiveRow(row.data, $event)\"-->\n  <!--    [attr.data-row]=\"rowIndex\"-->\n  <!--    [class.table-row_odd]=\"rowIndex % 2 === 1\"-->\n  <!--    [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"-->\n  <!--    [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"-->\n  <!--    [style.flex-grow]=\"totalFlex\"-->\n  <!--    [style.flex-basis.px]=\"totalWidth\"-->\n  <!--    [style.min-width.px]=\"totalWidth\">-->\n  <!--    @if (locked.length > 0) {-->\n  <!--      <div class=\"table-row_locked\"-->\n  <!--        [style.flex-grow]=\"lockedFlex\"-->\n  <!--        [style.flex-basis.px]=\"lockedWidth\"-->\n  <!--        [style.min-width.px]=\"lockedWidth\"-->\n  <!--        [style.zIndex]=\"row.data === activeRow ? 2 : 1\">-->\n  <!--        @if (selectType === selectTypeEnum.checkBox && locked.length) {-->\n  <!--          <teta-selection-cell-->\n  <!--            [row]=\"row.data\"-->\n  <!--          style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--        }-->\n  <!--        @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--          <teta-cell-->\n  <!--            [attr.data-row]=\"rowIndex\"-->\n  <!--            [attr.data-column]=\"column.name\"-->\n  <!--            [column]=\"column\"-->\n  <!--            [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--            [dict]=\"dict\"-->\n  <!--            [row]=\"row\"-->\n  <!--            [ngClass]=\"column.cellClass\"-->\n  <!--            [attr.tabindex]=\"0\"-->\n  <!--            [style.flex-grow]=\"column.flex\"-->\n  <!--            [style.flex-basis.px]=\"column.width\"-->\n  <!--          ></teta-cell>-->\n  <!--        }-->\n  <!--      </div>-->\n  <!--    }-->\n  <!--    @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {-->\n  <!--      <teta-selection-cell-->\n  <!--        [row]=\"row.data\"-->\n  <!--      style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--    }-->\n  <!--    @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--      <teta-cell-->\n  <!--        [attr.data-row]=\"rowIndex\"-->\n  <!--        [attr.data-column]=\"column.name\"-->\n  <!--        [column]=\"column\"-->\n  <!--        [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--        [dict]=\"dict\"-->\n  <!--        [row]=\"row\"-->\n  <!--        [ngClass]=\"column.cellClass\"-->\n  <!--        [attr.tabindex]=\"0\"-->\n  <!--        [style.flex-grow]=\"column.flex\"-->\n  <!--        [style.flex-basis.px]=\"column.width\"-->\n  <!--      ></teta-cell>-->\n  <!--    }-->\n  <!--  </div>-->\n  <teta-table-row\n    class=\"table-row\"\n    ngForm\n    [row]=\"row\"\n    (click)=\"setActiveRow(row.data, $event)\"\n    [attr.data-row]=\"rowIndex\"\n    [class.table-row_odd]=\"rowIndex % 2 === 1\"\n    [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"\n    [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"\n    [style.flex-grow]=\"totalFlex\"\n    [style.flex-basis.px]=\"totalWidth\"\n    [style.min-width.px]=\"totalWidth\"\n  >\n    @if (locked.length > 0) {\n    <div\n      class=\"table-row_locked\"\n      [style.flex-grow]=\"lockedFlex\"\n      [style.flex-basis.px]=\"lockedWidth\"\n      [style.min-width.px]=\"lockedWidth\"\n      [style.zIndex]=\"row.data === activeRow ? 2 : 1\"\n    >\n      @if (selectType === selectTypeEnum.checkBox && locked.length) {\n      <teta-selection-cell [row]=\"row.data\" style=\"width: 28px\"></teta-selection-cell>\n      } @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n      <teta-cell\n        [attr.data-row]=\"rowIndex\"\n        [attr.data-column]=\"column.name\"\n        [column]=\"column\"\n        [filterOptions]=\"dict ? dict[column.name] : []\"\n        [dict]=\"dict\"\n        [row]=\"row\"\n        [ngClass]=\"column.cellClass\"\n        [attr.tabindex]=\"0\"\n        [style.flex-grow]=\"column.flex\"\n        [style.flex-basis.px]=\"column.width\"\n      ></teta-cell>\n      }\n    </div>\n    } @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n    <teta-selection-cell [row]=\"row.data\" style=\"width: 28px\"></teta-selection-cell>\n    } @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n    <teta-cell\n      [attr.data-row]=\"rowIndex\"\n      [attr.data-column]=\"column.name\"\n      [column]=\"column\"\n      [filterOptions]=\"dict ? dict[column.name] : []\"\n      [dict]=\"dict\"\n      [row]=\"row\"\n      [ngClass]=\"column.cellClass\"\n      [attr.tabindex]=\"0\"\n      [style.flex-grow]=\"column.flex\"\n      [style.flex-basis.px]=\"column.width\"\n    ></teta-cell>\n    }\n  </teta-table-row>\n</ng-template>\n\n<ng-template #aggTemplate>\n  @if (locale | async; as loc) { @if (aggregate) {\n  <div\n    class=\"table-row\"\n    [class.table-row_virtual]=\"virtual\"\n    [style.flex-grow]=\"totalFlex\"\n    [style.flex-basis.px]=\"totalWidth\"\n    [style.min-width.px]=\"totalWidth\"\n  >\n    @if (locked.length > 0) {\n    <div\n      class=\"table-row_locked\"\n      [style.flex-grow]=\"lockedFlex\"\n      [style.flex-basis.px]=\"lockedWidth\"\n      [style.min-width.px]=\"lockedWidth\"\n    >\n      @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n      <div class=\"cell align-center justify-content-center\" style=\"width: 28px\">\n        <teta-icon [name]=\"'sumColor'\"></teta-icon>\n      </div>\n      } @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n      <div\n        class=\"cell cell-component aggregate-cell\"\n        [attr.data-column]=\"column.name\"\n        [ngClass]=\"column.cellClass\"\n        [attr.tabindex]=\"0\"\n        [style.flex-grow]=\"column.flex\"\n        [style.flex-basis.px]=\"column.width\"\n      >\n        @if (column.aggregate !== aggregationType.none) {\n        <span class=\"cell-text cell-text_numeric font-title-3\">\n          {{ loc[getAggregateText(column)] }}:\n          {{ getAggregateValue(column) | tetaNumber : 2 }}\n        </span>\n        }\n      </div>\n      }\n    </div>\n    } @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n    <div class=\"cell align-center justify-content-center\" style=\"width: 28px\">\n      <teta-icon [name]=\"'sumColor'\"></teta-icon>\n    </div>\n    } @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n    <div\n      class=\"cell cell-component aggregate-cell\"\n      [attr.data-column]=\"column.name\"\n      [ngClass]=\"column.cellClass\"\n      [attr.tabindex]=\"0\"\n      [style.flex-grow]=\"column.flex\"\n      [style.flex-basis.px]=\"column.width\"\n    >\n      @if (column.aggregate !== aggregationType.none) {\n      <span class=\"cell-text cell-text_numeric font-title-3\">\n        {{ loc[getAggregateText(column)] }}:\n        {{ getAggregateValue(column) | tetaNumber : 2 }}\n      </span>\n      }\n    </div>\n    }\n  </div>\n  } }\n</ng-template>\n<ng-template #emptyRow>\n  <div\n    class=\"empty-table-row\"\n    style=\"height: 0.1px\"\n    [style.flex-grow]=\"totalFlex\"\n    [style.flex-basis.px]=\"totalWidth\"\n    [style.min-width.px]=\"totalWidth\"\n  ></div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ScrollableDirective, selector: "[tetaScrollable]" }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SelectionCellComponent, selector: "teta-selection-cell", inputs: ["row"] }, { kind: "component", type: CellComponent, selector: "teta-cell", inputs: ["column", "filterOptions", "dict", "row"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: NumberPipe, name: "tetaNumber" }, { kind: "component", type: TableRowComponent, selector: "teta-table-row", inputs: ["row"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableBodyComponent, decorators: [{
             type: Component,
@@ -8605,7 +8310,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         AsyncPipe,
                         NumberPipe,
                         TableRowComponent,
-                    ], template: "@if (virtual && data.length > 0) {\n  <teta-scrollable class=\"table-body-container\"\n                   style=\"padding-bottom: 12px\"\n                   [showScrollbars]=\"true\"\n  >\n    <cdk-virtual-scroll-viewport tetaScrollable\n                                 class=\"table-body-container\"\n                                 (scroll)=\"emitScroll($event)\"\n                                 [itemSize]=\"28\">\n      <ng-container\n        *cdkVirtualFor=\"let row of data;templateCacheSize: 0; let rowIndex = index; trackBy: trackTableRow;\">\n        <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n      </ng-container>\n    </cdk-virtual-scroll-viewport>\n  </teta-scrollable>\n} @else {\n  <teta-scrollable class=\"table-body-container\"\n                   style=\"padding-bottom: 12px\"\n                   direction=\"column\"\n                   [showScrollbars]=\"true\"\n                   (scroll)=\"emitScroll($event)\">\n    <div class=\"table-body-container\">\n      @if (!data?.length) {\n        <div class=\"column column_auto\"\n             style=\"position: absolute; top:0; bottom:16px;left:0;right:0;\"\n        >\n          <ng-content></ng-content>\n        </div>\n      }\n      @for (row of data; track trackTableRow(rowIndex, row); let rowIndex = $index) {\n        <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n      }\n      @if (aggregate) {\n        <ng-container *ngTemplateOutlet=\"aggTemplate;\"></ng-container>\n      }\n      <ng-container *ngTemplateOutlet=\"emptyRow;\"></ng-container>\n    </div>\n  </teta-scrollable>\n}\n\n<ng-template #bodyTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <!--  <div class=\"table-row\"-->\n  <!--    ngForm-->\n  <!--    (click)=\"setActiveRow(row.data, $event)\"-->\n  <!--    [attr.data-row]=\"rowIndex\"-->\n  <!--    [class.table-row_odd]=\"rowIndex % 2 === 1\"-->\n  <!--    [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"-->\n  <!--    [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"-->\n  <!--    [style.flex-grow]=\"totalFlex\"-->\n  <!--    [style.flex-basis.px]=\"totalWidth\"-->\n  <!--    [style.min-width.px]=\"totalWidth\">-->\n  <!--    @if (locked.length > 0) {-->\n  <!--      <div class=\"table-row_locked\"-->\n  <!--        [style.flex-grow]=\"lockedFlex\"-->\n  <!--        [style.flex-basis.px]=\"lockedWidth\"-->\n  <!--        [style.min-width.px]=\"lockedWidth\"-->\n  <!--        [style.zIndex]=\"row.data === activeRow ? 2 : 1\">-->\n  <!--        @if (selectType === selectTypeEnum.checkBox && locked.length) {-->\n  <!--          <teta-selection-cell-->\n  <!--            [row]=\"row.data\"-->\n  <!--          style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--        }-->\n  <!--        @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--          <teta-cell-->\n  <!--            [attr.data-row]=\"rowIndex\"-->\n  <!--            [attr.data-column]=\"column.name\"-->\n  <!--            [column]=\"column\"-->\n  <!--            [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--            [dict]=\"dict\"-->\n  <!--            [row]=\"row\"-->\n  <!--            [ngClass]=\"column.cellClass\"-->\n  <!--            [attr.tabindex]=\"0\"-->\n  <!--            [style.flex-grow]=\"column.flex\"-->\n  <!--            [style.flex-basis.px]=\"column.width\"-->\n  <!--          ></teta-cell>-->\n  <!--        }-->\n  <!--      </div>-->\n  <!--    }-->\n  <!--    @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {-->\n  <!--      <teta-selection-cell-->\n  <!--        [row]=\"row.data\"-->\n  <!--      style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--    }-->\n  <!--    @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--      <teta-cell-->\n  <!--        [attr.data-row]=\"rowIndex\"-->\n  <!--        [attr.data-column]=\"column.name\"-->\n  <!--        [column]=\"column\"-->\n  <!--        [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--        [dict]=\"dict\"-->\n  <!--        [row]=\"row\"-->\n  <!--        [ngClass]=\"column.cellClass\"-->\n  <!--        [attr.tabindex]=\"0\"-->\n  <!--        [style.flex-grow]=\"column.flex\"-->\n  <!--        [style.flex-basis.px]=\"column.width\"-->\n  <!--      ></teta-cell>-->\n  <!--    }-->\n  <!--  </div>-->\n  <teta-table-row class=\"table-row\"\n                  ngForm\n                  [row]=\"row\"\n                  (click)=\"setActiveRow(row.data, $event)\"\n                  [attr.data-row]=\"rowIndex\"\n                  [class.table-row_odd]=\"rowIndex % 2 === 1\"\n                  [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"\n                  [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"\n                  [style.flex-grow]=\"totalFlex\"\n                  [style.flex-basis.px]=\"totalWidth\"\n                  [style.min-width.px]=\"totalWidth\">\n    @if (locked.length > 0) {\n      <div class=\"table-row_locked\"\n           [style.flex-grow]=\"lockedFlex\"\n           [style.flex-basis.px]=\"lockedWidth\"\n           [style.min-width.px]=\"lockedWidth\"\n           [style.zIndex]=\"row.data === activeRow ? 2 : 1\">\n        @if (selectType === selectTypeEnum.checkBox && locked.length) {\n          <teta-selection-cell\n            [row]=\"row.data\"\n            style=\"width: 28px;\"></teta-selection-cell>\n        }\n        @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n          <teta-cell\n            [attr.data-row]=\"rowIndex\"\n            [attr.data-column]=\"column.name\"\n            [column]=\"column\"\n            [filterOptions]=\"dict?dict[column.name]:[]\"\n            [dict]=\"dict\"\n            [row]=\"row\"\n            [ngClass]=\"column.cellClass\"\n            [attr.tabindex]=\"0\"\n            [style.flex-grow]=\"column.flex\"\n            [style.flex-basis.px]=\"column.width\"\n          ></teta-cell>\n        }\n      </div>\n    }\n    @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n      <teta-selection-cell\n        [row]=\"row.data\"\n        style=\"width: 28px;\"></teta-selection-cell>\n    }\n    @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n      <teta-cell\n        [attr.data-row]=\"rowIndex\"\n        [attr.data-column]=\"column.name\"\n        [column]=\"column\"\n        [filterOptions]=\"dict?dict[column.name]:[]\"\n        [dict]=\"dict\"\n        [row]=\"row\"\n        [ngClass]=\"column.cellClass\"\n        [attr.tabindex]=\"0\"\n        [style.flex-grow]=\"column.flex\"\n        [style.flex-basis.px]=\"column.width\"\n      ></teta-cell>\n    }\n  </teta-table-row>\n</ng-template>\n\n<ng-template #aggTemplate>\n  @if (locale | async; as loc) {\n    @if (aggregate) {\n      <div class=\"table-row\"\n           [class.table-row_virtual]=\"virtual\"\n           [style.flex-grow]=\"totalFlex\"\n           [style.flex-basis.px]=\"totalWidth\"\n           [style.min-width.px]=\"totalWidth\">\n        @if (locked.length > 0) {\n          <div class=\"table-row_locked\"\n               [style.flex-grow]=\"lockedFlex\"\n               [style.flex-basis.px]=\"lockedWidth\"\n               [style.min-width.px]=\"lockedWidth\">\n            @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n              <div class=\"cell align-center justify-content-center\"\n                   style=\"width: 28px;\"\n              >\n                <teta-icon [name]=\"'sumColor'\"></teta-icon>\n              </div>\n            }\n            @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n              <div class=\"cell cell-component aggregate-cell\"\n                   [attr.data-column]=\"column.name\"\n                   [ngClass]=\"column.cellClass\"\n                   [attr.tabindex]=\"0\"\n                   [style.flex-grow]=\"column.flex\"\n                   [style.flex-basis.px]=\"column.width\">\n                @if (column.aggregate !== aggregationType.none) {\n                  <span class=\"cell-text cell-text_numeric font-title-3\"\n                  >\n                    {{ loc[getAggregateText(column)] }}:\n                    {{ getAggregateValue(column) | tetaNumber : 2 }}\n                  </span>\n                }\n              </div>\n            }\n          </div>\n        }\n        @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n          <div class=\"cell align-center justify-content-center\"\n               style=\"width: 28px;\"\n          >\n            <teta-icon [name]=\"'sumColor'\"></teta-icon>\n          </div>\n        }\n        @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n          <div class=\"cell cell-component aggregate-cell\"\n               [attr.data-column]=\"column.name\"\n               [ngClass]=\"column.cellClass\"\n               [attr.tabindex]=\"0\"\n               [style.flex-grow]=\"column.flex\"\n               [style.flex-basis.px]=\"column.width\">\n            @if (column.aggregate !== aggregationType.none) {\n              <span class=\"cell-text cell-text_numeric font-title-3\"\n              >\n                {{ loc[getAggregateText(column)] }}:\n                {{ getAggregateValue(column) | tetaNumber : 2 }}\n              </span>\n            }\n          </div>\n        }\n      </div>\n    }\n  }\n</ng-template>\n<ng-template #emptyRow>\n  <div class=\"empty-table-row\"\n       style=\"height: 0.1px\"\n       [style.flex-grow]=\"totalFlex\"\n       [style.flex-basis.px]=\"totalWidth\"\n       [style.min-width.px]=\"totalWidth\">\n  </div>\n</ng-template>\n" }]
+                    ], template: "@if (virtual && data.length > 0) {\n<teta-scrollable class=\"table-body-container\" style=\"padding-bottom: 12px\" [showScrollbars]=\"true\">\n  <cdk-virtual-scroll-viewport\n    tetaScrollable\n    class=\"table-body-container\"\n    (scroll)=\"emitScroll($event)\"\n    [itemSize]=\"28\"\n  >\n    <ng-container *cdkVirtualFor=\"let row of data; templateCacheSize: 0; let rowIndex = index; trackBy: trackTableRow\">\n      <ng-container *ngTemplateOutlet=\"bodyTemplate; context: { row: row, rowIndex: rowIndex }\"></ng-container>\n    </ng-container>\n  </cdk-virtual-scroll-viewport>\n</teta-scrollable>\n} @else {\n<teta-scrollable\n  class=\"table-body-container\"\n  style=\"padding-bottom: 12px\"\n  direction=\"column\"\n  [showScrollbars]=\"true\"\n  (scroll)=\"emitScroll($event)\"\n>\n  <div class=\"table-body-container\">\n    @if (!data?.length) {\n    <div class=\"column column_auto\" style=\"position: absolute; top: 0; bottom: 16px; left: 0; right: 0\">\n      <ng-content></ng-content>\n    </div>\n    } @for (row of data; track trackTableRow(rowIndex, row); let rowIndex = $index) {\n    <ng-container *ngTemplateOutlet=\"bodyTemplate; context: { row: row, rowIndex: rowIndex }\"></ng-container>\n    } @if (aggregate) {\n    <ng-container *ngTemplateOutlet=\"aggTemplate\"></ng-container>\n    }\n    <ng-container *ngTemplateOutlet=\"emptyRow\"></ng-container>\n  </div>\n</teta-scrollable>\n}\n\n<ng-template #bodyTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <!--  <div class=\"table-row\"-->\n  <!--    ngForm-->\n  <!--    (click)=\"setActiveRow(row.data, $event)\"-->\n  <!--    [attr.data-row]=\"rowIndex\"-->\n  <!--    [class.table-row_odd]=\"rowIndex % 2 === 1\"-->\n  <!--    [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"-->\n  <!--    [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"-->\n  <!--    [style.flex-grow]=\"totalFlex\"-->\n  <!--    [style.flex-basis.px]=\"totalWidth\"-->\n  <!--    [style.min-width.px]=\"totalWidth\">-->\n  <!--    @if (locked.length > 0) {-->\n  <!--      <div class=\"table-row_locked\"-->\n  <!--        [style.flex-grow]=\"lockedFlex\"-->\n  <!--        [style.flex-basis.px]=\"lockedWidth\"-->\n  <!--        [style.min-width.px]=\"lockedWidth\"-->\n  <!--        [style.zIndex]=\"row.data === activeRow ? 2 : 1\">-->\n  <!--        @if (selectType === selectTypeEnum.checkBox && locked.length) {-->\n  <!--          <teta-selection-cell-->\n  <!--            [row]=\"row.data\"-->\n  <!--          style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--        }-->\n  <!--        @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--          <teta-cell-->\n  <!--            [attr.data-row]=\"rowIndex\"-->\n  <!--            [attr.data-column]=\"column.name\"-->\n  <!--            [column]=\"column\"-->\n  <!--            [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--            [dict]=\"dict\"-->\n  <!--            [row]=\"row\"-->\n  <!--            [ngClass]=\"column.cellClass\"-->\n  <!--            [attr.tabindex]=\"0\"-->\n  <!--            [style.flex-grow]=\"column.flex\"-->\n  <!--            [style.flex-basis.px]=\"column.width\"-->\n  <!--          ></teta-cell>-->\n  <!--        }-->\n  <!--      </div>-->\n  <!--    }-->\n  <!--    @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {-->\n  <!--      <teta-selection-cell-->\n  <!--        [row]=\"row.data\"-->\n  <!--      style=\"width: 28px;\"></teta-selection-cell>-->\n  <!--    }-->\n  <!--    @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {-->\n  <!--      <teta-cell-->\n  <!--        [attr.data-row]=\"rowIndex\"-->\n  <!--        [attr.data-column]=\"column.name\"-->\n  <!--        [column]=\"column\"-->\n  <!--        [filterOptions]=\"dict?dict[column.name]:[]\"-->\n  <!--        [dict]=\"dict\"-->\n  <!--        [row]=\"row\"-->\n  <!--        [ngClass]=\"column.cellClass\"-->\n  <!--        [attr.tabindex]=\"0\"-->\n  <!--        [style.flex-grow]=\"column.flex\"-->\n  <!--        [style.flex-basis.px]=\"column.width\"-->\n  <!--      ></teta-cell>-->\n  <!--    }-->\n  <!--  </div>-->\n  <teta-table-row\n    class=\"table-row\"\n    ngForm\n    [row]=\"row\"\n    (click)=\"setActiveRow(row.data, $event)\"\n    [attr.data-row]=\"rowIndex\"\n    [class.table-row_odd]=\"rowIndex % 2 === 1\"\n    [ngClass]=\"rowClass ? rowClass(row.data, rowIndex) : ''\"\n    [class.table-row_selected]=\"selectedRows && selectedRows.indexOf(row.data) >= 0\"\n    [style.flex-grow]=\"totalFlex\"\n    [style.flex-basis.px]=\"totalWidth\"\n    [style.min-width.px]=\"totalWidth\"\n  >\n    @if (locked.length > 0) {\n    <div\n      class=\"table-row_locked\"\n      [style.flex-grow]=\"lockedFlex\"\n      [style.flex-basis.px]=\"lockedWidth\"\n      [style.min-width.px]=\"lockedWidth\"\n      [style.zIndex]=\"row.data === activeRow ? 2 : 1\"\n    >\n      @if (selectType === selectTypeEnum.checkBox && locked.length) {\n      <teta-selection-cell [row]=\"row.data\" style=\"width: 28px\"></teta-selection-cell>\n      } @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n      <teta-cell\n        [attr.data-row]=\"rowIndex\"\n        [attr.data-column]=\"column.name\"\n        [column]=\"column\"\n        [filterOptions]=\"dict ? dict[column.name] : []\"\n        [dict]=\"dict\"\n        [row]=\"row\"\n        [ngClass]=\"column.cellClass\"\n        [attr.tabindex]=\"0\"\n        [style.flex-grow]=\"column.flex\"\n        [style.flex-basis.px]=\"column.width\"\n      ></teta-cell>\n      }\n    </div>\n    } @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n    <teta-selection-cell [row]=\"row.data\" style=\"width: 28px\"></teta-selection-cell>\n    } @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n    <teta-cell\n      [attr.data-row]=\"rowIndex\"\n      [attr.data-column]=\"column.name\"\n      [column]=\"column\"\n      [filterOptions]=\"dict ? dict[column.name] : []\"\n      [dict]=\"dict\"\n      [row]=\"row\"\n      [ngClass]=\"column.cellClass\"\n      [attr.tabindex]=\"0\"\n      [style.flex-grow]=\"column.flex\"\n      [style.flex-basis.px]=\"column.width\"\n    ></teta-cell>\n    }\n  </teta-table-row>\n</ng-template>\n\n<ng-template #aggTemplate>\n  @if (locale | async; as loc) { @if (aggregate) {\n  <div\n    class=\"table-row\"\n    [class.table-row_virtual]=\"virtual\"\n    [style.flex-grow]=\"totalFlex\"\n    [style.flex-basis.px]=\"totalWidth\"\n    [style.min-width.px]=\"totalWidth\"\n  >\n    @if (locked.length > 0) {\n    <div\n      class=\"table-row_locked\"\n      [style.flex-grow]=\"lockedFlex\"\n      [style.flex-basis.px]=\"lockedWidth\"\n      [style.min-width.px]=\"lockedWidth\"\n    >\n      @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n      <div class=\"cell align-center justify-content-center\" style=\"width: 28px\">\n        <teta-icon [name]=\"'sumColor'\"></teta-icon>\n      </div>\n      } @for (column of locked; track trackColumns(colIndex, column); let colIndex = $index) {\n      <div\n        class=\"cell cell-component aggregate-cell\"\n        [attr.data-column]=\"column.name\"\n        [ngClass]=\"column.cellClass\"\n        [attr.tabindex]=\"0\"\n        [style.flex-grow]=\"column.flex\"\n        [style.flex-basis.px]=\"column.width\"\n      >\n        @if (column.aggregate !== aggregationType.none) {\n        <span class=\"cell-text cell-text_numeric font-title-3\">\n          {{ loc[getAggregateText(column)] }}:\n          {{ getAggregateValue(column) | tetaNumber : 2 }}\n        </span>\n        }\n      </div>\n      }\n    </div>\n    } @if (selectType === selectTypeEnum.checkBox && locked.length < 1) {\n    <div class=\"cell align-center justify-content-center\" style=\"width: 28px\">\n      <teta-icon [name]=\"'sumColor'\"></teta-icon>\n    </div>\n    } @for (column of unlocked; track trackColumns(colIndex, column); let colIndex = $index) {\n    <div\n      class=\"cell cell-component aggregate-cell\"\n      [attr.data-column]=\"column.name\"\n      [ngClass]=\"column.cellClass\"\n      [attr.tabindex]=\"0\"\n      [style.flex-grow]=\"column.flex\"\n      [style.flex-basis.px]=\"column.width\"\n    >\n      @if (column.aggregate !== aggregationType.none) {\n      <span class=\"cell-text cell-text_numeric font-title-3\">\n        {{ loc[getAggregateText(column)] }}:\n        {{ getAggregateValue(column) | tetaNumber : 2 }}\n      </span>\n      }\n    </div>\n    }\n  </div>\n  } }\n</ng-template>\n<ng-template #emptyRow>\n  <div\n    class=\"empty-table-row\"\n    style=\"height: 0.1px\"\n    [style.flex-grow]=\"totalFlex\"\n    [style.flex-basis.px]=\"totalWidth\"\n    [style.min-width.px]=\"totalWidth\"\n  ></div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ElementRef }, { type: TetaConfigService }, { type: i0.ChangeDetectorRef }], propDecorators: { virtual: [{
                 type: Input
             }], activeRow: [{
@@ -8667,7 +8372,7 @@ class ContextMenuDirective extends DynamicContentBaseDirective {
         this._cdr = _cdr;
         this._click = _click;
         this.autoCloseIgnore = [];
-        this.scrollListener = event => {
+        this.scrollListener = (event) => {
             if (this._open &&
                 this._componentRef &&
                 !this._componentRef.location.nativeElement.contains(event.target) &&
@@ -8687,8 +8392,7 @@ class ContextMenuDirective extends DynamicContentBaseDirective {
         }
     }
     click(event) {
-        if (this._componentRef &&
-            DomUtil.clickedInside(this._componentRef.location.nativeElement, event)) {
+        if (this._componentRef && DomUtil.clickedInside(this._componentRef.location.nativeElement, event)) {
             event.preventDefault();
             event.stopPropagation();
         }
@@ -8729,10 +8433,7 @@ class ContextMenuDirective extends DynamicContentBaseDirective {
         }
         this._eventPoint = event;
         this._componentRef = this.createContentRef();
-        this._componentRef.instance.className = [
-            ...ArrayUtil.asArray(this.className),
-            'context-menu',
-        ];
+        this._componentRef.instance.className = [...ArrayUtil.asArray(this.className), 'context-menu'];
         this.openChange.emit(true);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ContextMenuDirective, deps: [{ token: DOCUMENT }, { token: i0.ElementRef }, { token: DynamicComponentService }, { token: i0.Injector }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: ClickService }], target: i0.ɵɵFactoryTarget.Directive }); }
@@ -8838,27 +8539,33 @@ class TableUtil {
     static filterDate(data, filter) {
         const filterDate = (row) => {
             const item = row;
-            return (filter.value.lessThan === null || filter.value.lessThan === undefined
+            return ((filter.value.lessThan === null || filter.value.lessThan === undefined
                 ? true
                 : filter.value.lessThan?.getTime() >= item[filter.field]?.getTime()) &&
                 (filter.value.greaterThan === null || filter.value.greaterThan === undefined
                     ? true
-                    : filter.value.greaterThan?.getTime() <= item[filter.field]?.getTime());
+                    : filter.value.greaterThan?.getTime() <= item[filter.field]?.getTime()));
         };
         return data.filter(filterDate);
     }
     static filterNumber(data, filter) {
         const filterNumber = (row) => {
             const item = row;
-            return (filter.value.lessThan === null || filter.value.lessThan === undefined || filter.value.lessThan?.toString() === ''
+            return ((filter.value.lessThan === null ||
+                filter.value.lessThan === undefined ||
+                filter.value.lessThan?.toString() === ''
                 ? true
                 : filter.value.lessThan >= item[filter.field]) &&
-                (filter.value.greaterThan === null || filter.value.greaterThan === undefined || filter.value.greaterThan?.toString() === ''
+                (filter.value.greaterThan === null ||
+                    filter.value.greaterThan === undefined ||
+                    filter.value.greaterThan?.toString() === ''
                     ? true
                     : filter.value.greaterThan <= item[filter.field]) &&
-                (filter.value.equalsTo === null || filter.value.equalsTo === undefined || filter.value.equalsTo?.toString() === ''
+                (filter.value.equalsTo === null ||
+                    filter.value.equalsTo === undefined ||
+                    filter.value.equalsTo?.toString() === ''
                     ? true
-                    : filter.value.equalsTo === item[filter.field]);
+                    : filter.value.equalsTo === item[filter.field]));
         };
         return data.filter(filterNumber);
     }
@@ -8880,11 +8587,11 @@ class TableUtil {
         return [...res];
     }
     static desc(field) {
-        const res = (a, b) => a[field] > b[field] ? -1 : 1;
+        const res = (a, b) => (a[field] > b[field] ? -1 : 1);
         return res;
     }
     static asc(field) {
-        const res = (a, b) => a[field] < b[field] ? -1 : 1;
+        const res = (a, b) => (a[field] < b[field] ? -1 : 1);
         return res;
     }
 }
@@ -8940,17 +8647,16 @@ class TreeItemToggleComponent {
     }
     ngOnInit() {
         this.open = this.service.openItems.pipe(map((_) => {
-            const found = _?.find((x) => this.service.compareItems(x) ===
-                this.service.compareItems(this.item));
+            const found = _?.find((x) => this.service.compareItems(x) === this.service.compareItems(this.item));
             return found != null;
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TreeItemToggleComponent, deps: [{ token: TreeService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: TreeItemToggleComponent, isStandalone: true, selector: "teta-tree-item-toggle", inputs: { item: "item" }, ngImport: i0, template: "<teta-icon [name]=\"(open | async) ? 'arrowDownKey' : 'arrowRightKey'\"\n           class=\"tree__icon\"></teta-icon>\n", styles: [":host{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: TreeItemToggleComponent, isStandalone: true, selector: "teta-tree-item-toggle", inputs: { item: "item" }, ngImport: i0, template: "<teta-icon [name]=\"(open | async) ? 'arrowDownKey' : 'arrowRightKey'\" class=\"tree__icon\"></teta-icon>\n", styles: [":host{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TreeItemToggleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-tree-item-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent, AsyncPipe], template: "<teta-icon [name]=\"(open | async) ? 'arrowDownKey' : 'arrowRightKey'\"\n           class=\"tree__icon\"></teta-icon>\n", styles: [":host{display:inline-flex;align-items:center}\n"] }]
+            args: [{ selector: 'teta-tree-item-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent, AsyncPipe], template: "<teta-icon [name]=\"(open | async) ? 'arrowDownKey' : 'arrowRightKey'\" class=\"tree__icon\"></teta-icon>\n", styles: [":host{display:inline-flex;align-items:center}\n"] }]
         }], ctorParameters: () => [{ type: TreeService }, { type: i0.ChangeDetectorRef }], propDecorators: { item: [{
                 type: Input
             }] } });
@@ -8969,7 +8675,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaTemplate]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }], propDecorators: { id: [{
                 type: Input,
@@ -8981,8 +8687,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
  */
 class TreeItemComponent {
     get computedDepth() {
-        return (this.depth +
-            (this.item[this.childNodeName]?.length > 0 ? 0 : this.childPadding ? 2 : 1));
+        return this.depth + (this.item[this.childNodeName]?.length > 0 ? 0 : this.childPadding ? 2 : 1);
     }
     constructor(service, _cdr) {
         this.service = service;
@@ -8999,27 +8704,20 @@ class TreeItemComponent {
         this.service.openItem(this.item);
     }
     ngOnInit() {
-        this.service.openItems
-            .pipe(takeWhile((_) => this._alive))
-            .subscribe((_) => {
-            const found = _?.find((x) => this.service.compareItems(x) ===
-                this.service.compareItems(this.item));
+        this.service.openItems.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
+            const found = _?.find((x) => this.service.compareItems(x) === this.service.compareItems(this.item));
             this.itemIsOpen = found != null;
             this._cdr.markForCheck();
         });
     }
-    ngOnChanges(changes) {
-    }
+    ngOnChanges(changes) { }
     ngOnDestroy() {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TreeItemComponent, deps: [{ token: TreeService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: TreeItemComponent, isStandalone: true, selector: "teta-tree-item", inputs: { item: "item", depth: "depth", padding: "padding", childNodeName: "childNodeName", template: "template", childPadding: "childPadding" }, host: { properties: { "class.tree__item-container": "this.treeItemClass", "@treeItemInstance": "this.treeItemInstance" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"tree__item_content\" [ngClass]=\"'tree__item_content-' + computedDepth\" (click)=\"openItem()\">\n  <ng-container\n    *ngTemplateOutlet=\"template; context: {$implicit: item, item: item, open: itemIsOpen, service: service, depth: depth}\"></ng-container>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: TreeItemComponent, isStandalone: true, selector: "teta-tree-item", inputs: { item: "item", depth: "depth", padding: "padding", childNodeName: "childNodeName", template: "template", childPadding: "childPadding" }, host: { properties: { "class.tree__item-container": "this.treeItemClass", "@treeItemInstance": "this.treeItemInstance" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"tree__item_content\" [ngClass]=\"'tree__item_content-' + computedDepth\" (click)=\"openItem()\">\n  <ng-container\n    *ngTemplateOutlet=\"\n      template;\n      context: { $implicit: item, item: item, open: itemIsOpen, service: service, depth: depth }\n    \"\n  ></ng-container>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
             trigger('treeItemInstance', [
-                transition('void => *', [
-                    style({ opacity: '0' }),
-                    animate(200, style({ opacity: '1' })),
-                ]),
+                transition('void => *', [style({ opacity: '0' }), animate(200, style({ opacity: '1' }))]),
                 // transition('* => void', [animate(200, style({opacity: '0'}))]),
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -9028,13 +8726,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Component,
             args: [{ selector: 'teta-tree-item', changeDetection: ChangeDetectionStrategy.OnPush, animations: [
                         trigger('treeItemInstance', [
-                            transition('void => *', [
-                                style({ opacity: '0' }),
-                                animate(200, style({ opacity: '1' })),
-                            ]),
+                            transition('void => *', [style({ opacity: '0' }), animate(200, style({ opacity: '1' }))]),
                             // transition('* => void', [animate(200, style({opacity: '0'}))]),
                         ]),
-                    ], standalone: true, imports: [NgClass, NgTemplateOutlet], template: "<div class=\"tree__item_content\" [ngClass]=\"'tree__item_content-' + computedDepth\" (click)=\"openItem()\">\n  <ng-container\n    *ngTemplateOutlet=\"template; context: {$implicit: item, item: item, open: itemIsOpen, service: service, depth: depth}\"></ng-container>\n</div>\n" }]
+                    ], standalone: true, imports: [NgClass, NgTemplateOutlet], template: "<div class=\"tree__item_content\" [ngClass]=\"'tree__item_content-' + computedDepth\" (click)=\"openItem()\">\n  <ng-container\n    *ngTemplateOutlet=\"\n      template;\n      context: { $implicit: item, item: item, open: itemIsOpen, service: service, depth: depth }\n    \"\n  ></ng-container>\n</div>\n" }]
         }], ctorParameters: () => [{ type: TreeService }, { type: i0.ChangeDetectorRef }], propDecorators: { item: [{
                 type: Input
             }], depth: [{
@@ -9129,8 +8824,8 @@ class TreeComponent {
         data?.forEach((item) => {
             item['level'] = level;
             result.push(item);
-            if (item[this.childNodeName]?.length > 0
-                && this._openItems?.find((openItem) => this.compareItems(openItem) === this.compareItems(item))) {
+            if (item[this.childNodeName]?.length > 0 &&
+                this._openItems?.find((openItem) => this.compareItems(openItem) === this.compareItems(item))) {
                 result.push(...this.getDisplayData(item[this.childNodeName], level + 1));
             }
         });
@@ -9147,7 +8842,7 @@ class TreeComponent {
         this._obs.disconnect();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TreeComponent, deps: [{ token: TreeService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TreeComponent, isStandalone: true, selector: "teta-tree", inputs: { data: "data", padding: "padding", childNodeName: "childNodeName", virtual: "virtual", height: "height", openItems: "openItems", compareItems: "compareItems" }, outputs: { service: "service", openItemsChange: "openItemsChange" }, host: { properties: { "class.tree": "this.treeClass" } }, providers: [TreeService], queries: [{ propertyName: "template", first: true, predicate: TetaTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (virtual) {\n  <teta-scrollable class=\"column column_auto\">\n    <cdk-virtual-scroll-viewport tetaScrollable\n      class=\"table-body-container\"\n      [itemSize]=\"height\">\n      <teta-tree-item *cdkVirtualFor=\"let item of displayData;templateCacheSize: 0; trackBy: trackRow;\"\n        [item]=\"item\"\n        [style.height.px]=\"height\"\n        [depth]=\"item['level']\"\n        [padding]=\"padding\"\n        [childNodeName]=\"childNodeName\"\n        [childPadding]=\"childPadding\"\n      [template]=\"template?.template\"></teta-tree-item>\n    </cdk-virtual-scroll-viewport>\n  </teta-scrollable>\n} @else {\n  <teta-scrollable class=\"column column_auto\" direction=\"column\">\n    @for (item of displayData; track trackRow($index, item)) {\n      <teta-tree-item\n        [item]=\"item\"\n        [style.height.px]=\"height\"\n        [depth]=\"item['level']\"\n        [padding]=\"padding\"\n        [childNodeName]=\"childNodeName\"\n        [childPadding]=\"childPadding\"\n      [template]=\"template?.template\"></teta-tree-item>\n    }\n  </teta-scrollable>\n}\n", styles: [""], dependencies: [{ kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ScrollableDirective, selector: "[tetaScrollable]" }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: TreeItemComponent, selector: "teta-tree-item", inputs: ["item", "depth", "padding", "childNodeName", "template", "childPadding"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TreeComponent, isStandalone: true, selector: "teta-tree", inputs: { data: "data", padding: "padding", childNodeName: "childNodeName", virtual: "virtual", height: "height", openItems: "openItems", compareItems: "compareItems" }, outputs: { service: "service", openItemsChange: "openItemsChange" }, host: { properties: { "class.tree": "this.treeClass" } }, providers: [TreeService], queries: [{ propertyName: "template", first: true, predicate: TetaTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (virtual) {\n<teta-scrollable class=\"column column_auto\">\n  <cdk-virtual-scroll-viewport tetaScrollable class=\"table-body-container\" [itemSize]=\"height\">\n    <teta-tree-item\n      *cdkVirtualFor=\"let item of displayData; templateCacheSize: 0; trackBy: trackRow\"\n      [item]=\"item\"\n      [style.height.px]=\"height\"\n      [depth]=\"item['level']\"\n      [padding]=\"padding\"\n      [childNodeName]=\"childNodeName\"\n      [childPadding]=\"childPadding\"\n      [template]=\"template?.template\"\n    ></teta-tree-item>\n  </cdk-virtual-scroll-viewport>\n</teta-scrollable>\n} @else {\n<teta-scrollable class=\"column column_auto\" direction=\"column\">\n  @for (item of displayData; track trackRow($index, item)) {\n  <teta-tree-item\n    [item]=\"item\"\n    [style.height.px]=\"height\"\n    [depth]=\"item['level']\"\n    [padding]=\"padding\"\n    [childNodeName]=\"childNodeName\"\n    [childPadding]=\"childPadding\"\n    [template]=\"template?.template\"\n  ></teta-tree-item>\n  }\n</teta-scrollable>\n}\n", styles: [""], dependencies: [{ kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ScrollableDirective, selector: "[tetaScrollable]" }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: TreeItemComponent, selector: "teta-tree-item", inputs: ["item", "depth", "padding", "childNodeName", "template", "childPadding"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TreeComponent, decorators: [{
             type: Component,
@@ -9158,7 +8853,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         ScrollableDirective,
                         CdkVirtualForOf,
                         TreeItemComponent,
-                    ], template: "@if (virtual) {\n  <teta-scrollable class=\"column column_auto\">\n    <cdk-virtual-scroll-viewport tetaScrollable\n      class=\"table-body-container\"\n      [itemSize]=\"height\">\n      <teta-tree-item *cdkVirtualFor=\"let item of displayData;templateCacheSize: 0; trackBy: trackRow;\"\n        [item]=\"item\"\n        [style.height.px]=\"height\"\n        [depth]=\"item['level']\"\n        [padding]=\"padding\"\n        [childNodeName]=\"childNodeName\"\n        [childPadding]=\"childPadding\"\n      [template]=\"template?.template\"></teta-tree-item>\n    </cdk-virtual-scroll-viewport>\n  </teta-scrollable>\n} @else {\n  <teta-scrollable class=\"column column_auto\" direction=\"column\">\n    @for (item of displayData; track trackRow($index, item)) {\n      <teta-tree-item\n        [item]=\"item\"\n        [style.height.px]=\"height\"\n        [depth]=\"item['level']\"\n        [padding]=\"padding\"\n        [childNodeName]=\"childNodeName\"\n        [childPadding]=\"childPadding\"\n      [template]=\"template?.template\"></teta-tree-item>\n    }\n  </teta-scrollable>\n}\n" }]
+                    ], template: "@if (virtual) {\n<teta-scrollable class=\"column column_auto\">\n  <cdk-virtual-scroll-viewport tetaScrollable class=\"table-body-container\" [itemSize]=\"height\">\n    <teta-tree-item\n      *cdkVirtualFor=\"let item of displayData; templateCacheSize: 0; trackBy: trackRow\"\n      [item]=\"item\"\n      [style.height.px]=\"height\"\n      [depth]=\"item['level']\"\n      [padding]=\"padding\"\n      [childNodeName]=\"childNodeName\"\n      [childPadding]=\"childPadding\"\n      [template]=\"template?.template\"\n    ></teta-tree-item>\n  </cdk-virtual-scroll-viewport>\n</teta-scrollable>\n} @else {\n<teta-scrollable class=\"column column_auto\" direction=\"column\">\n  @for (item of displayData; track trackRow($index, item)) {\n  <teta-tree-item\n    [item]=\"item\"\n    [style.height.px]=\"height\"\n    [depth]=\"item['level']\"\n    [padding]=\"padding\"\n    [childNodeName]=\"childNodeName\"\n    [childPadding]=\"childPadding\"\n    [template]=\"template?.template\"\n  ></teta-tree-item>\n  }\n</teta-scrollable>\n}\n" }]
         }], ctorParameters: () => [{ type: TreeService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { data: [{
                 type: Input
             }], padding: [{
@@ -9191,7 +8886,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
 class VisibilityDropdownTabComponent {
     get openItems() {
         if (this._openItems == null) {
-            this._openItems = this.columns.map(_ => _);
+            this._openItems = this.columns.map((_) => _);
         }
         return this._openItems;
     }
@@ -9216,7 +8911,7 @@ class VisibilityDropdownTabComponent {
                 this.hideColumn(column, hiddenColumns);
             }
             if (column.columns) {
-                column.columns.forEach(x => {
+                column.columns.forEach((x) => {
                     this.setChildrenVisibility(x, visible, hiddenColumns);
                 });
             }
@@ -9231,8 +8926,8 @@ class VisibilityDropdownTabComponent {
         };
         this.locale = this._config.locale;
         this._svc.hiddenColumns
-            .pipe(takeWhile(_ => this._alive), map(_ => [..._]))
-            .subscribe(_ => {
+            .pipe(takeWhile((_) => this._alive), map((_) => [..._]))
+            .subscribe((_) => {
             this.hiddenColumns = _;
         });
     }
@@ -9244,7 +8939,7 @@ class VisibilityDropdownTabComponent {
             return true;
         }
         const columns = ArrayUtil.flatten(this.columns, 'columns');
-        const notHidden = columns.find(_ => this.hiddenColumns.indexOf(_.name) < 0);
+        const notHidden = columns.find((_) => this.hiddenColumns.indexOf(_.name) < 0);
         if (!notHidden) {
             return false;
         }
@@ -9255,7 +8950,7 @@ class VisibilityDropdownTabComponent {
             this.hiddenColumns = [];
         }
         else {
-            this.hiddenColumns = ArrayUtil.flatten(this.columns, 'columns').map(_ => _.name);
+            this.hiddenColumns = ArrayUtil.flatten(this.columns, 'columns').map((_) => _.name);
         }
     }
     setColumnsVisibility() {
@@ -9277,7 +8972,7 @@ class VisibilityDropdownTabComponent {
         if (parent &&
             !this.columnIsHidden(parent) &&
             parent.columns &&
-            parent.columns.every(_ => this.columnIsHidden(_))) {
+            parent.columns.every((_) => this.columnIsHidden(_))) {
             this.hideColumn(parent, hiddenColumns);
             this.hideParents(parent, hiddenColumns);
         }
@@ -9289,13 +8984,13 @@ class VisibilityDropdownTabComponent {
         hiddenColumns.splice(hiddenColumns.indexOf(column.name), 1);
     }
     findParentColumn(column, columns) {
-        return ArrayUtil.findRecursive(columns, iterableNode => iterableNode.columns?.indexOf(column) >= 0, 'columns');
+        return ArrayUtil.findRecursive(columns, (iterableNode) => iterableNode.columns?.indexOf(column) >= 0, 'columns');
     }
     ngOnDestroy() {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: VisibilityDropdownTabComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: VisibilityDropdownTabComponent, isStandalone: true, selector: "teta-visibility-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, ngImport: i0, template: "@if (locale | async; as loc) {\n  <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n    <teta-checkbox [binary]=\"true\"\n      [allowNull]=\"true\"\n      [ngModel]=\"allColumnsVisible()\"\n      (ngModelChange)=\"setAllColumns($event)\">\n      {{loc.all}}\n    </teta-checkbox>\n  </div>\n  <div class=\"list-divider\"></div>\n  <teta-scrollable class=\"padding-v-2 column column_auto\">\n    <teta-tree [data]=\"columns\"\n      [openItems]=\"openItems\"\n      (openItemsChange)=\"openItems = $event\"\n      [childNodeName]=\"'columns'\"\n      [compareItems]=\"compareItems\">\n      <ng-template tetaTemplate let-item>\n        <div class=\"tree__item\" style=\"align-items: unset\">\n          @if (item.columns?.length > 0) {\n            <teta-tree-item-toggle [item]=\"item\"></teta-tree-item-toggle>\n          }\n          <teta-checkbox\n            style=\"flex-grow: 1;\"\n            [ngModel]=\"!columnIsHidden(item)\"\n            (ngModelChange)=\"setColumnVisibility(item, $event)\"\n            (click)=\"$event.stopPropagation()\"\n            [binary]=\"true\"\n            >\n            {{item.caption}}\n          </teta-checkbox>\n        </div>\n      </ng-template>\n    </teta-tree>\n  </teta-scrollable>\n  <teta-toolbar class=\"justify-content-end\">\n    <button type=\"button\"\n      teta-button\n      [disabled]=\"allColumnsVisible() === false\"\n      [palette]=\"'primary'\"\n      (click)=\"setColumnsVisibility()\">\n      {{loc.apply}}\n    </button>\n  </teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: TreeComponent, selector: "teta-tree", inputs: ["data", "padding", "childNodeName", "virtual", "height", "openItems", "compareItems"], outputs: ["service", "openItemsChange"] }, { kind: "directive", type: TetaTemplateDirective, selector: "[tetaTemplate]", inputs: ["tetaTemplate"] }, { kind: "component", type: TreeItemToggleComponent, selector: "teta-tree-item-toggle", inputs: ["item"] }, { kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: VisibilityDropdownTabComponent, isStandalone: true, selector: "teta-visibility-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, ngImport: i0, template: "@if (locale | async; as loc) {\n<div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n  <teta-checkbox\n    [binary]=\"true\"\n    [allowNull]=\"true\"\n    [ngModel]=\"allColumnsVisible()\"\n    (ngModelChange)=\"setAllColumns($event)\"\n  >\n    {{ loc.all }}\n  </teta-checkbox>\n</div>\n<div class=\"list-divider\"></div>\n<teta-scrollable class=\"padding-v-2 column column_auto\">\n  <teta-tree\n    [data]=\"columns\"\n    [openItems]=\"openItems\"\n    (openItemsChange)=\"openItems = $event\"\n    [childNodeName]=\"'columns'\"\n    [compareItems]=\"compareItems\"\n  >\n    <ng-template tetaTemplate let-item>\n      <div class=\"tree__item\" style=\"align-items: unset\">\n        @if (item.columns?.length > 0) {\n        <teta-tree-item-toggle [item]=\"item\"></teta-tree-item-toggle>\n        }\n        <teta-checkbox\n          style=\"flex-grow: 1\"\n          [ngModel]=\"!columnIsHidden(item)\"\n          (ngModelChange)=\"setColumnVisibility(item, $event)\"\n          (click)=\"$event.stopPropagation()\"\n          [binary]=\"true\"\n        >\n          {{ item.caption }}\n        </teta-checkbox>\n      </div>\n    </ng-template>\n  </teta-tree>\n</teta-scrollable>\n<teta-toolbar class=\"justify-content-end\">\n  <button\n    type=\"button\"\n    teta-button\n    [disabled]=\"allColumnsVisible() === false\"\n    [palette]=\"'primary'\"\n    (click)=\"setColumnsVisibility()\"\n  >\n    {{ loc.apply }}\n  </button>\n</teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ScrollableComponent, selector: "teta-scrollable", inputs: ["direction", "showScrollbars", "contentClass"], outputs: ["scroll"] }, { kind: "component", type: TreeComponent, selector: "teta-tree", inputs: ["data", "padding", "childNodeName", "virtual", "height", "openItems", "compareItems"], outputs: ["service", "openItemsChange"] }, { kind: "directive", type: TetaTemplateDirective, selector: "[tetaTemplate]", inputs: ["tetaTemplate"] }, { kind: "component", type: TreeItemToggleComponent, selector: "teta-tree-item-toggle", inputs: ["item"] }, { kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: VisibilityDropdownTabComponent, decorators: [{
             type: Component,
@@ -9309,7 +9004,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                         ToolbarComponent,
                         ButtonComponent,
                         AsyncPipe,
-                    ], template: "@if (locale | async; as loc) {\n  <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n    <teta-checkbox [binary]=\"true\"\n      [allowNull]=\"true\"\n      [ngModel]=\"allColumnsVisible()\"\n      (ngModelChange)=\"setAllColumns($event)\">\n      {{loc.all}}\n    </teta-checkbox>\n  </div>\n  <div class=\"list-divider\"></div>\n  <teta-scrollable class=\"padding-v-2 column column_auto\">\n    <teta-tree [data]=\"columns\"\n      [openItems]=\"openItems\"\n      (openItemsChange)=\"openItems = $event\"\n      [childNodeName]=\"'columns'\"\n      [compareItems]=\"compareItems\">\n      <ng-template tetaTemplate let-item>\n        <div class=\"tree__item\" style=\"align-items: unset\">\n          @if (item.columns?.length > 0) {\n            <teta-tree-item-toggle [item]=\"item\"></teta-tree-item-toggle>\n          }\n          <teta-checkbox\n            style=\"flex-grow: 1;\"\n            [ngModel]=\"!columnIsHidden(item)\"\n            (ngModelChange)=\"setColumnVisibility(item, $event)\"\n            (click)=\"$event.stopPropagation()\"\n            [binary]=\"true\"\n            >\n            {{item.caption}}\n          </teta-checkbox>\n        </div>\n      </ng-template>\n    </teta-tree>\n  </teta-scrollable>\n  <teta-toolbar class=\"justify-content-end\">\n    <button type=\"button\"\n      teta-button\n      [disabled]=\"allColumnsVisible() === false\"\n      [palette]=\"'primary'\"\n      (click)=\"setColumnsVisibility()\">\n      {{loc.apply}}\n    </button>\n  </teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0}\n"] }]
+                    ], template: "@if (locale | async; as loc) {\n<div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n  <teta-checkbox\n    [binary]=\"true\"\n    [allowNull]=\"true\"\n    [ngModel]=\"allColumnsVisible()\"\n    (ngModelChange)=\"setAllColumns($event)\"\n  >\n    {{ loc.all }}\n  </teta-checkbox>\n</div>\n<div class=\"list-divider\"></div>\n<teta-scrollable class=\"padding-v-2 column column_auto\">\n  <teta-tree\n    [data]=\"columns\"\n    [openItems]=\"openItems\"\n    (openItemsChange)=\"openItems = $event\"\n    [childNodeName]=\"'columns'\"\n    [compareItems]=\"compareItems\"\n  >\n    <ng-template tetaTemplate let-item>\n      <div class=\"tree__item\" style=\"align-items: unset\">\n        @if (item.columns?.length > 0) {\n        <teta-tree-item-toggle [item]=\"item\"></teta-tree-item-toggle>\n        }\n        <teta-checkbox\n          style=\"flex-grow: 1\"\n          [ngModel]=\"!columnIsHidden(item)\"\n          (ngModelChange)=\"setColumnVisibility(item, $event)\"\n          (click)=\"$event.stopPropagation()\"\n          [binary]=\"true\"\n        >\n          {{ item.caption }}\n        </teta-checkbox>\n      </div>\n    </ng-template>\n  </teta-tree>\n</teta-scrollable>\n<teta-toolbar class=\"justify-content-end\">\n  <button\n    type=\"button\"\n    teta-button\n    [disabled]=\"allColumnsVisible() === false\"\n    [palette]=\"'primary'\"\n    (click)=\"setColumnsVisibility()\"\n  >\n    {{ loc.apply }}\n  </button>\n</teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0}\n"] }]
         }], ctorParameters: () => [{ type: TableService }, { type: TetaConfigService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { columns: [{
                 type: Input
             }], column: [{
@@ -9344,14 +9039,13 @@ class FilterDropdownTabComponent {
         this.close();
         this._cdr.markForCheck();
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: FilterDropdownTabComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: FilterDropdownTabComponent, isStandalone: true, selector: "teta-filter-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, host: { listeners: { "keydown.enter": "enter()" } }, ngImport: i0, template: "@if (locale | async; as loc) {\n  @if (filterOptions | async; as options) {\n    <teta-filter-host [column]=\"column\"\n      [data]=\"data\"\n      [state]=\"state\"\n    [filterOptions]=\"options[column.name]\"></teta-filter-host>\n  }\n  <teta-toolbar class=\"justify-content-between\">\n    <button type=\"button\" teta-button [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"clearFilter()\">\n      {{loc.clear}}\n    </button>\n    <button type=\"button\" teta-button [palette]=\"'primary'\" (click)=\"applyFilter()\">\n      <teta-icon [name]=\"'tick'\" [palette]=\"'white'\"></teta-icon>\n      {{loc.apply}}\n    </button>\n  </teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0}\n"], dependencies: [{ kind: "component", type: FilterHostComponent, selector: "teta-filter-host", inputs: ["column", "state", "data", "filterOptions"], outputs: ["filterChanged"] }, { kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: FilterDropdownTabComponent, isStandalone: true, selector: "teta-filter-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, host: { listeners: { "keydown.enter": "enter()" } }, ngImport: i0, template: "@if (locale | async; as loc) { @if (filterOptions | async; as options) {\n<teta-filter-host\n  [column]=\"column\"\n  [data]=\"data\"\n  [state]=\"state\"\n  [filterOptions]=\"options[column.name]\"\n></teta-filter-host>\n}\n<teta-toolbar class=\"justify-content-between\">\n  <button type=\"button\" teta-button [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"clearFilter()\">\n    {{ loc.clear }}\n  </button>\n  <button type=\"button\" teta-button [palette]=\"'primary'\" (click)=\"applyFilter()\">\n    <teta-icon [name]=\"'tick'\" [palette]=\"'white'\"></teta-icon>\n    {{ loc.apply }}\n  </button>\n</teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0}\n"], dependencies: [{ kind: "component", type: FilterHostComponent, selector: "teta-filter-host", inputs: ["column", "state", "data", "filterOptions"], outputs: ["filterChanged"] }, { kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square", "viewType", "size"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: FilterDropdownTabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-filter-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FilterHostComponent, ToolbarComponent, ButtonComponent, IconComponent, AsyncPipe], template: "@if (locale | async; as loc) {\n  @if (filterOptions | async; as options) {\n    <teta-filter-host [column]=\"column\"\n      [data]=\"data\"\n      [state]=\"state\"\n    [filterOptions]=\"options[column.name]\"></teta-filter-host>\n  }\n  <teta-toolbar class=\"justify-content-between\">\n    <button type=\"button\" teta-button [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"clearFilter()\">\n      {{loc.clear}}\n    </button>\n    <button type=\"button\" teta-button [palette]=\"'primary'\" (click)=\"applyFilter()\">\n      <teta-icon [name]=\"'tick'\" [palette]=\"'white'\"></teta-icon>\n      {{loc.apply}}\n    </button>\n  </teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0}\n"] }]
+            args: [{ selector: 'teta-filter-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FilterHostComponent, ToolbarComponent, ButtonComponent, IconComponent, AsyncPipe], template: "@if (locale | async; as loc) { @if (filterOptions | async; as options) {\n<teta-filter-host\n  [column]=\"column\"\n  [data]=\"data\"\n  [state]=\"state\"\n  [filterOptions]=\"options[column.name]\"\n></teta-filter-host>\n}\n<teta-toolbar class=\"justify-content-between\">\n  <button type=\"button\" teta-button [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"clearFilter()\">\n    {{ loc.clear }}\n  </button>\n  <button type=\"button\" teta-button [palette]=\"'primary'\" (click)=\"applyFilter()\">\n    <teta-icon [name]=\"'tick'\" [palette]=\"'white'\"></teta-icon>\n    {{ loc.apply }}\n  </button>\n</teta-toolbar>\n}\n", styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0}\n"] }]
         }], ctorParameters: () => [{ type: TableService }, { type: TetaConfigService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { columns: [{
                 type: Input
             }], column: [{
@@ -9431,14 +9125,13 @@ class MainDropdownTabComponent {
     autosizeAllColumns() {
         this._svc.autosizeAllColumns(this.headCellElementRef.nativeElement);
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MainDropdownTabComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MainDropdownTabComponent, isStandalone: true, selector: "teta-main-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close", headCellElementRef: "headCellElementRef" }, ngImport: i0, template: "@if (locale | async; as loc) {\n  <div class=\"list column_auto\">\n    @if (!parent) {\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"pinColumn()\">\n        {{column.locked ? loc.unpin : loc.pin}}\n      </div>\n      <div class=\"list-divider\"></div>\n    }\n    @if (column.sortable) {\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"sortAsc($event)\">\n        {{loc.sortAsc}}\n      </div>\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"sortDesc($event)\">\n        {{loc.sortDesc}}\n      </div>\n      @if (hasSortedColumns()) {\n        @if (sortParam) {\n          <div class=\"list-item list-item_interactive\"\n            (click)=\"clearSort()\">\n            {{loc.clearSort}}\n          </div>\n        }\n        <div class=\"list-item list-item_interactive\"\n          (click)=\"clearAllSort()\">\n          {{loc.clearAllSort}}\n        </div>\n        <div class=\"list-divider\"></div>\n      }\n    }\n    @if (hasFilteredColumns()) {\n      @if (filtered) {\n        <div class=\"list-item list-item_interactive\"\n          (click)=\"clearFilter()\">\n          {{loc.clearFilter}}\n        </div>\n      }\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"clearAllFilters()\">\n        {{loc.clearAllFilters}}\n      </div>\n      <div class=\"list-divider\"></div>\n    }\n    <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n      {{loc.autosizeColumn}}\n    </div>\n    <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n      {{loc.autosizeAll}}\n    </div>\n    <div class=\"list-divider\"></div>\n    <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n      {{loc.resetColumnsSize}}\n    </div>\n  </div>\n}\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: MainDropdownTabComponent, isStandalone: true, selector: "teta-main-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close", headCellElementRef: "headCellElementRef" }, ngImport: i0, template: "@if (locale | async; as loc) {\n<div class=\"list column_auto\">\n  @if (!parent) {\n  <div class=\"list-item list-item_interactive\" (click)=\"pinColumn()\">\n    {{ column.locked ? loc.unpin : loc.pin }}\n  </div>\n  <div class=\"list-divider\"></div>\n  } @if (column.sortable) {\n  <div class=\"list-item list-item_interactive\" (click)=\"sortAsc($event)\">\n    {{ loc.sortAsc }}\n  </div>\n  <div class=\"list-item list-item_interactive\" (click)=\"sortDesc($event)\">\n    {{ loc.sortDesc }}\n  </div>\n  @if (hasSortedColumns()) { @if (sortParam) {\n  <div class=\"list-item list-item_interactive\" (click)=\"clearSort()\">\n    {{ loc.clearSort }}\n  </div>\n  }\n  <div class=\"list-item list-item_interactive\" (click)=\"clearAllSort()\">\n    {{ loc.clearAllSort }}\n  </div>\n  <div class=\"list-divider\"></div>\n  } } @if (hasFilteredColumns()) { @if (filtered) {\n  <div class=\"list-item list-item_interactive\" (click)=\"clearFilter()\">\n    {{ loc.clearFilter }}\n  </div>\n  }\n  <div class=\"list-item list-item_interactive\" (click)=\"clearAllFilters()\">\n    {{ loc.clearAllFilters }}\n  </div>\n  <div class=\"list-divider\"></div>\n  }\n  <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n    {{ loc.autosizeColumn }}\n  </div>\n  <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n    {{ loc.autosizeAll }}\n  </div>\n  <div class=\"list-divider\"></div>\n  <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n    {{ loc.resetColumnsSize }}\n  </div>\n</div>\n}\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: MainDropdownTabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-main-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [AsyncPipe], template: "@if (locale | async; as loc) {\n  <div class=\"list column_auto\">\n    @if (!parent) {\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"pinColumn()\">\n        {{column.locked ? loc.unpin : loc.pin}}\n      </div>\n      <div class=\"list-divider\"></div>\n    }\n    @if (column.sortable) {\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"sortAsc($event)\">\n        {{loc.sortAsc}}\n      </div>\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"sortDesc($event)\">\n        {{loc.sortDesc}}\n      </div>\n      @if (hasSortedColumns()) {\n        @if (sortParam) {\n          <div class=\"list-item list-item_interactive\"\n            (click)=\"clearSort()\">\n            {{loc.clearSort}}\n          </div>\n        }\n        <div class=\"list-item list-item_interactive\"\n          (click)=\"clearAllSort()\">\n          {{loc.clearAllSort}}\n        </div>\n        <div class=\"list-divider\"></div>\n      }\n    }\n    @if (hasFilteredColumns()) {\n      @if (filtered) {\n        <div class=\"list-item list-item_interactive\"\n          (click)=\"clearFilter()\">\n          {{loc.clearFilter}}\n        </div>\n      }\n      <div class=\"list-item list-item_interactive\"\n        (click)=\"clearAllFilters()\">\n        {{loc.clearAllFilters}}\n      </div>\n      <div class=\"list-divider\"></div>\n    }\n    <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n      {{loc.autosizeColumn}}\n    </div>\n    <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n      {{loc.autosizeAll}}\n    </div>\n    <div class=\"list-divider\"></div>\n    <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n      {{loc.resetColumnsSize}}\n    </div>\n  </div>\n}\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
+            args: [{ selector: 'teta-main-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [AsyncPipe], template: "@if (locale | async; as loc) {\n<div class=\"list column_auto\">\n  @if (!parent) {\n  <div class=\"list-item list-item_interactive\" (click)=\"pinColumn()\">\n    {{ column.locked ? loc.unpin : loc.pin }}\n  </div>\n  <div class=\"list-divider\"></div>\n  } @if (column.sortable) {\n  <div class=\"list-item list-item_interactive\" (click)=\"sortAsc($event)\">\n    {{ loc.sortAsc }}\n  </div>\n  <div class=\"list-item list-item_interactive\" (click)=\"sortDesc($event)\">\n    {{ loc.sortDesc }}\n  </div>\n  @if (hasSortedColumns()) { @if (sortParam) {\n  <div class=\"list-item list-item_interactive\" (click)=\"clearSort()\">\n    {{ loc.clearSort }}\n  </div>\n  }\n  <div class=\"list-item list-item_interactive\" (click)=\"clearAllSort()\">\n    {{ loc.clearAllSort }}\n  </div>\n  <div class=\"list-divider\"></div>\n  } } @if (hasFilteredColumns()) { @if (filtered) {\n  <div class=\"list-item list-item_interactive\" (click)=\"clearFilter()\">\n    {{ loc.clearFilter }}\n  </div>\n  }\n  <div class=\"list-item list-item_interactive\" (click)=\"clearAllFilters()\">\n    {{ loc.clearAllFilters }}\n  </div>\n  <div class=\"list-divider\"></div>\n  }\n  <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n    {{ loc.autosizeColumn }}\n  </div>\n  <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n    {{ loc.autosizeAll }}\n  </div>\n  <div class=\"list-divider\"></div>\n  <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n    {{ loc.resetColumnsSize }}\n  </div>\n</div>\n}\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
         }], ctorParameters: () => [{ type: TableService }, { type: TetaConfigService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { columns: [{
                 type: Input
             }], column: [{
@@ -9533,7 +9226,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaTabContent]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -9548,7 +9241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaTabTitle]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -9683,18 +9376,11 @@ class HeadCellDropdownComponent {
         return index;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: HeadCellDropdownComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: HeadCellDropdownComponent, isStandalone: true, selector: "teta-head-cell-dropdown", inputs: { columns: "columns", column: "column", state: "state", data: "data", tabTemplates: "tabTemplates", dropDownOpen: "dropDownOpen" }, outputs: { dropDownOpenChange: "dropDownOpenChange" }, ngImport: i0, template: "@if (dropDownOpen) {\n  <teta-tabs class=\"column_auto\">\n    @for (tab of tabTemplates; track trackIndex($index)) {\n      @if (tab.showTab(column)) {\n        <teta-tab>\n          <ng-template tetaTabTitle>\n            @if (tab.icon) {\n              <teta-icon [name]=\"tab.icon\" [palette]=\"'text'\"></teta-icon>\n            }\n          </ng-template>\n          <ng-template tetaTabContent>\n            <ng-container\n          *ngTemplateOutlet=\"tab.template; context: {\n            column: column,\n            columns: columns,\n            data: data,\n            state: state,\n            close: closeDropdown\n          }\"></ng-container>\n          </ng-template>\n        </teta-tab>\n      }\n    }\n  </teta-tabs>\n}\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"], dependencies: [{ kind: "component", type: TabsComponent, selector: "teta-tabs", inputs: ["activeId", "direction", "size", "destroyOnHide"], outputs: ["tabChange"] }, { kind: "component", type: TabComponent, selector: "teta-tab", inputs: ["id", "title", "disabled"] }, { kind: "directive", type: TabTitleDirective, selector: "[tetaTabTitle]" }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: TabContentDirective, selector: "[tetaTabContent]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: HeadCellDropdownComponent, isStandalone: true, selector: "teta-head-cell-dropdown", inputs: { columns: "columns", column: "column", state: "state", data: "data", tabTemplates: "tabTemplates", dropDownOpen: "dropDownOpen" }, outputs: { dropDownOpenChange: "dropDownOpenChange" }, ngImport: i0, template: "@if (dropDownOpen) {\n<teta-tabs class=\"column_auto\">\n  @for (tab of tabTemplates; track trackIndex($index)) { @if (tab.showTab(column)) {\n  <teta-tab>\n    <ng-template tetaTabTitle>\n      @if (tab.icon) {\n      <teta-icon [name]=\"tab.icon\" [palette]=\"'text'\"></teta-icon>\n      }\n    </ng-template>\n    <ng-template tetaTabContent>\n      <ng-container\n        *ngTemplateOutlet=\"\n          tab.template;\n          context: {\n            column: column,\n            columns: columns,\n            data: data,\n            state: state,\n            close: closeDropdown\n          }\n        \"\n      ></ng-container>\n    </ng-template>\n  </teta-tab>\n  } }\n</teta-tabs>\n}\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"], dependencies: [{ kind: "component", type: TabsComponent, selector: "teta-tabs", inputs: ["activeId", "direction", "size", "destroyOnHide"], outputs: ["tabChange"] }, { kind: "component", type: TabComponent, selector: "teta-tab", inputs: ["id", "title", "disabled"] }, { kind: "directive", type: TabTitleDirective, selector: "[tetaTabTitle]" }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: TabContentDirective, selector: "[tetaTabContent]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: HeadCellDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-head-cell-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        TabsComponent,
-                        TabComponent,
-                        TabTitleDirective,
-                        IconComponent,
-                        TabContentDirective,
-                        NgTemplateOutlet,
-                    ], template: "@if (dropDownOpen) {\n  <teta-tabs class=\"column_auto\">\n    @for (tab of tabTemplates; track trackIndex($index)) {\n      @if (tab.showTab(column)) {\n        <teta-tab>\n          <ng-template tetaTabTitle>\n            @if (tab.icon) {\n              <teta-icon [name]=\"tab.icon\" [palette]=\"'text'\"></teta-icon>\n            }\n          </ng-template>\n          <ng-template tetaTabContent>\n            <ng-container\n          *ngTemplateOutlet=\"tab.template; context: {\n            column: column,\n            columns: columns,\n            data: data,\n            state: state,\n            close: closeDropdown\n          }\"></ng-container>\n          </ng-template>\n        </teta-tab>\n      }\n    }\n  </teta-tabs>\n}\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"] }]
+            args: [{ selector: 'teta-head-cell-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [TabsComponent, TabComponent, TabTitleDirective, IconComponent, TabContentDirective, NgTemplateOutlet], template: "@if (dropDownOpen) {\n<teta-tabs class=\"column_auto\">\n  @for (tab of tabTemplates; track trackIndex($index)) { @if (tab.showTab(column)) {\n  <teta-tab>\n    <ng-template tetaTabTitle>\n      @if (tab.icon) {\n      <teta-icon [name]=\"tab.icon\" [palette]=\"'text'\"></teta-icon>\n      }\n    </ng-template>\n    <ng-template tetaTabContent>\n      <ng-container\n        *ngTemplateOutlet=\"\n          tab.template;\n          context: {\n            column: column,\n            columns: columns,\n            data: data,\n            state: state,\n            close: closeDropdown\n          }\n        \"\n      ></ng-container>\n    </ng-template>\n  </teta-tab>\n  } }\n</teta-tabs>\n}\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"] }]
         }], ctorParameters: () => [{ type: TableService }, { type: TetaConfigService }, { type: i0.ChangeDetectorRef }], propDecorators: { columns: [{
                 type: Input
             }], column: [{
@@ -9719,7 +9405,7 @@ class HeadCellComponentBase {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: HeadCellComponentBase, decorators: [{
             type: Component,
             args: [{
-                    template: ''
+                    template: '',
                 }]
         }], propDecorators: { column: [{
                 type: HostBinding,
@@ -9752,14 +9438,13 @@ class DefaultHeadCellComponent extends HeadCellComponentBase {
         super();
         this._cdr = _cdr;
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DefaultHeadCellComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DefaultHeadCellComponent, isStandalone: true, selector: "teta-default-head-cell", inputs: { column: "column", columns: "columns", data: "data" }, usesInheritance: true, ngImport: i0, template: "<div class=\"column column_auto align-start justify-content-center\" [tetaHint]=\"column.hint || column.caption\">\n  <div class=\"table-head__cell__text\">\n    {{column.caption}}\n  </div>\n  @if (column.unit) {\n    <div class=\"table-head__cell__text font-caption color-text-70\">\n      [{{column.unit}}]\n    </div>\n  }\n</div>\n", styles: [":host{display:flex;min-width:0;padding:6px 8px;flex-grow:1}\n"], dependencies: [{ kind: "directive", type: HintDirective, selector: "[tetaHint]", inputs: ["tetaHint", "align", "verticalAlign", "delay", "viewType", "overflownOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DefaultHeadCellComponent, isStandalone: true, selector: "teta-default-head-cell", inputs: { column: "column", columns: "columns", data: "data" }, usesInheritance: true, ngImport: i0, template: "<div class=\"column column_auto align-start justify-content-center\" [tetaHint]=\"column.hint || column.caption\">\n  <div class=\"table-head__cell__text\">\n    {{ column.caption }}\n  </div>\n  @if (column.unit) {\n  <div class=\"table-head__cell__text font-caption color-text-70\">[{{ column.unit }}]</div>\n  }\n</div>\n", styles: [":host{display:flex;min-width:0;padding:6px 8px;flex-grow:1}\n"], dependencies: [{ kind: "directive", type: HintDirective, selector: "[tetaHint]", inputs: ["tetaHint", "align", "verticalAlign", "delay", "viewType", "overflownOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DefaultHeadCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-default-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HintDirective], template: "<div class=\"column column_auto align-start justify-content-center\" [tetaHint]=\"column.hint || column.caption\">\n  <div class=\"table-head__cell__text\">\n    {{column.caption}}\n  </div>\n  @if (column.unit) {\n    <div class=\"table-head__cell__text font-caption color-text-70\">\n      [{{column.unit}}]\n    </div>\n  }\n</div>\n", styles: [":host{display:flex;min-width:0;padding:6px 8px;flex-grow:1}\n"] }]
+            args: [{ selector: 'teta-default-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HintDirective], template: "<div class=\"column column_auto align-start justify-content-center\" [tetaHint]=\"column.hint || column.caption\">\n  <div class=\"table-head__cell__text\">\n    {{ column.caption }}\n  </div>\n  @if (column.unit) {\n  <div class=\"table-head__cell__text font-caption color-text-70\">[{{ column.unit }}]</div>\n  }\n</div>\n", styles: [":host{display:flex;min-width:0;padding:6px 8px;flex-grow:1}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { column: [{
                 type: Input
             }], columns: [{
@@ -9803,8 +9488,7 @@ class HeadCellHostComponent {
         if (!HeadCellComponentBase.isPrototypeOf(this.column.headCellComponent)) {
             this.column.headCellComponent = DefaultHeadCellComponent;
         }
-        this.componentRef =
-            this.viewContainerRef.createComponent(this.column.headCellComponent);
+        this.componentRef = this.viewContainerRef.createComponent(this.column.headCellComponent);
         this.componentRef.instance.column = this.column;
         this.componentRef.instance.columns = this.columns;
         this.componentRef.instance.data = this.data;
@@ -10015,16 +9699,14 @@ class TableHeadGroupComponent {
     }
     get flexGrow() {
         if (this.column?.columns?.length > 0) {
-            const flat = ArrayUtil.flatten(this.column?.columns, 'columns', true)
-                .filter((_) => this._hiddenColumns.indexOf(_.name) < 0);
+            const flat = ArrayUtil.flatten(this.column?.columns, 'columns', true).filter((_) => this._hiddenColumns.indexOf(_.name) < 0);
             return flat?.reduce((prev, curr) => prev + curr.flex, 0);
         }
         return this.column.flex;
     }
     get flexBasis() {
         if (this.column?.columns?.length > 0) {
-            const flat = ArrayUtil.flatten(this.column?.columns, 'columns', true)
-                .filter((_) => this._hiddenColumns.indexOf(_.name) < 0);
+            const flat = ArrayUtil.flatten(this.column?.columns, 'columns', true).filter((_) => this._hiddenColumns.indexOf(_.name) < 0);
             return flat?.reduce((prev, curr) => prev + curr.width, 0);
         }
         return this.column.width;
@@ -10036,9 +9718,7 @@ class TableHeadGroupComponent {
         this._svc = _svc;
         this._cdr = _cdr;
         this._alive = true;
-        this._svc.hiddenColumns
-            .pipe(takeWhile((_) => this._alive))
-            .subscribe((_) => {
+        this._svc.hiddenColumns.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             this._hiddenColumns = _;
             this._cdr.markForCheck();
         });
@@ -10046,17 +9726,16 @@ class TableHeadGroupComponent {
     columnIsHidden(column) {
         return this._svc.columnIsHidden(column);
     }
-    ngOnInit() {
-    }
+    ngOnInit() { }
     ngOnDestroy() {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableHeadGroupComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TableHeadGroupComponent, isStandalone: true, selector: "teta-table-head-group", inputs: { showHeadCellMenu: "showHeadCellMenu", data: "data", column: "column" }, host: { properties: { "style.flex-grow": "this.flexGrow", "style.min-width.px": "this.flexBasis", "style.flex-basis.px": "this.flexBasis" } }, ngImport: i0, template: "@if (column.columns && column.columns.length > 0) {\n  <div class=\"table-head__group__container\">\n    <div class=\"table-head__group__caption\">\n      {{column.caption}}\n    </div>\n    <div class=\"table-head__group__children\">\n      @for (col of column.columns; track col) {\n        @if (!columnIsHidden(col)) {\n          <teta-table-head-group\n            class=\"table-head__group\"\n            [data]=\"data\"\n            [showHeadCellMenu]=\"showHeadCellMenu\"\n          [column]=\"col\"></teta-table-head-group>\n        }\n      }\n    </div>\n  </div>\n}\n@if (!column.columns || column.columns.length === 0) {\n  @if (!columnIsHidden(column)) {\n    <teta-head-cell\n      class=\"table-head__cell\"\n      [data]=\"data\"\n      [showHeadCellMenu]=\"showHeadCellMenu\"\n      [attr.data-column]=\"column.name\"\n    [column]=\"column\"></teta-head-cell>\n  }\n}\n", styles: [""], dependencies: [{ kind: "component", type: TableHeadGroupComponent, selector: "teta-table-head-group", inputs: ["showHeadCellMenu", "data", "column"] }, { kind: "component", type: HeadCellComponent, selector: "teta-head-cell", inputs: ["column", "showHeadCellMenu", "data"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TableHeadGroupComponent, isStandalone: true, selector: "teta-table-head-group", inputs: { showHeadCellMenu: "showHeadCellMenu", data: "data", column: "column" }, host: { properties: { "style.flex-grow": "this.flexGrow", "style.min-width.px": "this.flexBasis", "style.flex-basis.px": "this.flexBasis" } }, ngImport: i0, template: "@if (column.columns && column.columns.length > 0) {\n<div class=\"table-head__group__container\">\n  <div class=\"table-head__group__caption\">\n    {{ column.caption }}\n  </div>\n  <div class=\"table-head__group__children\">\n    @for (col of column.columns; track col) { @if (!columnIsHidden(col)) {\n    <teta-table-head-group\n      class=\"table-head__group\"\n      [data]=\"data\"\n      [showHeadCellMenu]=\"showHeadCellMenu\"\n      [column]=\"col\"\n    ></teta-table-head-group>\n    } }\n  </div>\n</div>\n} @if (!column.columns || column.columns.length === 0) { @if (!columnIsHidden(column)) {\n<teta-head-cell\n  class=\"table-head__cell\"\n  [data]=\"data\"\n  [showHeadCellMenu]=\"showHeadCellMenu\"\n  [attr.data-column]=\"column.name\"\n  [column]=\"column\"\n></teta-head-cell>\n} }\n", styles: [""], dependencies: [{ kind: "component", type: TableHeadGroupComponent, selector: "teta-table-head-group", inputs: ["showHeadCellMenu", "data", "column"] }, { kind: "component", type: HeadCellComponent, selector: "teta-head-cell", inputs: ["column", "showHeadCellMenu", "data"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableHeadGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-table-head-group', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HeadCellComponent], template: "@if (column.columns && column.columns.length > 0) {\n  <div class=\"table-head__group__container\">\n    <div class=\"table-head__group__caption\">\n      {{column.caption}}\n    </div>\n    <div class=\"table-head__group__children\">\n      @for (col of column.columns; track col) {\n        @if (!columnIsHidden(col)) {\n          <teta-table-head-group\n            class=\"table-head__group\"\n            [data]=\"data\"\n            [showHeadCellMenu]=\"showHeadCellMenu\"\n          [column]=\"col\"></teta-table-head-group>\n        }\n      }\n    </div>\n  </div>\n}\n@if (!column.columns || column.columns.length === 0) {\n  @if (!columnIsHidden(column)) {\n    <teta-head-cell\n      class=\"table-head__cell\"\n      [data]=\"data\"\n      [showHeadCellMenu]=\"showHeadCellMenu\"\n      [attr.data-column]=\"column.name\"\n    [column]=\"column\"></teta-head-cell>\n  }\n}\n" }]
+            args: [{ selector: 'teta-table-head-group', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [HeadCellComponent], template: "@if (column.columns && column.columns.length > 0) {\n<div class=\"table-head__group__container\">\n  <div class=\"table-head__group__caption\">\n    {{ column.caption }}\n  </div>\n  <div class=\"table-head__group__children\">\n    @for (col of column.columns; track col) { @if (!columnIsHidden(col)) {\n    <teta-table-head-group\n      class=\"table-head__group\"\n      [data]=\"data\"\n      [showHeadCellMenu]=\"showHeadCellMenu\"\n      [column]=\"col\"\n    ></teta-table-head-group>\n    } }\n  </div>\n</div>\n} @if (!column.columns || column.columns.length === 0) { @if (!columnIsHidden(column)) {\n<teta-head-cell\n  class=\"table-head__cell\"\n  [data]=\"data\"\n  [showHeadCellMenu]=\"showHeadCellMenu\"\n  [attr.data-column]=\"column.name\"\n  [column]=\"column\"\n></teta-head-cell>\n} }\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { showHeadCellMenu: [{
                 type: Input
             }], data: [{
@@ -10093,9 +9772,7 @@ class SelectionHeadCellComponent {
         return this._svc.allRowsSelected();
     }
     ngOnInit() {
-        this._svc.selectedRows
-            .pipe(takeWhile((_) => this._alive))
-            .subscribe((_) => {
+        this._svc.selectedRows.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             this._cdr.markForCheck();
         });
     }
@@ -10103,11 +9780,11 @@ class SelectionHeadCellComponent {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SelectionHeadCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: SelectionHeadCellComponent, isStandalone: true, selector: "teta-selection-head-cell", host: { properties: { "class.table-head__group": "this.tableCellClass" } }, ngImport: i0, template: "<teta-checkbox [binary]=\"true\"\n               [allowNull]=\"true\"\n               [noLabel]=\"true\"\n               [ngModel]=\"allSelected()\"\n               (ngModelChange)=\"selectAll($event)\"></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: SelectionHeadCellComponent, isStandalone: true, selector: "teta-selection-head-cell", host: { properties: { "class.table-head__group": "this.tableCellClass" } }, ngImport: i0, template: "<teta-checkbox\n  [binary]=\"true\"\n  [allowNull]=\"true\"\n  [noLabel]=\"true\"\n  [ngModel]=\"allSelected()\"\n  (ngModelChange)=\"selectAll($event)\"\n></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "labelPosition", "allowNull"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: SelectionHeadCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-selection-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckboxComponent, FormsModule], template: "<teta-checkbox [binary]=\"true\"\n               [allowNull]=\"true\"\n               [noLabel]=\"true\"\n               [ngModel]=\"allSelected()\"\n               (ngModelChange)=\"selectAll($event)\"></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'teta-selection-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckboxComponent, FormsModule], template: "<teta-checkbox\n  [binary]=\"true\"\n  [allowNull]=\"true\"\n  [noLabel]=\"true\"\n  [ngModel]=\"allSelected()\"\n  (ngModelChange)=\"selectAll($event)\"\n></teta-checkbox>\n", styles: [":host{display:flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { tableCellClass: [{
                 type: HostBinding,
                 args: ['class.table-head__group']
@@ -10122,10 +9799,10 @@ class TableHeadComponent {
         return this._columns;
     }
     get locked() {
-        return this._columns.filter(_ => _.locked === true && this._hiddenColumns.indexOf(_.name) < 0);
+        return this._columns.filter((_) => _.locked === true && this._hiddenColumns.indexOf(_.name) < 0);
     }
     get unlocked() {
-        return this._columns.filter(_ => _.locked === false && this._hiddenColumns.indexOf(_.name) < 0);
+        return this._columns.filter((_) => _.locked === false && this._hiddenColumns.indexOf(_.name) < 0);
     }
     constructor(_svc, _cdr) {
         this._svc = _svc;
@@ -10141,23 +9818,23 @@ class TableHeadComponent {
     }
     ngOnInit() {
         combineLatest([this._svc.columns, this._svc.hiddenColumns])
-            .pipe(takeWhile(_ => this._alive))
+            .pipe(takeWhile((_) => this._alive))
             .subscribe((values) => {
             const [columns, hiddenColumns] = values;
             this._hiddenColumns = hiddenColumns;
             this.columns = columns;
-            const locked = ArrayUtil.flatten(columns, 'columns', true).filter(_ => this._hiddenColumns.indexOf(_.name) < 0 && _.locked);
+            const locked = ArrayUtil.flatten(columns, 'columns', true).filter((_) => this._hiddenColumns.indexOf(_.name) < 0 && _.locked);
             const startWidth = this.selectType === SelectType.checkBox ? 28 : 0;
             this.lockedFlex = locked.reduce((prev, curr) => prev + curr.flex, 0);
             this.lockedWidth = locked.reduce((prev, curr) => prev + curr.width, startWidth);
             this._cdr.markForCheck();
         });
-        this._svc.state.pipe(takeWhile(_ => this._alive)).subscribe(_ => {
+        this._svc.state.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             this.state = _;
             this._cdr.markForCheck();
         });
-        this._svc.displayData.pipe(takeWhile(_ => this._alive)).subscribe(_ => {
-            this.data = _.map(_ => _.data);
+        this._svc.displayData.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
+            this.data = _.map((_) => _.data);
             this._cdr.markForCheck();
         });
     }
@@ -10165,11 +9842,11 @@ class TableHeadComponent {
         this._alive = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableHeadComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TableHeadComponent, isStandalone: true, selector: "teta-table-head", inputs: { selectType: "selectType", showHeadCellMenu: "showHeadCellMenu" }, host: { properties: { "class.table-head": "this.tableHeadClass" } }, ngImport: i0, template: "@if (locked?.length) {\n  <div class=\"table-head_locked\"\n    [style.flex-grow]=\"lockedFlex\"\n    [style.flex-basis.px]=\"lockedWidth\"\n    [style.min-width.px]=\"lockedWidth\">\n    @if (selectType === selectTypeEnum.checkBox) {\n      <teta-selection-head-cell\n      style=\"width: 28px;\"></teta-selection-head-cell>\n    }\n    @for (column of locked; track track($index, column)) {\n      <teta-table-head-group\n        class=\"table-head__group\"\n        [data]=\"data\"\n        [showHeadCellMenu]=\"showHeadCellMenu\"\n      [column]=\"column\"></teta-table-head-group>\n    }\n  </div>\n}\n@if (unlocked?.length) {\n  @if (selectType === selectTypeEnum.checkBox && locked?.length < 1) {\n    <teta-selection-head-cell\n    style=\"width: 28px;\"></teta-selection-head-cell>\n  }\n  @for (column of unlocked; track track($index, column)) {\n    <teta-table-head-group\n      class=\"table-head__group\"\n      [data]=\"data\"\n      [showHeadCellMenu]=\"showHeadCellMenu\"\n    [column]=\"column\"></teta-table-head-group>\n  }\n}\n", styles: [""], dependencies: [{ kind: "component", type: SelectionHeadCellComponent, selector: "teta-selection-head-cell" }, { kind: "component", type: TableHeadGroupComponent, selector: "teta-table-head-group", inputs: ["showHeadCellMenu", "data", "column"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: TableHeadComponent, isStandalone: true, selector: "teta-table-head", inputs: { selectType: "selectType", showHeadCellMenu: "showHeadCellMenu" }, host: { properties: { "class.table-head": "this.tableHeadClass" } }, ngImport: i0, template: "@if (locked?.length) {\n<div\n  class=\"table-head_locked\"\n  [style.flex-grow]=\"lockedFlex\"\n  [style.flex-basis.px]=\"lockedWidth\"\n  [style.min-width.px]=\"lockedWidth\"\n>\n  @if (selectType === selectTypeEnum.checkBox) {\n  <teta-selection-head-cell style=\"width: 28px\"></teta-selection-head-cell>\n  } @for (column of locked; track track($index, column)) {\n  <teta-table-head-group\n    class=\"table-head__group\"\n    [data]=\"data\"\n    [showHeadCellMenu]=\"showHeadCellMenu\"\n    [column]=\"column\"\n  ></teta-table-head-group>\n  }\n</div>\n} @if (unlocked?.length) { @if (selectType === selectTypeEnum.checkBox && locked?.length < 1) {\n<teta-selection-head-cell style=\"width: 28px\"></teta-selection-head-cell>\n} @for (column of unlocked; track track($index, column)) {\n<teta-table-head-group\n  class=\"table-head__group\"\n  [data]=\"data\"\n  [showHeadCellMenu]=\"showHeadCellMenu\"\n  [column]=\"column\"\n></teta-table-head-group>\n} }\n", styles: [""], dependencies: [{ kind: "component", type: SelectionHeadCellComponent, selector: "teta-selection-head-cell" }, { kind: "component", type: TableHeadGroupComponent, selector: "teta-table-head-group", inputs: ["showHeadCellMenu", "data", "column"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableHeadComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-table-head', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [SelectionHeadCellComponent, TableHeadGroupComponent], template: "@if (locked?.length) {\n  <div class=\"table-head_locked\"\n    [style.flex-grow]=\"lockedFlex\"\n    [style.flex-basis.px]=\"lockedWidth\"\n    [style.min-width.px]=\"lockedWidth\">\n    @if (selectType === selectTypeEnum.checkBox) {\n      <teta-selection-head-cell\n      style=\"width: 28px;\"></teta-selection-head-cell>\n    }\n    @for (column of locked; track track($index, column)) {\n      <teta-table-head-group\n        class=\"table-head__group\"\n        [data]=\"data\"\n        [showHeadCellMenu]=\"showHeadCellMenu\"\n      [column]=\"column\"></teta-table-head-group>\n    }\n  </div>\n}\n@if (unlocked?.length) {\n  @if (selectType === selectTypeEnum.checkBox && locked?.length < 1) {\n    <teta-selection-head-cell\n    style=\"width: 28px;\"></teta-selection-head-cell>\n  }\n  @for (column of unlocked; track track($index, column)) {\n    <teta-table-head-group\n      class=\"table-head__group\"\n      [data]=\"data\"\n      [showHeadCellMenu]=\"showHeadCellMenu\"\n    [column]=\"column\"></teta-table-head-group>\n  }\n}\n" }]
+            args: [{ selector: 'teta-table-head', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [SelectionHeadCellComponent, TableHeadGroupComponent], template: "@if (locked?.length) {\n<div\n  class=\"table-head_locked\"\n  [style.flex-grow]=\"lockedFlex\"\n  [style.flex-basis.px]=\"lockedWidth\"\n  [style.min-width.px]=\"lockedWidth\"\n>\n  @if (selectType === selectTypeEnum.checkBox) {\n  <teta-selection-head-cell style=\"width: 28px\"></teta-selection-head-cell>\n  } @for (column of locked; track track($index, column)) {\n  <teta-table-head-group\n    class=\"table-head__group\"\n    [data]=\"data\"\n    [showHeadCellMenu]=\"showHeadCellMenu\"\n    [column]=\"column\"\n  ></teta-table-head-group>\n  }\n</div>\n} @if (unlocked?.length) { @if (selectType === selectTypeEnum.checkBox && locked?.length < 1) {\n<teta-selection-head-cell style=\"width: 28px\"></teta-selection-head-cell>\n} @for (column of unlocked; track track($index, column)) {\n<teta-table-head-group\n  class=\"table-head__group\"\n  [data]=\"data\"\n  [showHeadCellMenu]=\"showHeadCellMenu\"\n  [column]=\"column\"\n></teta-table-head-group>\n} }\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { selectType: [{
                 type: Input
             }], showHeadCellMenu: [{
@@ -10224,11 +9901,11 @@ class TableComponent {
         this.verticalAlign = VerticalAlign;
         this.align = Align;
         this._alive = true;
-        this.onScroll = event => {
+        this.onScroll = (event) => {
             this._headElement.scrollLeft = event.target.scrollLeft;
         };
         this._svc.state
-            .pipe(takeWhile(() => this._alive), filter$1(state => state !== this._state))
+            .pipe(takeWhile(() => this._alive), filter$1((state) => state !== this._state))
             .subscribe((state) => this.stateChange.next(state));
         this._svc.editCellStart
             .pipe(takeWhile(() => this._alive))
@@ -10242,21 +9919,15 @@ class TableComponent {
         this._svc.editRowStop
             .pipe(takeWhile(() => this._alive))
             .subscribe((item) => this.rowEditEnd.emit(this._svc.getRowByIndex(item?.row)));
-        this._svc.selectedRows
-            .pipe(takeWhile(() => this._alive))
-            .subscribe((items) => {
+        this._svc.selectedRows.pipe(takeWhile(() => this._alive)).subscribe((items) => {
             this.selectedRowsList = items;
             this.selectedRowsChange.emit(items);
         });
-        this._svc.activeRow
-            .pipe(takeWhile(() => this._alive))
-            .subscribe((item) => {
+        this._svc.activeRow.pipe(takeWhile(() => this._alive)).subscribe((item) => {
             this.activeRow = item;
             this.activeRowChange.emit(item);
         });
-        this._svc.valueChanged
-            .pipe(takeWhile(() => this._alive))
-            .subscribe((coordinates) => {
+        this._svc.valueChanged.pipe(takeWhile(() => this._alive)).subscribe((coordinates) => {
             this.valueChange.emit(this._svc.getCellInstance(coordinates));
         });
     }
@@ -10373,8 +10044,7 @@ class TableComponent {
             });
             if (event.key && (event.key.length === 1 || event.key === 'Delete')) {
                 const column = this._svc.getColumnByName(coordinates.column);
-                if (column.filterType !== FilterType.number ||
-                    isFinite(event.key)) {
+                if (column.filterType !== FilterType.number || isFinite(event.key)) {
                     this.startEditRowOrCell({
                         row: coordinates.row,
                         column: coordinates.column,
@@ -10429,8 +10099,7 @@ class TableComponent {
         this.tableService.emit(this._svc);
     }
     ngAfterViewInit() {
-        this._headElement =
-            this._elementRef.nativeElement.querySelector('.table-head');
+        this._headElement = this._elementRef.nativeElement.querySelector('.table-head');
     }
     ngOnDestroy() {
         this._alive = false;
@@ -10458,8 +10127,8 @@ class TableComponent {
         }
         if (Object.prototype.hasOwnProperty.call(changes, 'data')) {
             this._svc.setData(this.data);
-            this._svc.selectRows(this.data?.filter(row => {
-                return this.selectedRows?.some(selectedRow => this.trackRow(this._svc.getRowIndex(selectedRow), selectedRow) ===
+            this._svc.selectRows(this.data?.filter((row) => {
+                return this.selectedRows?.some((selectedRow) => this.trackRow(this._svc.getRowIndex(selectedRow), selectedRow) ===
                     this.trackRow(this._svc.getRowIndex(row), row));
             }));
         }
@@ -10537,15 +10206,11 @@ class TableComponent {
         return null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableComponent, deps: [{ token: TableService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: TableComponent, isStandalone: true, selector: "teta-table", inputs: { data: "data", columns: "columns", dict: "dict", filterOptions: "filterOptions", state: "state", cookieName: "cookieName", virtual: "virtual", detailComponent: "detailComponent", activeRow: "activeRow", selectedRows: "selectedRows", selectType: "selectType", aggregate: "aggregate", trackRow: "trackRow", trackColumns: "trackColumns", editType: "editType", editEvent: "editEvent", rowEditable: "rowEditable", rowClass: "rowClass", scrollToIndex: "scrollToIndex", showHeadCellMenu: "showHeadCellMenu", contextMenu: "contextMenu", contextMenuOpen: "contextMenuOpen" }, outputs: { contextMenuOpenChange: "contextMenuOpenChange", stateChange: "stateChange", bodyLeft: "bodyLeft", activeRowChange: "activeRowChange", selectedRowsChange: "selectedRowsChange", cellClick: "cellClick", cellDoubleClick: "cellDoubleClick", cellFocus: "cellFocus", cellKeyDown: "cellKeyDown", rowLeft: "rowLeft", rowEditStart: "rowEditStart", rowEditEnd: "rowEditEnd", cellEditStart: "cellEditStart", cellEditEnd: "cellEditEnd", valueChange: "valueChange", tableService: "tableService" }, host: { listeners: { "document:click": "handleClickOutsideAnyRow($event)", "focusin": "focusIn($event)", "dblclick": "dblclick($event)", "keydown": "keydown($event)", "mousedown": "mousedown($event)" }, properties: { "class.table": "this.tableClass" } }, providers: [TableService], viewQueries: [{ propertyName: "menu", first: true, predicate: ["contextMenu"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class='column column_auto'>\n  <teta-table-head\n    style='z-index: 1'\n    [selectType]='selectType'\n    [showHeadCellMenu]='showHeadCellMenu'></teta-table-head>\n  <div class='column column_auto position-relative'\n       style='z-index: 0'\n       [tetaContextMenu]='contextMenu'\n       [verticalAlign]='verticalAlign.auto'\n       [align]='align.auto'\n       [appendToBody]='true'\n       [data]='contextMenuRow'\n       [open]='contextMenuOpen'\n       (openChange)='setContextMenuOpen($event)'>\n    <teta-table-body\n      (contextmenu)='setContextMenuRow($event)'\n      (scrollChange)='onScroll($event)'\n      [aggregate]='aggregate'\n      [virtual]='virtual'\n      [activeRow]='activeRow'\n      [trackRow]='trackRow'\n      [trackColumns]='trackColumns'\n      [selectedRows]='selectedRowsList'\n      [additionalComponent]='detailComponent'\n      [selectType]='selectType'\n      [rowClass]='rowClass'>\n      <ng-content></ng-content>\n    </teta-table-body>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: TableHeadComponent, selector: "teta-table-head", inputs: ["selectType", "showHeadCellMenu"] }, { kind: "directive", type: ContextMenuDirective, selector: "[tetaContextMenu]", inputs: ["tetaContextMenu", "autoCloseIgnore"] }, { kind: "component", type: TableBodyComponent, selector: "teta-table-body", inputs: ["virtual", "activeRow", "selectedRows", "additionalComponent", "aggregate", "selectType", "rowClass", "trackRow", "trackColumns"], outputs: ["scrollChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: TableComponent, isStandalone: true, selector: "teta-table", inputs: { data: "data", columns: "columns", dict: "dict", filterOptions: "filterOptions", state: "state", cookieName: "cookieName", virtual: "virtual", detailComponent: "detailComponent", activeRow: "activeRow", selectedRows: "selectedRows", selectType: "selectType", aggregate: "aggregate", trackRow: "trackRow", trackColumns: "trackColumns", editType: "editType", editEvent: "editEvent", rowEditable: "rowEditable", rowClass: "rowClass", scrollToIndex: "scrollToIndex", showHeadCellMenu: "showHeadCellMenu", contextMenu: "contextMenu", contextMenuOpen: "contextMenuOpen" }, outputs: { contextMenuOpenChange: "contextMenuOpenChange", stateChange: "stateChange", bodyLeft: "bodyLeft", activeRowChange: "activeRowChange", selectedRowsChange: "selectedRowsChange", cellClick: "cellClick", cellDoubleClick: "cellDoubleClick", cellFocus: "cellFocus", cellKeyDown: "cellKeyDown", rowLeft: "rowLeft", rowEditStart: "rowEditStart", rowEditEnd: "rowEditEnd", cellEditStart: "cellEditStart", cellEditEnd: "cellEditEnd", valueChange: "valueChange", tableService: "tableService" }, host: { listeners: { "document:click": "handleClickOutsideAnyRow($event)", "focusin": "focusIn($event)", "dblclick": "dblclick($event)", "keydown": "keydown($event)", "mousedown": "mousedown($event)" }, properties: { "class.table": "this.tableClass" } }, providers: [TableService], viewQueries: [{ propertyName: "menu", first: true, predicate: ["contextMenu"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"column column_auto\">\n  <teta-table-head style=\"z-index: 1\" [selectType]=\"selectType\" [showHeadCellMenu]=\"showHeadCellMenu\"></teta-table-head>\n  <div\n    class=\"column column_auto position-relative\"\n    style=\"z-index: 0\"\n    [tetaContextMenu]=\"contextMenu\"\n    [verticalAlign]=\"verticalAlign.auto\"\n    [align]=\"align.auto\"\n    [appendToBody]=\"true\"\n    [data]=\"contextMenuRow\"\n    [open]=\"contextMenuOpen\"\n    (openChange)=\"setContextMenuOpen($event)\"\n  >\n    <teta-table-body\n      (contextmenu)=\"setContextMenuRow($event)\"\n      (scrollChange)=\"onScroll($event)\"\n      [aggregate]=\"aggregate\"\n      [virtual]=\"virtual\"\n      [activeRow]=\"activeRow\"\n      [trackRow]=\"trackRow\"\n      [trackColumns]=\"trackColumns\"\n      [selectedRows]=\"selectedRowsList\"\n      [additionalComponent]=\"detailComponent\"\n      [selectType]=\"selectType\"\n      [rowClass]=\"rowClass\"\n    >\n      <ng-content></ng-content>\n    </teta-table-body>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: TableHeadComponent, selector: "teta-table-head", inputs: ["selectType", "showHeadCellMenu"] }, { kind: "directive", type: ContextMenuDirective, selector: "[tetaContextMenu]", inputs: ["tetaContextMenu", "autoCloseIgnore"] }, { kind: "component", type: TableBodyComponent, selector: "teta-table-body", inputs: ["virtual", "activeRow", "selectedRows", "additionalComponent", "aggregate", "selectType", "rowClass", "trackRow", "trackColumns"], outputs: ["scrollChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TableService], standalone: true, imports: [
-                        TableHeadComponent,
-                        ContextMenuDirective,
-                        TableBodyComponent,
-                    ], template: "<div class='column column_auto'>\n  <teta-table-head\n    style='z-index: 1'\n    [selectType]='selectType'\n    [showHeadCellMenu]='showHeadCellMenu'></teta-table-head>\n  <div class='column column_auto position-relative'\n       style='z-index: 0'\n       [tetaContextMenu]='contextMenu'\n       [verticalAlign]='verticalAlign.auto'\n       [align]='align.auto'\n       [appendToBody]='true'\n       [data]='contextMenuRow'\n       [open]='contextMenuOpen'\n       (openChange)='setContextMenuOpen($event)'>\n    <teta-table-body\n      (contextmenu)='setContextMenuRow($event)'\n      (scrollChange)='onScroll($event)'\n      [aggregate]='aggregate'\n      [virtual]='virtual'\n      [activeRow]='activeRow'\n      [trackRow]='trackRow'\n      [trackColumns]='trackColumns'\n      [selectedRows]='selectedRowsList'\n      [additionalComponent]='detailComponent'\n      [selectType]='selectType'\n      [rowClass]='rowClass'>\n      <ng-content></ng-content>\n    </teta-table-body>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'teta-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TableService], standalone: true, imports: [TableHeadComponent, ContextMenuDirective, TableBodyComponent], template: "<div class=\"column column_auto\">\n  <teta-table-head style=\"z-index: 1\" [selectType]=\"selectType\" [showHeadCellMenu]=\"showHeadCellMenu\"></teta-table-head>\n  <div\n    class=\"column column_auto position-relative\"\n    style=\"z-index: 0\"\n    [tetaContextMenu]=\"contextMenu\"\n    [verticalAlign]=\"verticalAlign.auto\"\n    [align]=\"align.auto\"\n    [appendToBody]=\"true\"\n    [data]=\"contextMenuRow\"\n    [open]=\"contextMenuOpen\"\n    (openChange)=\"setContextMenuOpen($event)\"\n  >\n    <teta-table-body\n      (contextmenu)=\"setContextMenuRow($event)\"\n      (scrollChange)=\"onScroll($event)\"\n      [aggregate]=\"aggregate\"\n      [virtual]=\"virtual\"\n      [activeRow]=\"activeRow\"\n      [trackRow]=\"trackRow\"\n      [trackColumns]=\"trackColumns\"\n      [selectedRows]=\"selectedRowsList\"\n      [additionalComponent]=\"detailComponent\"\n      [selectType]=\"selectType\"\n      [rowClass]=\"rowClass\"\n    >\n      <ng-content></ng-content>\n    </teta-table-body>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ElementRef }], propDecorators: { data: [{
                 type: Input
             }], columns: [{
@@ -10666,16 +10331,11 @@ class DateTimeCellComponent extends CellComponentBase {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateTimeCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateTimeCellComponent, isStandalone: true, selector: "teta-date-time-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class='cell-text'\n  [class.cell-text_disabled]='!editable'>\n  {{control?.value | date : 'dd.MM.yyyy HH:mm:ss'}}\n</span>\n@if (edit) {\n  <teta-date-picker class='datepicker-table'\n    #input\n    [appendToBody]='true'\n    [showTime]='true'\n    [formControl]='control'\n  ></teta-date-picker>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DateTimeCellComponent, isStandalone: true, selector: "teta-date-time-cell", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value | date : 'dd.MM.yyyy HH:mm:ss' }}\n</span>\n@if (edit) {\n<teta-date-picker\n  class=\"datepicker-table\"\n  #input\n  [appendToBody]=\"true\"\n  [showTime]=\"true\"\n  [formControl]=\"control\"\n></teta-date-picker>\n}\n", styles: [""], dependencies: [{ kind: "component", type: DatePickerComponent, selector: "teta-date-picker", inputs: ["date", "showTime", "minDate", "maxDate", "invalid", "disabled", "align", "verticalAlign", "viewType", "appendToBody", "backdrop", "allowNull", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minYearDate", "maxYearDate"], outputs: ["selectDate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DateTimeCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-date-time-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        DatePickerComponent,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        DatePipe,
-                    ], template: "<span [style.display]=\"edit ? 'none' : 'block'\"\n  class='cell-text'\n  [class.cell-text_disabled]='!editable'>\n  {{control?.value | date : 'dd.MM.yyyy HH:mm:ss'}}\n</span>\n@if (edit) {\n  <teta-date-picker class='datepicker-table'\n    #input\n    [appendToBody]='true'\n    [showTime]='true'\n    [formControl]='control'\n  ></teta-date-picker>\n}\n" }]
+            args: [{ selector: 'teta-date-time-cell', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DatePickerComponent, FormsModule, ReactiveFormsModule, DatePipe], template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\" [class.cell-text_disabled]=\"!editable\">\n  {{ control?.value | date : 'dd.MM.yyyy HH:mm:ss' }}\n</span>\n@if (edit) {\n<teta-date-picker\n  class=\"datepicker-table\"\n  #input\n  [appendToBody]=\"true\"\n  [showTime]=\"true\"\n  [formControl]=\"control\"\n></teta-date-picker>\n}\n" }]
         }], ctorParameters: () => [{ type: TableService }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input', { static: false }]
@@ -10737,11 +10397,11 @@ class DividerComponent {
     constructor() { }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DividerComponent, isStandalone: true, selector: "teta-divider", inputs: { label: "label", template: "template" }, ngImport: i0, template: "<div class=\"divider\" style=\"width: 100%\">\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n  @if (!template) {\n    <div class=\"divider-content padding-h-2\">{{ label }}</div>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n  }\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n</div>\n\n", styles: [""], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.1", type: DividerComponent, isStandalone: true, selector: "teta-divider", inputs: { label: "label", template: "template" }, ngImport: i0, template: "<div class=\"divider\" style=\"width: 100%\">\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n  @if (!template) {\n  <div class=\"divider-content padding-h-2\">{{ label }}</div>\n  } @else {\n  <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n  }\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DividerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-divider', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgTemplateOutlet], template: "<div class=\"divider\" style=\"width: 100%\">\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n  @if (!template) {\n    <div class=\"divider-content padding-h-2\">{{ label }}</div>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n  }\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n</div>\n\n" }]
+            args: [{ selector: 'teta-divider', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgTemplateOutlet], template: "<div class=\"divider\" style=\"width: 100%\">\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n  @if (!template) {\n  <div class=\"divider-content padding-h-2\">{{ label }}</div>\n  } @else {\n  <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n  }\n  <div class=\"bg-text-20\" style=\"height: 1px\"></div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { label: [{
                 type: Input
             }], template: [{
@@ -10756,7 +10416,7 @@ class ResizePanelComponent {
         return this._direction;
     }
     get icon() {
-        return this.direction === "horizontal" ? 'moreHorizontal' : 'moreVertical';
+        return this.direction === 'horizontal' ? 'moreHorizontal' : 'moreVertical';
     }
     set grabPosition(val) {
         this._grabPosition = val;
@@ -10813,8 +10473,7 @@ class ResizePanelComponent {
     ngOnInit() {
         this.restorePosition();
     }
-    ngOnDestroy() {
-    }
+    ngOnDestroy() { }
     getClassName() {
         return this._positionMap.get(this.grabPosition) || '';
     }
@@ -10885,15 +10544,11 @@ class ResizePanelComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ResizePanelComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ResizePanelComponent, isStandalone: true, selector: "teta-resize-panel", inputs: { size: "size", direction: "direction", grabPosition: "grabPosition", name: "name", minSize: "minSize", maxSize: "maxSize" }, host: { properties: { "class.resize-panel": "this.resizePanelClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n<div #grab class=\"resize-grab\"\n     [style.width.px]=\"direction === 'vertical' ? size : ''\"\n     [style.height.px]=\"direction === 'horizontal' ? size : ''\"\n     (resizeStart)=\"resizeStart($event)\"\n     (resizeProcess)=\"resizeProcess($event)\"\n     (resizeEnd)=\"resizeEnd($event)\"\n     [tetaResizeDrag]=\"direction\"\n     [ngClass]=\"getClassName()\">\n  <teta-icon [name]=\"icon\" [palette]=\"'text'\"></teta-icon>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: ResizeDragDirective, selector: "[tetaResizeDrag]", inputs: ["tetaResizeDrag"], outputs: ["resizeStart", "resizeProcess", "resizeEnd"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.1", type: ResizePanelComponent, isStandalone: true, selector: "teta-resize-panel", inputs: { size: "size", direction: "direction", grabPosition: "grabPosition", name: "name", minSize: "minSize", maxSize: "maxSize" }, host: { properties: { "class.resize-panel": "this.resizePanelClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n<div\n  #grab\n  class=\"resize-grab\"\n  [style.width.px]=\"direction === 'vertical' ? size : ''\"\n  [style.height.px]=\"direction === 'horizontal' ? size : ''\"\n  (resizeStart)=\"resizeStart($event)\"\n  (resizeProcess)=\"resizeProcess($event)\"\n  (resizeEnd)=\"resizeEnd($event)\"\n  [tetaResizeDrag]=\"direction\"\n  [ngClass]=\"getClassName()\"\n>\n  <teta-icon [name]=\"icon\" [palette]=\"'text'\"></teta-icon>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: ResizeDragDirective, selector: "[tetaResizeDrag]", inputs: ["tetaResizeDrag"], outputs: ["resizeStart", "resizeProcess", "resizeEnd"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: ResizePanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-resize-panel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        ResizeDragDirective,
-                        NgClass,
-                        IconComponent,
-                    ], template: "<ng-content></ng-content>\n<div #grab class=\"resize-grab\"\n     [style.width.px]=\"direction === 'vertical' ? size : ''\"\n     [style.height.px]=\"direction === 'horizontal' ? size : ''\"\n     (resizeStart)=\"resizeStart($event)\"\n     (resizeProcess)=\"resizeProcess($event)\"\n     (resizeEnd)=\"resizeEnd($event)\"\n     [tetaResizeDrag]=\"direction\"\n     [ngClass]=\"getClassName()\">\n  <teta-icon [name]=\"icon\" [palette]=\"'text'\"></teta-icon>\n</div>\n" }]
+            args: [{ selector: 'teta-resize-panel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ResizeDragDirective, NgClass, IconComponent], template: "<ng-content></ng-content>\n<div\n  #grab\n  class=\"resize-grab\"\n  [style.width.px]=\"direction === 'vertical' ? size : ''\"\n  [style.height.px]=\"direction === 'horizontal' ? size : ''\"\n  (resizeStart)=\"resizeStart($event)\"\n  (resizeProcess)=\"resizeProcess($event)\"\n  (resizeEnd)=\"resizeEnd($event)\"\n  [tetaResizeDrag]=\"direction\"\n  [ngClass]=\"getClassName()\"\n>\n  <teta-icon [name]=\"icon\" [palette]=\"'text'\"></teta-icon>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -10954,7 +10609,7 @@ class AutoPositionDirective {
             left: 0,
             right: 0,
             top: 0,
-            bottom: 0
+            bottom: 0,
         };
         if (targetTransformedParent) {
             parentPosition = targetTransformedParent.getBoundingClientRect();
@@ -10969,7 +10624,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaAutoPosition]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { align: [{
                 type: Input
@@ -11054,7 +10709,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaDragPreview]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }] });
@@ -11076,9 +10731,11 @@ class DragDropService {
         this._renderer = this._rendererFactory.createRenderer(null, null);
         this.dropTarget = this.dropTarget$.asObservable();
         this.dropped = this.dropped$.asObservable();
-        merge(fromEvent(this._document, 'mousemove'), fromEvent(this._document, 'touchmove')).pipe(filter$1(() => {
+        merge(fromEvent(this._document, 'mousemove'), fromEvent(this._document, 'touchmove'))
+            .pipe(filter$1(() => {
             return this.startPosition != null;
-        })).subscribe((event) => {
+        }))
+            .subscribe((event) => {
             if (!this.dragProcess && this.getDelta(event) > this._delta) {
                 this.startProcess();
             }
@@ -11086,20 +10743,21 @@ class DragDropService {
                 this.movePreview(event);
             }
         });
-        merge(fromEvent(this._document, 'mouseup'), fromEvent(this._document, 'touchend')).pipe(withLatestFrom(this.dropTarget)).subscribe((data) => {
+        merge(fromEvent(this._document, 'mouseup'), fromEvent(this._document, 'touchend'))
+            .pipe(withLatestFrom(this.dropTarget))
+            .subscribe((data) => {
             const [event, target] = data;
             if (target) {
                 this.dropped$.next({
                     target,
                     container: this.dragProcess.selection.container,
-                    data: [...this.dragProcess.selection.items]
+                    data: [...this.dragProcess.selection.items],
                 });
                 this.cancelDrag();
             }
             this.stopProcess();
         });
-        merge(fromEvent(this._document, 'visibilitychange'), fromEvent(window, 'blur'))
-            .subscribe(() => {
+        merge(fromEvent(this._document, 'visibilitychange'), fromEvent(window, 'blur')).subscribe(() => {
             this.cancelDrag();
         });
     }
@@ -11117,7 +10775,7 @@ class DragDropService {
         }
         this.selection = {
             container,
-            items: [instance]
+            items: [instance],
         };
     }
     addSelection(instance, container) {
@@ -11146,7 +10804,7 @@ class DragDropService {
     }
     startProcess() {
         this.dragProcess = {
-            selection: this.selection
+            selection: this.selection,
         };
         this._document.body.style.cursor = 'copy';
         this._preview = this.createPreview();
@@ -11164,7 +10822,7 @@ class DragDropService {
         if (this.dragProcess.selection.container.previewTemplate) {
             this._previewRef = this.dragProcess.selection.container.viewContainer.createEmbeddedView(this.dragProcess.selection.container.previewTemplate, {
                 $implicit: this.dragProcess.selection.items,
-                data: this.dragProcess.selection.items
+                data: this.dragProcess.selection.items,
             });
             const preview = this._renderer.createElement('div');
             this._renderer.setStyle(preview, 'position', 'fixed');
@@ -11196,7 +10854,7 @@ class DragDropService {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DragDropService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: 'root',
                 }]
         }], ctorParameters: () => [{ type: Document, decorators: [{
                     type: Inject,
@@ -11234,15 +10892,13 @@ class DragContainerDirective {
         this.instance = new DragContainerInstance({
             data: this.data,
             previewTemplate: this._previewTemplate?.templateRef,
-            viewContainer: this._viewContainerRef
+            viewContainer: this._viewContainerRef,
         });
-        this._dragService.dropTarget.pipe(takeWhile(() => this._alive))
-            .subscribe((target) => {
+        this._dragService.dropTarget.pipe(takeWhile(() => this._alive)).subscribe((target) => {
             this.dropTarget = target;
             this._cdr.detectChanges();
         });
-        this._dragService.dropped.pipe(takeWhile(() => this._alive))
-            .subscribe((event) => {
+        this._dragService.dropped.pipe(takeWhile(() => this._alive)).subscribe((event) => {
             this.tetaDrop.emit(event);
         });
     }
@@ -11259,9 +10915,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
                     exportAs: 'dragContainer',
                     host: {
                         '[class.teta-drag-container]': '"true"',
-                        '[class.teta-drop-target]': 'isDropTarget'
+                        '[class.teta-drop-target]': 'isDropTarget',
                     },
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: DragDropService }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }], propDecorators: { data: [{
                 type: Input,
@@ -11277,7 +10933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             }], _previewTemplate: [{
                 type: ContentChild,
                 args: [DragPreviewDirective, {
-                        static: true
+                        static: true,
                     }]
             }], mouseleave: [{
                 type: HostListener,
@@ -11322,8 +10978,7 @@ class DragDirective {
     mouseenter(event) {
         if (this.allowDrop) {
             event.stopPropagation();
-            if (this.allowDropPredicate === undefined ||
-                this.allowDropPredicate(this._dragService.selection, this.data)) {
+            if (this.allowDropPredicate === undefined || this.allowDropPredicate(this._dragService.selection, this.data)) {
                 this._dragService.setDropTarget(this.instance);
             }
         }
@@ -11347,9 +11002,7 @@ class DragDirective {
             container: this._container?.instance,
             data: this.data,
         });
-        this._dragService.dropTarget
-            .pipe(takeWhile(() => this._alive))
-            .subscribe(target => {
+        this._dragService.dropTarget.pipe(takeWhile(() => this._alive)).subscribe((target) => {
             this.dropTarget = target;
             if (target === this.instance) {
                 this.tetaDragEnter.emit(this.instance);
@@ -11362,7 +11015,7 @@ class DragDirective {
             .pipe(filter$1((event) => {
             return event.target === this.instance;
         }))
-            .subscribe(event => {
+            .subscribe((event) => {
             this.tetaDrop.emit(event);
         });
     }
@@ -11439,7 +11092,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaDragPlaceholder]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [] });
@@ -11472,8 +11125,7 @@ class DragSortContainerDirective {
         const list = this.getList();
         const sourceIndex = list.indexOf(source);
         const targetIndex = list.indexOf(target);
-        if ((insertBefore && sourceIndex + 1 === targetIndex) ||
-            (!insertBefore && sourceIndex === targetIndex + 1)) {
+        if ((insertBefore && sourceIndex + 1 === targetIndex) || (!insertBefore && sourceIndex === targetIndex + 1)) {
             return;
         }
         const newIndex = list.indexOf(target) + (insertBefore ? 0 : 1);
@@ -11556,23 +11208,17 @@ class DragSortItemDirective {
         this._dragElement = this._renderer.createElement('div');
         this._renderer.appendChild(this._elementRef.nativeElement, this._dragElement);
         this._renderer.addClass(this._dragElement, 'drop-direction');
-        this._renderer.addClass(this._dragElement, this.dragSortDirection === 'horizontal'
-            ? 'drop-direction-horizontal'
-            : 'drop-direction-vertical');
+        this._renderer.addClass(this._dragElement, this.dragSortDirection === 'horizontal' ? 'drop-direction-horizontal' : 'drop-direction-vertical');
     }
     destroyDrag() {
         this._renderer.removeChild(this._renderer, this._dragElement);
     }
     getDropPosition(event) {
         if (this.dragSortDirection === 'horizontal') {
-            return event.clientX >= this.rect.x + this.rect.width / 2
-                ? 'end'
-                : 'start';
+            return event.clientX >= this.rect.x + this.rect.width / 2 ? 'end' : 'start';
         }
         else {
-            return event.clientY >= this.rect.y + this.rect.height / 2
-                ? 'end'
-                : 'start';
+            return event.clientY >= this.rect.y + this.rect.height / 2 ? 'end' : 'start';
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.1", ngImport: i0, type: DragSortItemDirective, deps: [{ token: DragSortContainerDirective, host: true }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
@@ -11639,7 +11285,7 @@ class LoaderDirective {
         this._alive = true;
         this._loading = false;
         this._element = this._elementRef.nativeElement;
-        this._zone.onStable.pipe(takeWhile(_ => this._alive)).subscribe(_ => {
+        this._zone.onStable.pipe(takeWhile((_) => this._alive)).subscribe((_) => {
             if (this._loading && this._loader) {
                 this.setPosition();
             }
@@ -11723,14 +11369,13 @@ class TooltipDirective extends DynamicContentBaseDirective {
     }
     ngOnInit() {
         merge(this._click.click, this._click.contextMenu)
-            .pipe(takeWhile(() => this._alive), filter$1(() => this._open), filter$1(() => this._componentRef != null), filter$1((event) => !DomUtil.clickedInside(this._elementRef.nativeElement, event)), filter$1((event) => !DomUtil.clickedInside(this._componentRef?.location.nativeElement, event)), tap(_ => this.destroyContentRef()))
+            .pipe(takeWhile(() => this._alive), filter$1(() => this._open), filter$1(() => this._componentRef != null), filter$1((event) => !DomUtil.clickedInside(this._elementRef.nativeElement, event)), filter$1((event) => !DomUtil.clickedInside(this._componentRef?.location.nativeElement, event)), tap((_) => this.destroyContentRef()))
             .subscribe();
     }
     setPosition() {
         if (this._componentRef && this._open) {
             if (!this._componentRect) {
-                this._componentRect =
-                    this._componentRef.location.nativeElement.getBoundingClientRect();
+                this._componentRect = this._componentRef.location.nativeElement.getBoundingClientRect();
             }
             const containerPosition = this._elementRef.nativeElement.getBoundingClientRect();
             const position = PositionUtil.getPosition(containerPosition, this._componentRect, this.align, this.verticalAlign, 0, 12);
@@ -11806,7 +11451,7 @@ class ScrollIntoViewDirective {
             if (coerceBooleanProperty(this.tetaScrollIntoView)) {
                 this.elementRef.nativeElement.scrollIntoView({
                     behavior: 'smooth',
-                    block: 'start'
+                    block: 'start',
                 });
             }
         }
@@ -11818,7 +11463,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Directive,
             args: [{
                     selector: '[tetaScrollIntoView]',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
@@ -11862,7 +11507,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.1", ngImpor
             type: Pipe,
             args: [{
                     name: 'tetaDate',
-                    standalone: true
+                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i1$2.TranslocoService }] });
@@ -11971,15 +11616,7 @@ const ruLocale = {
         'Ноябрь',
         'Декабрь',
     ],
-    days: [
-        'Воскресенье',
-        'Понедельник',
-        'Вторник',
-        'Среда',
-        'Четверг',
-        'Пятниуа',
-        'Суббота',
-    ],
+    days: ['Воскресенье', 'Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятниуа', 'Суббота'],
     daysShort: ['Вс', 'Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб'],
 };
@@ -12011,14 +11648,14 @@ const WINDOW = new InjectionToken('An abstraction over global window object', {
 });
 function tetaZoneFull(ngZone) {
-    return source => new Observable(subscriber => source.subscribe({
-        next: value => ngZone.run(() => subscriber.next(value)),
+    return (source) => new Observable((subscriber) => source.subscribe({
+        next: (value) => ngZone.run(() => subscriber.next(value)),
         error: (error) => ngZone.run(() => subscriber.error(error)),
         complete: () => ngZone.run(() => subscriber.complete()),
     }));
 }
 function tetaZoneFree(ngZone) {
-    return source => new Observable(subscriber => ngZone.runOutsideAngular(() => source.subscribe(subscriber)));
+    return (source) => new Observable((subscriber) => ngZone.runOutsideAngular(() => source.subscribe(subscriber)));
 }
 function tetaZoneOptimized(ngZone) {
     return pipe(tetaZoneFree(ngZone), tetaZoneFull(ngZone));