@morozeckiy/dd-lib 0.7.0 → 0.7.35

package/fesm2022/morozeckiy-dd-lib.mjs

@@ -1,17 +1,17 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, ViewChild, Output, forwardRef, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, Injectable, Inject, Pipe, Directive, HostListener, InjectionToken, TemplateRef, Injector, RendererStyleFlags2, Optional, ElementRef, Host, SkipSelf, signal } from '@angular/core';
+import { EventEmitter, Component, Input, ViewChild, Output, Injectable, Inject, Pipe, Directive, HostListener, InjectionToken, TemplateRef, ChangeDetectionStrategy, Injector, forwardRef, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, RendererStyleFlags2, Optional, ElementRef, Host, SkipSelf, signal } from '@angular/core';
 import * as i1$5 from '@angular/forms';
-import { NG_VALUE_ACCESSOR, FormsModule, Validators, ReactiveFormsModule } from '@angular/forms';
-import * as i1 from '@angular/common';
-import { CommonModule, DecimalPipe, AsyncPipe, DOCUMENT, NgTemplateOutlet, NgComponentOutlet, NgOptimizedImage, NgClass, NgStyle, JsonPipe } from '@angular/common';
+import { Validators, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { BehaviorSubject, Subject, of, fromEvent, combineLatest } from 'rxjs';
 import { format, parse, isAfter, isBefore } from 'date-fns';
-import * as i1$2 from '@angular/common/http';
+import * as i1$1 from '@angular/common/http';
 import { HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';
 import { catchError, map, filter, takeUntil, tap, debounceTime, mergeMap, delay, switchMap } from 'rxjs/operators';
-import * as i1$1 from '@angular/router';
+import * as i1 from '@angular/router';
 import { RouterLink } from '@angular/router';
-import * as i1$3 from '@angular/platform-browser';
+import * as i1$2 from '@angular/platform-browser';
+import * as i1$3 from '@angular/common';
+import { DecimalPipe, CommonModule, AsyncPipe, DOCUMENT, NgTemplateOutlet, NgComponentOutlet, NgOptimizedImage, NgClass, NgStyle, JsonPipe } from '@angular/common';
 import { ComponentPortal, PortalInjector, CdkPortalOutlet, TemplatePortal } from '@angular/cdk/portal';
 import * as i1$4 from '@angular/cdk/overlay';
 import { OverlayModule, GlobalPositionStrategy } from '@angular/cdk/overlay';
@@ -27,13 +27,14 @@ class LibCommonButtonComponent {
         this.autofocus = false;
         this.btnColor = 'green';
         this.active = false;
+        this.activeNoBlock = true;
         this.disabled = false;
         this.showLoader = false;
         this.buttonType = 'button';
         this.clickEvent = new EventEmitter();
     }
     onClick(event) {
-        if (this.disabled || this.showLoader || this.active) {
+        if (this.disabled || this.showLoader || (this.active && !this.activeNoBlock)) {
             event.stopPropagation();
             event.preventDefault();
         }
@@ -44,7 +45,7 @@ class LibCommonButtonComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCommonButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibCommonButtonComponent, selector: "ng-component", inputs: { width: "width", height: "height", size: "size", fontSize: "fontSize", autofocus: "autofocus", btnColor: "btnColor", active: "active", disabled: "disabled", showLoader: "showLoader", buttonType: "buttonType" }, outputs: { clickEvent: "clickEvent" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentData"], descendants: true }, { propertyName: "button", first: true, predicate: ["btn"], descendants: true }], ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibCommonButtonComponent, selector: "ng-component", inputs: { width: "width", height: "height", size: "size", fontSize: "fontSize", autofocus: "autofocus", btnColor: "btnColor", active: "active", activeNoBlock: "activeNoBlock", disabled: "disabled", showLoader: "showLoader", buttonType: "buttonType" }, outputs: { clickEvent: "clickEvent" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentData"], descendants: true }, { propertyName: "button", first: true, predicate: ["btn"], descendants: true }], ngImport: i0, template: '', isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCommonButtonComponent, decorators: [{
             type: Component,
@@ -65,6 +66,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 type: Input
             }], active: [{
                 type: Input
+            }], activeNoBlock: [{
+                type: Input
             }], disabled: [{
                 type: Input
             }], showLoader: [{
@@ -81,227 +84,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 type: Output
             }] } });
 
-class LibCommonInputTextComponent {
-    get id() {
-        return this._ID;
-    }
-    constructor(changeDetection) {
-        this.required = false;
-        this.disabled = false;
-        this.commitOnInput = true; // коммитить по input или по change
-        this.clearable = true;
-        this.showSelfError = true;
-        this.uppercase = false;
-        this.invalid = false;
-        this.errorTexts = [];
-        this.side = 'bottom';
-        this.cleared = new EventEmitter();
-        this.fetchEvent = new EventEmitter();
-        this.focus = new EventEmitter();
-        this.blur = new EventEmitter();
-        this.fullBlur = new EventEmitter();
-        this.focused = false;
-        this.touched = false;
-        this.value = '';
-        this.destroyed = false;
-        this._ID = '';
-        this.changeDetection = changeDetection;
-    }
-    get invalidState() {
-        return this.invalid || this.control ? this.control.invalid : false;
-    }
-    get showError() {
-        if (!this.control) {
-            return this.invalid;
-        }
-        const { dirty, touched } = this.control;
-        return this.invalidState ? ((dirty || touched) && !this.focused) : false;
-    }
-    handleInput(_e) {
-        if (this.commitOnInput) {
-            this.commit(this.value);
-        }
-    }
-    notifyFocusEvent(e) {
-        // this.focusManager.notifyFocusMayChanged(this, e.type === 'focus');
-    }
-    handleBlur() {
-        this.focused = false;
-        if (this.onTouchedCallback) {
-            this.onTouchedCallback();
-        }
-        this.blur.emit();
-        this.changeDetection.detectChanges();
-    }
-    handleFocus() {
-        this.focused = this.touched = true;
-        if (this.onTouchedCallback) {
-            this.onTouchedCallback();
-        }
-        this.focus.emit();
-    }
-    returnFocus(e) {
-        if (this.inputElement &&
-            this.inputElement.nativeElement &&
-            (!e || e.target !== this.inputElement.nativeElement)) {
-            this.inputElement.nativeElement.focus();
-            // HelperService.resetSelection(this.inputElement.nativeElement);
-        }
-    }
-    loseFocus() {
-        this.inputElement?.nativeElement.blur();
-    }
-    forceChange() {
-        if (this.inputElement) {
-            // this.inputElement.nativeElement.dispatchEvent(HelperService.createEvent('change', true, false));
-        }
-    }
-    registerOnChange(fn) {
-        this.commit = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouchedCallback = fn;
-    }
-    // public setDisabledState(isDisabled: boolean): void {
-    //   console.log(isDisabled)
-    //   this.disabled = isDisabled;
-    // }
-    handleChange() {
-        if (!this.commitOnInput) {
-            this.commit(this.value);
-        }
-    }
-    commit(_value) { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCommonInputTextComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibCommonInputTextComponent, selector: "dd-lib-common-input", inputs: { name: "name", label: "label", formControlName: "formControlName", type: "type", contextClass: "contextClass", minlength: "minlength", min: "min", maxlength: "maxlength", max: "max", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", readOnly: "readOnly", autofocus: "autofocus", fetchMode: "fetchMode", required: "required", disabled: "disabled", commitOnInput: "commitOnInput", clearable: "clearable", showSelfError: "showSelfError", uppercase: "uppercase", invalid: "invalid", errorTexts: "errorTexts", side: "side" }, outputs: { cleared: "cleared", fetchEvent: "fetchEvent", focus: "focus", blur: "blur", fullBlur: "fullBlur" }, providers: [
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => LibCommonInputTextComponent),
-                multi: true,
-            },
-        ], viewQueries: [{ propertyName: "inputSearchElement", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "textAreaElement", first: true, predicate: ["textarea"], descendants: true }], ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCommonInputTextComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'dd-lib-common-input',
-                    template: '',
-                    providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => LibCommonInputTextComponent),
-                            multi: true,
-                        },
-                    ],
-                }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { inputSearchElement: [{
-                type: ViewChild,
-                args: ['searchInput']
-            }], inputElement: [{
-                type: ViewChild,
-                args: ['input']
-            }], textAreaElement: [{
-                type: ViewChild,
-                args: ['textarea']
-            }], name: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], formControlName: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], contextClass: [{
-                type: Input
-            }], minlength: [{
-                type: Input
-            }], min: [{
-                type: Input
-            }], maxlength: [{
-                type: Input
-            }], max: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], autocomplete: [{
-                type: Input
-            }], tabIndex: [{
-                type: Input
-            }], readOnly: [{
-                type: Input
-            }], autofocus: [{
-                type: Input
-            }], fetchMode: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], commitOnInput: [{
-                type: Input
-            }], clearable: [{
-                type: Input
-            }], showSelfError: [{
-                type: Input
-            }], uppercase: [{
-                type: Input
-            }], invalid: [{
-                type: Input
-            }], errorTexts: [{
-                type: Input
-            }], side: [{
-                type: Input
-            }], cleared: [{
-                type: Output
-            }], fetchEvent: [{
-                type: Output
-            }], focus: [{
-                type: Output
-            }], blur: [{
-                type: Output
-            }], fullBlur: [{
-                type: Output
-            }] } });
-
-class LibLoaderComponent {
-    constructor() {
-        this.color = '#07b700';
-        this.size = 'standard';
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.2", type: LibLoaderComponent, isStandalone: true, selector: "dd-lib-loader", inputs: { color: ["color", "color", (value) => value ? value : '#07b700'], size: "size" }, ngImport: i0, template: "<div [class.big]=\"size === 'big'\" [class.giant]=\"size === 'giant'\"  class=\"loader\">\n  <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n    <g clip-path=\"url(#clip0_728_22764)\">\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M12 6V3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"1.7\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M6 12H3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M7.74961 7.74961L5.59961 5.59961\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </g>\n    <defs>\n      <clipPath id=\"clip0_728_22764\">\n        <rect fill=\"white\" height=\"24\" width=\"24\" />\n      </clipPath>\n    </defs>\n  </svg>\n</div>\n", styles: [":host{display:flex;align-items:center;width:100%;justify-content:center;overflow:hidden}.loader{width:24px;height:24px}.loader svg{animation:rotate 1.5s linear infinite}.loader.big{zoom:2}.loader.giant{zoom:4}@keyframes rotate{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibLoaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'dd-lib-loader', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.big]=\"size === 'big'\" [class.giant]=\"size === 'giant'\"  class=\"loader\">\n  <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n    <g clip-path=\"url(#clip0_728_22764)\">\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M12 6V3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"1.7\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M6 12H3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M7.74961 7.74961L5.59961 5.59961\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </g>\n    <defs>\n      <clipPath id=\"clip0_728_22764\">\n        <rect fill=\"white\" height=\"24\" width=\"24\" />\n      </clipPath>\n    </defs>\n  </svg>\n</div>\n", styles: [":host{display:flex;align-items:center;width:100%;justify-content:center;overflow:hidden}.loader{width:24px;height:24px}.loader svg{animation:rotate 1.5s linear infinite}.loader.big{zoom:2}.loader.giant{zoom:4}@keyframes rotate{to{transform:rotate(360deg)}}\n"] }]
-        }], propDecorators: { color: [{
-                type: Input,
-                args: [{
-                        transform: (value) => value ? value : '#07b700'
-                    }]
-            }], size: [{
-                type: Input
-            }] } });
-
-class LibButtonComponent extends LibCommonButtonComponent {
-    ngAfterViewInit() {
-        const btn = this.button?.nativeElement;
-        if (btn && btn.attributes?.autofocus) {
-            btn.focus();
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibButtonComponent, isStandalone: true, selector: "dd-lib-button", inputs: { noPadding: "noPadding", loaderColor: "loaderColor" }, usesInheritance: true, ngImport: i0, template: "<div (click)=\"onClick($event)\" [ngStyle]=\"{width, height}\" class=\"button-container\">\r\n  <button\r\n    #btn\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [autofocus]=\"autofocus\"\r\n    [class.active]=\"active\"\r\n    [class.disabled]=\"disabled || showLoader\"\r\n    [class.green]=\"btnColor === 'green'\"\r\n    [class.loader]=\"showLoader\"\r\n    [class.no-padding]=\"noPadding\"\r\n    [class.red]=\"btnColor === 'red'\"\r\n    [class.transparent]=\"btnColor === 'transparent'\"\r\n    [class.white]=\"btnColor === 'white'\"\r\n    [class.dark]=\"btnColor === 'dark'\"\r\n    [disabled]=\"disabled || showLoader\"\r\n    [ngStyle]=\"{width, height}\"\r\n    [type]=\"buttonType\"\r\n    class=\"lib-button\"\r\n    role=\"button\">\r\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n    @if (showLoader) {\r\n        <dd-lib-loader class=\"pos-absolute\" [color]=\"loaderColor\"></dd-lib-loader>\r\n    }\r\n\r\n  </button>\r\n</div>\r\n\r\n<ng-template #content>\r\n  <span #contentData><ng-content></ng-content></span>\r\n</ng-template>\r\n", styles: [".button-container{display:inline-block}.button-container button{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:0 32px;font-size:14px;line-height:24px;font-weight:var(--font-wheit-big);border-radius:12px;outline:none;cursor:pointer;white-space:nowrap;border:1px solid transparent;background-color:var(--btn-green-bgc);color:#fff}@media screen and (max-width: 840px){.button-container button{height:48px}}.button-container button:hover,.button-container button:focus{background-color:var(--btn-green-hover)}.button-container button:active,.button-container button.active{background-color:var(--btn-green-hover)}.button-container button.loader{min-width:100px}.button-container button.white{background-color:var(--btn-light-green-bgc);color:var(--btn-white-color)}.button-container button.white:hover{color:var(--btn-white-hover-color)}.button-container button.transparent{background-color:transparent;color:var(--btn-white-color);border-color:var(--gray-color-200)}.button-container button.transparent:hover{color:var(--btn-white-hover-color)}.button-container button.red{background-color:var(--btn-red-bgc);color:var(--btn-red-color)}.button-container button.red:hover{color:var(--btn-red-hover-color)}.button-container button.dark{background-color:var(--btn-dark-bgc);color:var(--btn-dark-color)}.button-container button.dark:hover{background-color:var(--btn-dark-hover-color)}.button-container button.no-padding{padding:0}.button-container button.disabled{color:var(--disabled-color);background-color:var(--btn-disabled-bgc);pointer-events:none;cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'dd-lib-button', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, FormsModule, LibLoaderComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA], template: "<div (click)=\"onClick($event)\" [ngStyle]=\"{width, height}\" class=\"button-container\">\r\n  <button\r\n    #btn\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [autofocus]=\"autofocus\"\r\n    [class.active]=\"active\"\r\n    [class.disabled]=\"disabled || showLoader\"\r\n    [class.green]=\"btnColor === 'green'\"\r\n    [class.loader]=\"showLoader\"\r\n    [class.no-padding]=\"noPadding\"\r\n    [class.red]=\"btnColor === 'red'\"\r\n    [class.transparent]=\"btnColor === 'transparent'\"\r\n    [class.white]=\"btnColor === 'white'\"\r\n    [class.dark]=\"btnColor === 'dark'\"\r\n    [disabled]=\"disabled || showLoader\"\r\n    [ngStyle]=\"{width, height}\"\r\n    [type]=\"buttonType\"\r\n    class=\"lib-button\"\r\n    role=\"button\">\r\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n    @if (showLoader) {\r\n        <dd-lib-loader class=\"pos-absolute\" [color]=\"loaderColor\"></dd-lib-loader>\r\n    }\r\n\r\n  </button>\r\n</div>\r\n\r\n<ng-template #content>\r\n  <span #contentData><ng-content></ng-content></span>\r\n</ng-template>\r\n", styles: [".button-container{display:inline-block}.button-container button{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:0 32px;font-size:14px;line-height:24px;font-weight:var(--font-wheit-big);border-radius:12px;outline:none;cursor:pointer;white-space:nowrap;border:1px solid transparent;background-color:var(--btn-green-bgc);color:#fff}@media screen and (max-width: 840px){.button-container button{height:48px}}.button-container button:hover,.button-container button:focus{background-color:var(--btn-green-hover)}.button-container button:active,.button-container button.active{background-color:var(--btn-green-hover)}.button-container button.loader{min-width:100px}.button-container button.white{background-color:var(--btn-light-green-bgc);color:var(--btn-white-color)}.button-container button.white:hover{color:var(--btn-white-hover-color)}.button-container button.transparent{background-color:transparent;color:var(--btn-white-color);border-color:var(--gray-color-200)}.button-container button.transparent:hover{color:var(--btn-white-hover-color)}.button-container button.red{background-color:var(--btn-red-bgc);color:var(--btn-red-color)}.button-container button.red:hover{color:var(--btn-red-hover-color)}.button-container button.dark{background-color:var(--btn-dark-bgc);color:var(--btn-dark-color)}.button-container button.dark:hover{background-color:var(--btn-dark-hover-color)}.button-container button.no-padding{padding:0}.button-container button.disabled{color:var(--disabled-color);background-color:var(--btn-disabled-bgc);pointer-events:none;cursor:default}\n"] }]
-        }], propDecorators: { noPadding: [{
-                type: Input
-            }], loaderColor: [{
-                type: Input
-            }] } });
-
 class ThemeConstructorService {
     get getTheme() {
         return this.themeConfigurator.theme;
@@ -536,12 +318,12 @@ class InterceptorsService {
             throw err;
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: InterceptorsService, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: InterceptorsService, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: InterceptorsService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: InterceptorsService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i1$1.Router }] });
+        }], ctorParameters: () => [{ type: i1.Router }] });
 
 class ValidatorsService {
     constructor() { }
@@ -705,13 +487,13 @@ class FetcherService {
         });
         return formData;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: FetcherService, deps: [{ token: i1$2.HttpClient }, { token: 'apiUrl' }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: FetcherService, deps: [{ token: i1$1.HttpClient }, { token: 'apiUrl' }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: FetcherService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: FetcherService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.HttpClient }, { type: undefined, decorators: [{
                     type: Inject,
                     args: ['apiUrl']
                 }] }] });
@@ -799,7 +581,7 @@ class SafePipe {
                 throw new Error(`Invalid safe type specified: ${type}`);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SafePipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SafePipe, deps: [{ token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.2.2", ngImport: i0, type: SafePipe, isStandalone: true, name: "safe" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SafePipe, decorators: [{
@@ -808,7 +590,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                     name: 'safe',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }] });
+        }], ctorParameters: () => [{ type: i1$2.DomSanitizer }] });
 
 class ReversePipe {
     transform(value, sort) {
@@ -1148,7 +930,7 @@ class TooltipComponent {
         this.tooltipData = tooltipData;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TooltipComponent, deps: [{ token: TOOLTIP_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: TooltipComponent, isStandalone: true, selector: "dd-tooltip", ngImport: i0, template: "<div class=\"tooltip-container\">\r\n  @if (asString; as string) {\r\n  {{ string }}\r\n  } @if (asTemplate; as template) {\r\n  <ng-template [ngTemplateOutlet]=\"template\"></ng-template>\r\n  }\r\n  <svg class=\"tooltip-container__triangle\" width=\"16\" height=\"16\">\r\n    <polyline points=\"8,0 0,8 8,16\"></polyline>\r\n  </svg>\r\n</div>\r\n", styles: [":host{position:relative}.tooltip-container{position:relative;display:block;max-width:312px;padding:6px 12px;background:var(--tooltip-bgc);border-radius:8px;box-sizing:border-box;box-shadow:0 14px 64px -4px #18274b0f,0 8px 22px -6px #18274b0f}.tooltip-container__triangle{width:16px;height:16px;position:absolute;fill:var(--white-color);stroke:var(--white-color);box-shadow:#18274b0f 0 14px 64px -4px,#18274b0f 0 8px 22px -6px}:host-context(.left) svg{top:calc(50% - 8px);right:-8px;rotate:180deg}:host-context(.right) svg{top:calc(50% - 8px);left:-8px}:host-context(.top) svg{right:calc(50% - 8px);bottom:-8px;rotate:-90deg}:host-context(.bottom) svg{right:calc(50% - 8px);top:-8px;rotate:90deg}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: TooltipComponent, isStandalone: true, selector: "dd-tooltip", ngImport: i0, template: "<div class=\"tooltip-container\">\r\n  @if (asString; as string) {\r\n  {{ string }}\r\n  } @if (asTemplate; as template) {\r\n  <ng-template [ngTemplateOutlet]=\"template\"></ng-template>\r\n  }\r\n  <svg class=\"tooltip-container__triangle\" width=\"16\" height=\"16\">\r\n    <polyline points=\"8,0 0,8 8,16\"></polyline>\r\n  </svg>\r\n</div>\r\n", styles: [":host{position:relative}.tooltip-container{position:relative;display:block;max-width:312px;padding:6px 12px;background:var(--tooltip-bgc);border-radius:8px;box-sizing:border-box;box-shadow:0 14px 64px -4px #18274b0f,0 8px 22px -6px #18274b0f}.tooltip-container__triangle{width:16px;height:16px;position:absolute;fill:var(--white-color);stroke:var(--white-color);box-shadow:#18274b0f 0 14px 64px -4px,#18274b0f 0 8px 22px -6px}:host-context(.left) svg{top:calc(50% - 8px);right:-8px;rotate:180deg}:host-context(.right) svg{top:calc(50% - 8px);left:-8px}:host-context(.top) svg{right:calc(50% - 8px);bottom:-8px;rotate:-90deg}:host-context(.bottom) svg{right:calc(50% - 8px);top:-8px;rotate:90deg}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TooltipComponent, decorators: [{
             type: Component,
@@ -1332,6 +1114,268 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 args: ['blur']
             }] } });
 
+class DropDownPositionDirective {
+    constructor(el, rdr) {
+        this.el = el;
+        this.rdr = rdr;
+        this.dropdownId = 'dropdown';
+    }
+    onWindowScroll() {
+        if (this.isShownList && !this.side) {
+            this.updateDropdownPosition();
+        }
+    }
+    ngOnChanges() {
+        if (this.isShownList && !this.side) {
+            setTimeout(() => {
+                this.updateDropdownPosition();
+            });
+        }
+    }
+    updateDropdownPosition() {
+        const rect = this.el.nativeElement.getBoundingClientRect();
+        const dropdownHeight = this.itemsHeight && this.itemsHeight > this.dropdownHeight || !this.itemsHeight ? this.dropdownHeight : this.itemsHeight; // Примерная высота дропдауна
+        const spaceBelow = window.innerHeight - rect.bottom;
+        const spaceAbove = rect.top;
+        const dropdown = this.el.nativeElement.querySelector(`#${this.dropdownId}`);
+        // Если достаточно места ниже, оставляем его там
+        if (spaceBelow >= dropdownHeight) {
+            this.rdr.setStyle(dropdown, 'top', '100%');
+        }
+        // Если не хватает места ниже, но есть место выше
+        else if (spaceAbove >= dropdownHeight) {
+            this.rdr.setStyle(dropdown, 'top', `-${dropdownHeight}px`);
+        }
+        // Если недостаточно места ни вверху, ни внизу
+        else {
+            this.rdr.setStyle(dropdown, 'top', '100%');
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: DropDownPositionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.2", type: DropDownPositionDirective, isStandalone: true, selector: "[ddDropDownPosition]", inputs: { side: "side", itemsHeight: "itemsHeight", dropdownHeight: "dropdownHeight", isShownList: "isShownList", dropdownId: "dropdownId" }, host: { listeners: { "window:resize": "onWindowScroll()", "window:scroll": "onWindowScroll()" } }, usesOnChanges: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: DropDownPositionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ddDropDownPosition]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { side: [{
+                type: Input
+            }], itemsHeight: [{
+                type: Input
+            }], dropdownHeight: [{
+                type: Input
+            }], isShownList: [{
+                type: Input
+            }], dropdownId: [{
+                type: Input
+            }], onWindowScroll: [{
+                type: HostListener,
+                args: ['window:resize']
+            }, {
+                type: HostListener,
+                args: ['window:scroll']
+            }] } });
+
+class PhoneMaskDirective {
+    constructor(control) {
+        this.control = control;
+    }
+    onFocus() {
+        if (!this.control.control?.value) {
+            this.control.control?.setValue('+7');
+        }
+    }
+    onBlur() {
+        if (this.control.control?.value === '+7') {
+            this.control.control?.setValue('');
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: PhoneMaskDirective, deps: [{ token: i1$5.NgControl }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.2", type: PhoneMaskDirective, isStandalone: true, selector: "[ddPhoneMask]", host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: PhoneMaskDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ddPhoneMask]',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i1$5.NgControl }], propDecorators: { onFocus: [{
+                type: HostListener,
+                args: ['focus']
+            }], onBlur: [{
+                type: HostListener,
+                args: ['blur']
+            }] } });
+
+class ListKeyboardNavigationDirective {
+    constructor(el) {
+        this.el = el;
+        this.currentIndex = -1;
+    }
+    handleKeyboardEvent(event) {
+        const items = this.el.nativeElement.querySelectorAll('[ddSelectableItem]'); // Получаем все элементы списка
+        if (!items.length)
+            return;
+        switch (event.key) {
+            case 'ArrowDown':
+                this.moveFocus(items, 1);
+                event.preventDefault();
+                break;
+            case 'ArrowUp':
+                this.moveFocus(items, -1);
+                event.preventDefault();
+                break;
+        }
+    }
+    moveFocus(items, direction) {
+        if (this.currentIndex >= 0) {
+            const prevItem = items[this.currentIndex];
+            prevItem.classList.remove('key-down-active');
+        }
+        this.currentIndex += direction;
+        if (this.currentIndex < 0) {
+            this.currentIndex = items.length - 1;
+        }
+        else if (this.currentIndex >= items.length) {
+            this.currentIndex = 0;
+        }
+        const currentItem = items[this.currentIndex];
+        currentItem.classList.add('key-down-active');
+        currentItem.focus();
+        currentItem.scrollIntoView({
+            behavior: 'smooth',
+            block: 'nearest',
+            inline: 'start'
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ListKeyboardNavigationDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.2", type: ListKeyboardNavigationDirective, isStandalone: true, selector: "[ddListKeyboardNavigation]", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ListKeyboardNavigationDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ddListKeyboardNavigation]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { handleKeyboardEvent: [{
+                type: HostListener,
+                args: ['document:keydown', ['$event']]
+            }] } });
+
+class SelectableItemDirective {
+    constructor(el) {
+        this.el = el;
+        this.itemSelected = new EventEmitter();
+    }
+    onEnter(event) {
+        if (this.el.nativeElement.classList.contains('key-down-active')) {
+            event.preventDefault();
+            this.itemSelected.emit();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SelectableItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.2", type: SelectableItemDirective, isStandalone: true, selector: "[ddSelectableItem]", outputs: { itemSelected: "itemSelected" }, host: { listeners: { "document:keyup.enter": "onEnter($event)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SelectableItemDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ddSelectableItem]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { itemSelected: [{
+                type: Output
+            }], onEnter: [{
+                type: HostListener,
+                args: ['document:keyup.enter', ['$event']]
+            }] } });
+
+class FixedPositionDirective {
+    constructor(el, renderer) {
+        this.el = el;
+        this.renderer = renderer;
+        this.childName1 = 'input';
+        this.childName2 = 'list';
+        this.child1 = null;
+        this.child2 = null;
+    }
+    ngAfterViewInit() {
+        // id scroll-container надо задать обертке, которая имеет скролл и где будет скролящийся блок
+        const scrollContainer = document.getElementById('scroll-container');
+        if (scrollContainer) {
+            // Подписываемся на событие scroll чужеродного контейнера типа модалки и прочего узкого контента
+            this.scrollListener = this.renderer.listen(scrollContainer, 'scroll', () => this.onScroll());
+        }
+        this.parentElement = this.el.nativeElement;
+        this.child1 = this.parentElement.querySelector(`[data-child="${this.childName1}"]`);
+        this.child2 = this.parentElement.querySelector(`[data-child="${this.childName2}"]`);
+        if (this.child2) {
+            this.updateChild2Position();
+        }
+    }
+    ngAfterViewChecked() {
+        if (!this.child2) {
+            this.child2 = this.parentElement.querySelector(`[data-child="${this.childName2}"]`);
+            if (this.child2) {
+                this.updateChild2Position();
+            }
+        }
+    }
+    onScroll() {
+        if (this.child2) {
+            this.updateChild2Position();
+        }
+    }
+    updateChild2Position() {
+        if (this.child1 && this.child2) {
+            const child1Rect = this.child1.getBoundingClientRect();
+            this.renderer.setStyle(this.child2, 'width', `${child1Rect.width}px`);
+            // Вычисляем, где расположить ребенка-2
+            const shouldPositionAbove = this.shouldPositionAbove(child1Rect);
+            if (shouldPositionAbove) {
+                this.renderer.setStyle(this.child2, 'top', `${child1Rect.top - this.child2.offsetHeight}px`);
+            }
+            else {
+                // Располагаем ребенка-2 снизу ребенка-1
+                this.renderer.setStyle(this.child2, 'top', `${child1Rect.bottom}px`);
+            }
+            this.renderer.setStyle(this.child2, 'position', 'fixed');
+            this.renderer.setStyle(this.child2, 'left', `${child1Rect.left}px`);
+        }
+    }
+    shouldPositionAbove(child1Rect) {
+        if (!this.child2)
+            return false;
+        // Вычисляем, будет ли ребенок-2 виден, если его расположить снизу
+        const spaceBelow = window.innerHeight - child1Rect.bottom;
+        const child2Height = this.child2.offsetHeight;
+        return spaceBelow < child2Height;
+    }
+    ngOnDestroy() {
+        // Отписываемся от события при уничтожении директивы
+        if (this.scrollListener) {
+            this.scrollListener();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: FixedPositionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.2", type: FixedPositionDirective, isStandalone: true, selector: "[ddFixedPosition]", inputs: { childName1: "childName1", childName2: "childName2" }, host: { listeners: { "window:scroll": "onScroll()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: FixedPositionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ddFixedPosition]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { childName1: [{
+                type: Input
+            }], childName2: [{
+                type: Input
+            }], onScroll: [{
+                type: HostListener,
+                args: ['window:scroll']
+            }] } });
+
 class ToastTypeData {
 }
 class ToastData extends ToastTypeData {
@@ -1680,6 +1724,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 }]
         }] });
 
+class LibLoaderComponent {
+    constructor() {
+        this.color = '#07b700';
+        this.size = 'standard';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.2", type: LibLoaderComponent, isStandalone: true, selector: "dd-lib-loader", inputs: { color: ["color", "color", (value) => value ? value : '#07b700'], size: "size" }, ngImport: i0, template: "<div [class.big]=\"size === 'big'\" [class.giant]=\"size === 'giant'\"  class=\"loader\">\n  <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n    <g clip-path=\"url(#clip0_728_22764)\">\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M12 6V3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"1.7\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M6 12H3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M7.74961 7.74961L5.59961 5.59961\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </g>\n    <defs>\n      <clipPath id=\"clip0_728_22764\">\n        <rect fill=\"white\" height=\"24\" width=\"24\" />\n      </clipPath>\n    </defs>\n  </svg>\n</div>\n", styles: [":host{display:flex;align-items:center;width:100%;justify-content:center;overflow:hidden;z-index:999}.loader{width:24px;height:24px}.loader svg{animation:rotate 1.5s linear infinite}.loader.big{zoom:2}.loader.giant{zoom:4}@keyframes rotate{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibLoaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dd-lib-loader', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.big]=\"size === 'big'\" [class.giant]=\"size === 'giant'\"  class=\"loader\">\n  <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n    <g clip-path=\"url(#clip0_728_22764)\">\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M12 6V3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"1.7\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M6 12H3\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n      <path\n        [attr.stroke]=\"color\"\n        d=\"M7.74961 7.74961L5.59961 5.59961\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </g>\n    <defs>\n      <clipPath id=\"clip0_728_22764\">\n        <rect fill=\"white\" height=\"24\" width=\"24\" />\n      </clipPath>\n    </defs>\n  </svg>\n</div>\n", styles: [":host{display:flex;align-items:center;width:100%;justify-content:center;overflow:hidden;z-index:999}.loader{width:24px;height:24px}.loader svg{animation:rotate 1.5s linear infinite}.loader.big{zoom:2}.loader.giant{zoom:4}@keyframes rotate{to{transform:rotate(360deg)}}\n"] }]
+        }], propDecorators: { color: [{
+                type: Input,
+                args: [{
+                        transform: (value) => value ? value : '#07b700'
+                    }]
+            }], size: [{
+                type: Input
+            }] } });
+
 class ModalBaseComponent {
     constructor(route, router, dialog) {
         this.route = route;
@@ -1695,39 +1759,265 @@ class ModalBaseComponent {
             }
         };
     }
-    onKeydownComponent(event) {
-        if (event.key === 'Escape' || event.key === 'Esc') {
-            this.destroy();
+    onKeydownComponent(event) {
+        if (event.key === 'Escape' || event.key === 'Esc') {
+            this.destroy();
+        }
+    }
+    close() {
+        this.dialog.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ModalBaseComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }, { token: DDDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: ModalBaseComponent, isStandalone: true, selector: "dd-modal-base", inputs: { content: "content", component: "component", clearFragment: "clearFragment", borderMobile: "borderMobile", showLoader: "showLoader", showContentLoader: "showContentLoader" }, host: { listeners: { "document:keydown": "onKeydownComponent($event)" } }, ngImport: i0, template: "<div class=\"popup\" [class.border-mobile]=\"borderMobile\">\r\n  @if (showContentLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  } @else {\r\n    <div (click)=\"close()\" class=\"popup__close\"></div>\r\n    @if (content) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngTemplateOutletContext]=\"{ data }\" [ngTemplateOutlet]=\"content\"></ng-template>\r\n      </div>\r\n    }\r\n    @if (component) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngComponentOutlet]=\"component\"></ng-template>\r\n      </div>\r\n    } @else {\r\n      <ng-content></ng-content>\r\n    }\r\n  }\r\n\r\n  @if (showLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".popup{position:relative;max-width:var(--main-body-width);border-radius:24px;background:var(--white-color)}.popup .loader-modal{position:absolute;width:100%;height:100%;top:0;display:flex;align-items:center;justify-content:center;border-radius:24px;background:#251c2c33}@media screen and (max-width: 1320px){.popup{max-width:100%}}@media screen and (max-width: 480px){.popup{border-radius:0}}@media screen and (max-width: 480px){.popup.border-mobile{border-radius:24px}}.popup__close{z-index:1;position:absolute;top:24px;right:24px;width:20px;height:20px;background:url('data:image/svg+xml,<svg fill=\"none\" height=\"20\" viewBox=\"0 0 20 20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <g clip-path=\"url(%23clip0_355_22081)\">%0D%0A    <path d=\"M15 5L5 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A    <path d=\"M5 5L15 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A  </g>%0D%0A  <defs>%0D%0A    <clipPath id=\"clip0_355_22081\">%0D%0A      <rect fill=\"white\" height=\"20\" width=\"20\"/>%0D%0A    </clipPath>%0D%0A  </defs>%0D%0A</svg>%0D%0A') no-repeat center;cursor:pointer}@media screen and (max-width: 480px){.popup__close{top:16px;right:16px}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ModalBaseComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dd-modal-base', standalone: true, imports: [NgTemplateOutlet, NgComponentOutlet, LibLoaderComponent], template: "<div class=\"popup\" [class.border-mobile]=\"borderMobile\">\r\n  @if (showContentLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  } @else {\r\n    <div (click)=\"close()\" class=\"popup__close\"></div>\r\n    @if (content) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngTemplateOutletContext]=\"{ data }\" [ngTemplateOutlet]=\"content\"></ng-template>\r\n      </div>\r\n    }\r\n    @if (component) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngComponentOutlet]=\"component\"></ng-template>\r\n      </div>\r\n    } @else {\r\n      <ng-content></ng-content>\r\n    }\r\n  }\r\n\r\n  @if (showLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".popup{position:relative;max-width:var(--main-body-width);border-radius:24px;background:var(--white-color)}.popup .loader-modal{position:absolute;width:100%;height:100%;top:0;display:flex;align-items:center;justify-content:center;border-radius:24px;background:#251c2c33}@media screen and (max-width: 1320px){.popup{max-width:100%}}@media screen and (max-width: 480px){.popup{border-radius:0}}@media screen and (max-width: 480px){.popup.border-mobile{border-radius:24px}}.popup__close{z-index:1;position:absolute;top:24px;right:24px;width:20px;height:20px;background:url('data:image/svg+xml,<svg fill=\"none\" height=\"20\" viewBox=\"0 0 20 20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <g clip-path=\"url(%23clip0_355_22081)\">%0D%0A    <path d=\"M15 5L5 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A    <path d=\"M5 5L15 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A  </g>%0D%0A  <defs>%0D%0A    <clipPath id=\"clip0_355_22081\">%0D%0A      <rect fill=\"white\" height=\"20\" width=\"20\"/>%0D%0A    </clipPath>%0D%0A  </defs>%0D%0A</svg>%0D%0A') no-repeat center;cursor:pointer}@media screen and (max-width: 480px){.popup__close{top:16px;right:16px}}\n"] }]
+        }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i1.Router }, { type: DDDialogRef }], propDecorators: { content: [{
+                type: Input
+            }], component: [{
+                type: Input
+            }], clearFragment: [{
+                type: Input
+            }], borderMobile: [{
+                type: Input
+            }], showLoader: [{
+                type: Input
+            }], showContentLoader: [{
+                type: Input
+            }], onKeydownComponent: [{
+                type: HostListener,
+                args: ['document:keydown', ['$event']]
+            }] } });
+
+// services
+// map
+
+class LibCommonInputTextComponent {
+    get id() {
+        return this._ID;
+    }
+    constructor(changeDetection) {
+        this.required = false;
+        this.disabled = false;
+        this.commitOnInput = true; // коммитить по input или по change
+        this.clearable = true;
+        this.showSelfError = true;
+        this.uppercase = false;
+        this.invalid = false;
+        this.errorTexts = [];
+        this.cleared = new EventEmitter();
+        this.fetchEvent = new EventEmitter();
+        this.focus = new EventEmitter();
+        this.blur = new EventEmitter();
+        this.fullBlur = new EventEmitter();
+        this.focused = false;
+        this.touched = false;
+        this.value = '';
+        this.dropdownStyle = { top: '100%', left: '0' };
+        this.destroyed = false;
+        this._ID = '';
+        this.changeDetection = changeDetection;
+    }
+    ngAfterViewChecked() {
+        this.changeDetection.markForCheck();
+        this.errorText = ValidatorsService.getErrorText(this.control?.errors);
+    }
+    get invalidState() {
+        return this.invalid || this.control ? this.control.invalid : false;
+    }
+    get showError() {
+        if (!this.control) {
+            return this.invalid;
+        }
+        const { dirty, touched } = this.control;
+        return this.invalidState ? ((dirty || touched) && !this.focused) : false;
+    }
+    handleInput(_e) {
+        if (this.commitOnInput) {
+            this.commit(this.value);
+        }
+    }
+    notifyFocusEvent(e) {
+        // this.focusManager.notifyFocusMayChanged(this, e.type === 'focus');
+        this.blur.emit(this.value);
+    }
+    handleBlur() {
+        this.focused = false;
+        if (this.onTouchedCallback) {
+            this.onTouchedCallback();
+        }
+        this.blur.emit();
+        this.changeDetection.detectChanges();
+    }
+    handleFocus() {
+        this.focused = this.touched = true;
+        if (this.onTouchedCallback) {
+            this.onTouchedCallback();
+        }
+        this.focus.emit();
+    }
+    returnFocus(e) {
+        if (this.inputElement &&
+            this.inputElement.nativeElement &&
+            (!e || e.target !== this.inputElement.nativeElement)) {
+            this.inputElement.nativeElement.focus();
+            // HelperService.resetSelection(this.inputElement.nativeElement);
+        }
+    }
+    loseFocus() {
+        this.inputElement?.nativeElement.blur();
+    }
+    forceChange() {
+        if (this.inputElement) {
+            // this.inputElement.nativeElement.dispatchEvent(HelperService.createEvent('change', true, false));
         }
     }
-    close() {
-        this.dialog.close();
+    registerOnChange(fn) {
+        this.commit = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedCallback = fn;
+    }
+    // public setDisabledState(isDisabled: boolean): void {
+    //   console.log(isDisabled)
+    //   this.disabled = isDisabled;
+    // }
+    handleChange() {
+        if (!this.commitOnInput) {
+            this.commit(this.value);
+        }
+    }
+    commit(_value) { }
+    updateDropdownPosition(el, data, itemSize, dHeight) {
+        const rect = el.nativeElement.getBoundingClientRect();
+        const itemHeight = data?.length ? data?.length * itemSize : 0;
+        const dropdownHeight = ((itemHeight > 0) && (itemHeight > dHeight)) ? dHeight : itemHeight; // Примерная высота дропдауна
+        const spaceBelow = window.innerHeight - rect.bottom;
+        const spaceAbove = rect.top;
+        // Если достаточно места ниже, оставляем его там
+        if (spaceBelow >= dropdownHeight) {
+            this.dropdownStyle = { top: '100%', left: '0' };
+        }
+        // Если не хватает места ниже, но есть место выше
+        else if (spaceAbove >= dropdownHeight) {
+            const label = this.label ? 26 : 0;
+            this.dropdownStyle = { top: `-${dropdownHeight - label}px`, left: '0' };
+        }
+        // Если недостаточно места ни вверху, ни внизу
+        else {
+            this.dropdownStyle = { top: '100%', left: '0' };
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ModalBaseComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: DDDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: ModalBaseComponent, isStandalone: true, selector: "dd-modal-base", inputs: { content: "content", component: "component", clearFragment: "clearFragment", borderMobile: "borderMobile", showLoader: "showLoader", showContentLoader: "showContentLoader" }, host: { listeners: { "document:keydown": "onKeydownComponent($event)" } }, ngImport: i0, template: "<div class=\"popup\" [class.border-mobile]=\"borderMobile\">\r\n  @if (showContentLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  } @else {\r\n    <div (click)=\"close()\" class=\"popup__close\"></div>\r\n    @if (content) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngTemplateOutletContext]=\"{ data }\" [ngTemplateOutlet]=\"content\"></ng-template>\r\n      </div>\r\n    }\r\n    @if (component) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngComponentOutlet]=\"component\"></ng-template>\r\n      </div>\r\n    } @else {\r\n      <ng-content></ng-content>\r\n    }\r\n  }\r\n\r\n  @if (showLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".popup{position:relative;max-width:var(--main-body-width);border-radius:24px;background:var(--white-color)}.popup .loader-modal{position:absolute;width:100%;height:100%;top:0;display:flex;align-items:center;justify-content:center;border-radius:24px;background:#251c2c33}@media screen and (max-width: 1320px){.popup{max-width:100%}}@media screen and (max-width: 480px){.popup{border-radius:0}}@media screen and (max-width: 480px){.popup.border-mobile{border-radius:24px}}.popup__close{position:absolute;top:24px;right:24px;width:20px;height:20px;background:url('data:image/svg+xml,<svg fill=\"none\" height=\"20\" viewBox=\"0 0 20 20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <g clip-path=\"url(%23clip0_355_22081)\">%0D%0A    <path d=\"M15 5L5 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A    <path d=\"M5 5L15 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A  </g>%0D%0A  <defs>%0D%0A    <clipPath id=\"clip0_355_22081\">%0D%0A      <rect fill=\"white\" height=\"20\" width=\"20\"/>%0D%0A    </clipPath>%0D%0A  </defs>%0D%0A</svg>%0D%0A') no-repeat center;cursor:pointer}@media screen and (max-width: 480px){.popup__close{top:16px;right:16px}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCommonInputTextComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibCommonInputTextComponent, selector: "dd-lib-common-input", inputs: { name: "name", label: "label", formControlName: "formControlName", type: "type", contextClass: "contextClass", minlength: "minlength", min: "min", maxlength: "maxlength", max: "max", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", readOnly: "readOnly", autofocus: "autofocus", fetchMode: "fetchMode", required: "required", disabled: "disabled", commitOnInput: "commitOnInput", clearable: "clearable", showSelfError: "showSelfError", uppercase: "uppercase", invalid: "invalid", errorTexts: "errorTexts", side: "side" }, outputs: { cleared: "cleared", fetchEvent: "fetchEvent", focus: "focus", blur: "blur", fullBlur: "fullBlur" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => LibCommonInputTextComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "inputSearchElement", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "textAreaElement", first: true, predicate: ["textarea"], descendants: true }], ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ModalBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCommonInputTextComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dd-modal-base', standalone: true, imports: [NgTemplateOutlet, NgComponentOutlet, LibLoaderComponent], template: "<div class=\"popup\" [class.border-mobile]=\"borderMobile\">\r\n  @if (showContentLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  } @else {\r\n    <div (click)=\"close()\" class=\"popup__close\"></div>\r\n    @if (content) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngTemplateOutletContext]=\"{ data }\" [ngTemplateOutlet]=\"content\"></ng-template>\r\n      </div>\r\n    }\r\n    @if (component) {\r\n      <div class=\"popup__content\">\r\n        <ng-template [ngComponentOutlet]=\"component\"></ng-template>\r\n      </div>\r\n    } @else {\r\n      <ng-content></ng-content>\r\n    }\r\n  }\r\n\r\n  @if (showLoader) {\r\n    <div class=\"loader-modal\">\r\n      <dd-lib-loader size=\"giant\"></dd-lib-loader>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".popup{position:relative;max-width:var(--main-body-width);border-radius:24px;background:var(--white-color)}.popup .loader-modal{position:absolute;width:100%;height:100%;top:0;display:flex;align-items:center;justify-content:center;border-radius:24px;background:#251c2c33}@media screen and (max-width: 1320px){.popup{max-width:100%}}@media screen and (max-width: 480px){.popup{border-radius:0}}@media screen and (max-width: 480px){.popup.border-mobile{border-radius:24px}}.popup__close{position:absolute;top:24px;right:24px;width:20px;height:20px;background:url('data:image/svg+xml,<svg fill=\"none\" height=\"20\" viewBox=\"0 0 20 20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <g clip-path=\"url(%23clip0_355_22081)\">%0D%0A    <path d=\"M15 5L5 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A    <path d=\"M5 5L15 15\" stroke=\"%23A79BAD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"/>%0D%0A  </g>%0D%0A  <defs>%0D%0A    <clipPath id=\"clip0_355_22081\">%0D%0A      <rect fill=\"white\" height=\"20\" width=\"20\"/>%0D%0A    </clipPath>%0D%0A  </defs>%0D%0A</svg>%0D%0A') no-repeat center;cursor:pointer}@media screen and (max-width: 480px){.popup__close{top:16px;right:16px}}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: DDDialogRef }], propDecorators: { content: [{
+            args: [{
+                    selector: 'dd-lib-common-input',
+                    template: '',
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => LibCommonInputTextComponent),
+                            multi: true,
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { inputSearchElement: [{
+                type: ViewChild,
+                args: ['searchInput']
+            }], inputElement: [{
+                type: ViewChild,
+                args: ['input']
+            }], textAreaElement: [{
+                type: ViewChild,
+                args: ['textarea']
+            }], name: [{
                 type: Input
-            }], component: [{
+            }], label: [{
                 type: Input
-            }], clearFragment: [{
+            }], formControlName: [{
                 type: Input
-            }], borderMobile: [{
+            }], type: [{
                 type: Input
-            }], showLoader: [{
+            }], contextClass: [{
                 type: Input
-            }], showContentLoader: [{
+            }], minlength: [{
                 type: Input
-            }], onKeydownComponent: [{
-                type: HostListener,
-                args: ['document:keydown', ['$event']]
+            }], min: [{
+                type: Input
+            }], maxlength: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], autocomplete: [{
+                type: Input
+            }], tabIndex: [{
+                type: Input
+            }], readOnly: [{
+                type: Input
+            }], autofocus: [{
+                type: Input
+            }], fetchMode: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], commitOnInput: [{
+                type: Input
+            }], clearable: [{
+                type: Input
+            }], showSelfError: [{
+                type: Input
+            }], uppercase: [{
+                type: Input
+            }], invalid: [{
+                type: Input
+            }], errorTexts: [{
+                type: Input
+            }], side: [{
+                type: Input
+            }], cleared: [{
+                type: Output
+            }], fetchEvent: [{
+                type: Output
+            }], focus: [{
+                type: Output
+            }], blur: [{
+                type: Output
+            }], fullBlur: [{
+                type: Output
             }] } });
 
-// services
-// map
+class LibButtonComponent extends LibCommonButtonComponent {
+    ngAfterViewInit() {
+        const btn = this.button?.nativeElement;
+        if (btn && btn.attributes?.autofocus) {
+            btn.focus();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibButtonComponent, isStandalone: true, selector: "dd-lib-button", inputs: { noPadding: "noPadding", loaderColor: "loaderColor" }, usesInheritance: true, ngImport: i0, template: "<div (click)=\"onClick($event)\" [ngStyle]=\"{width, height}\" class=\"button-container\">\r\n  <button\r\n    #btn\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [autofocus]=\"autofocus\"\r\n    [class.active]=\"active\"\r\n    [class.disabled]=\"disabled || showLoader\"\r\n    [class.green]=\"btnColor === 'green'\"\r\n    [class.loader]=\"showLoader\"\r\n    [class.no-padding]=\"noPadding\"\r\n    [class.red]=\"btnColor === 'red'\"\r\n    [class.transparent]=\"btnColor === 'transparent'\"\r\n    [class.white]=\"btnColor === 'white'\"\r\n    [class.dark]=\"btnColor === 'dark'\"\r\n    [disabled]=\"disabled || showLoader\"\r\n    [ngStyle]=\"{width, height}\"\r\n    [type]=\"buttonType\"\r\n    class=\"lib-button\"\r\n    role=\"button\">\r\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n    @if (showLoader) {\r\n        <dd-lib-loader class=\"pos-absolute\" [color]=\"loaderColor\"></dd-lib-loader>\r\n    }\r\n\r\n  </button>\r\n</div>\r\n\r\n<ng-template #content>\r\n  <span #contentData><ng-content></ng-content></span>\r\n</ng-template>\r\n", styles: [".button-container{display:inline-block}.button-container button{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:0 32px;font-size:14px;line-height:24px;font-weight:var(--font-wheit-big);border-radius:12px;outline:none;cursor:pointer;white-space:nowrap;border:1px solid transparent;background-color:var(--btn-green-bgc);color:#fff}@media screen and (max-width: 840px){.button-container button{height:48px}}.button-container button:hover,.button-container button:focus{background-color:var(--btn-green-hover)}.button-container button:active,.button-container button.active{background-color:var(--btn-green-hover)}.button-container button.loader{min-width:100px}.button-container button.white{background-color:var(--btn-light-green-bgc);color:var(--btn-white-color)}.button-container button.white:hover{color:var(--btn-white-hover-color)}.button-container button.transparent{background-color:transparent;color:var(--btn-white-color);border-color:var(--gray-color-200)}.button-container button.transparent:hover{color:var(--btn-white-hover-color)}.button-container button.red{background-color:var(--btn-red-bgc);color:var(--btn-red-color)}.button-container button.red:hover{color:var(--btn-red-hover-color)}.button-container button.dark{background-color:var(--btn-dark-bgc);color:var(--btn-dark-color)}.button-container button.dark:hover{background-color:var(--btn-dark-hover-color)}.button-container button.no-padding{padding:0}.button-container button.disabled{color:var(--disabled-color);background-color:var(--btn-disabled-bgc);pointer-events:none;cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dd-lib-button', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, FormsModule, LibLoaderComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA], template: "<div (click)=\"onClick($event)\" [ngStyle]=\"{width, height}\" class=\"button-container\">\r\n  <button\r\n    #btn\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [autofocus]=\"autofocus\"\r\n    [class.active]=\"active\"\r\n    [class.disabled]=\"disabled || showLoader\"\r\n    [class.green]=\"btnColor === 'green'\"\r\n    [class.loader]=\"showLoader\"\r\n    [class.no-padding]=\"noPadding\"\r\n    [class.red]=\"btnColor === 'red'\"\r\n    [class.transparent]=\"btnColor === 'transparent'\"\r\n    [class.white]=\"btnColor === 'white'\"\r\n    [class.dark]=\"btnColor === 'dark'\"\r\n    [disabled]=\"disabled || showLoader\"\r\n    [ngStyle]=\"{width, height}\"\r\n    [type]=\"buttonType\"\r\n    class=\"lib-button\"\r\n    role=\"button\">\r\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n    @if (showLoader) {\r\n        <dd-lib-loader class=\"pos-absolute\" [color]=\"loaderColor\"></dd-lib-loader>\r\n    }\r\n\r\n  </button>\r\n</div>\r\n\r\n<ng-template #content>\r\n  <span #contentData><ng-content></ng-content></span>\r\n</ng-template>\r\n", styles: [".button-container{display:inline-block}.button-container button{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:0 32px;font-size:14px;line-height:24px;font-weight:var(--font-wheit-big);border-radius:12px;outline:none;cursor:pointer;white-space:nowrap;border:1px solid transparent;background-color:var(--btn-green-bgc);color:#fff}@media screen and (max-width: 840px){.button-container button{height:48px}}.button-container button:hover,.button-container button:focus{background-color:var(--btn-green-hover)}.button-container button:active,.button-container button.active{background-color:var(--btn-green-hover)}.button-container button.loader{min-width:100px}.button-container button.white{background-color:var(--btn-light-green-bgc);color:var(--btn-white-color)}.button-container button.white:hover{color:var(--btn-white-hover-color)}.button-container button.transparent{background-color:transparent;color:var(--btn-white-color);border-color:var(--gray-color-200)}.button-container button.transparent:hover{color:var(--btn-white-hover-color)}.button-container button.red{background-color:var(--btn-red-bgc);color:var(--btn-red-color)}.button-container button.red:hover{color:var(--btn-red-hover-color)}.button-container button.dark{background-color:var(--btn-dark-bgc);color:var(--btn-dark-color)}.button-container button.dark:hover{background-color:var(--btn-dark-hover-color)}.button-container button.no-padding{padding:0}.button-container button.disabled{color:var(--disabled-color);background-color:var(--btn-disabled-bgc);pointer-events:none;cursor:default}\n"] }]
+        }], propDecorators: { noPadding: [{
+                type: Input
+            }], loaderColor: [{
+                type: Input
+            }] } });
 
 class LibSvgIconComponent {
     constructor(el, rdr, svgIconRegistry, document) {
@@ -1816,13 +2106,13 @@ class LibBackButtonComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibBackButtonComponent, deps: [{ token: i1.Location }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibBackButtonComponent, deps: [{ token: i1$3.Location }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibBackButtonComponent, isStandalone: true, selector: "dd-lib-back-button", inputs: { backTitle: "backTitle", rout: "rout" }, ngImport: i0, template: "<div (click)=\"onBack()\" class=\"d-inline-flex align-center mr-8 cup\">\r\n  <dd-lib-svg-icon icon=\"back_arrow\"></dd-lib-svg-icon>\r\n  <div class=\"g-text gray cup ml-8\">{{ backTitle }}</div>\r\n</div>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibBackButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dd-lib-back-button', standalone: true, imports: [NgOptimizedImage, LibSvgIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"onBack()\" class=\"d-inline-flex align-center mr-8 cup\">\r\n  <dd-lib-svg-icon icon=\"back_arrow\"></dd-lib-svg-icon>\r\n  <div class=\"g-text gray cup ml-8\">{{ backTitle }}</div>\r\n</div>\r\n", styles: [":host{display:block}\n"] }]
-        }], ctorParameters: () => [{ type: i1.Location }, { type: i1$1.Router }], propDecorators: { backTitle: [{
+        }], ctorParameters: () => [{ type: i1$3.Location }, { type: i1.Router }], propDecorators: { backTitle: [{
                 type: Input
             }], rout: [{
                 type: Input
@@ -1846,7 +2136,7 @@ class LibFilterButtonComponent extends LibCommonButtonComponent {
         this.hintEvent.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibFilterButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibFilterButtonComponent, isStandalone: true, selector: "dd-lib-filter-button", inputs: { btnTitle: "btnTitle", hintContent: "hintContent" }, outputs: { clearEvent: "clearEvent", hintEvent: "hintEvent" }, usesInheritance: true, ngImport: i0, template: "<div (click)=\"onClick($event)\" [class.disabled]=\"disabled\" [ngStyle]=\"{width}\" class=\"button-container\">\r\n  <button\r\n    #btn\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [autofocus]=\"autofocus\"\r\n    [disabled]=\"disabled\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      loader: showLoader,\r\n      active: active,\r\n      white: btnColor === 'white',\r\n      transparent: btnColor === 'transparent',\r\n    }\"\r\n    [type]=\"buttonType\"\r\n    class=\"\"\r\n    role=\"button\">\r\n    @if (!showLoader) {\r\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n    } @if (showLoader) {\r\n    <div class=\"loader\"></div>\r\n  }\r\n  </button>\r\n</div>\r\n\r\n<ng-template #content>\r\n  @if (btnTitle) {\r\n  <span class=\"btn-title\">{{ btnTitle }}</span>\r\n  }\r\n  <span #contentData><ng-content></ng-content></span>\r\n  <span class=\"d-flex\">\r\n    @if (hintContent) {\r\n      <dd-lib-svg-icon (click)=\"hintClick($event)\"\r\n                       [ddTooltip]=\"hintContent\"\r\n                       [withClick]=\"true\"\r\n                       class=\"ml-8\"\r\n                       icon=\"question{{ active ? '-white-g' : '' }}\"></dd-lib-svg-icon>\r\n    }\r\n    @if (active) {\r\n      <dd-lib-svg-icon (click)=\"onClear($event)\" color=\"white\" icon=\"close\" class=\"ml-8 cup close\"></dd-lib-svg-icon>\r\n    }\r\n    <dd-lib-svg-icon icon=\"toggle_arrow_right\" class=\"arrow show-tablet ml-12\"></dd-lib-svg-icon>\r\n  </span>\r\n</ng-template>\r\n", styles: [":host{display:block}.button-container{display:inline-block}@media screen and (max-width: 840px){.button-container{display:block}}.button-container button{display:flex;align-items:center;justify-content:center;height:40px;font-size:14px;line-height:24px;outline:none;cursor:pointer;white-space:nowrap;color:var(--black-color);background-color:var(--btn-white-bgc);border:1px solid var(--gray-color-200);border-radius:24px;padding:8px 16px;font-weight:var(--font-wheit-small)}@media screen and (max-width: 840px){.button-container button{width:100%;justify-content:space-between;border-top-color:transparent;border-left:none;border-right:none;border-radius:0;padding:35px 0;font-size:16px;font-weight:500}}.button-container button:hover{color:var(--btn-white-hover-color)}.button-container button.loader{min-width:100px}.button-container button.transparent{background-color:transparent}.button-container button.active{color:#fff;background-color:var(--primary-green-color)}@media screen and (max-width: 840px){.button-container button.active{background-color:transparent;color:var(--black-color)}}.button-container button.active:hover{background-color:var(--btn-green-hover)}.button-container button.disabled{color:var(--disabled-color);background-color:var(--btn-disabled-bgc);pointer-events:none;cursor:default}@media screen and (max-width: 840px){.button-container button.disabled{background-color:transparent}}.button-container button .loader{width:24px;height:24px;background:url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <path%0D%0A    d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\"%0D%0A    stroke=\"%23306030E8\" stroke-width=\"4\"/>%0D%0A  <mask height=\"24\" id=\"mask0\" mask-type=\"alpha\" maskUnits=\"userSpaceOnUse\" width=\"24\" x=\"0\" y=\"0\">%0D%0A    <path%0D%0A      d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\"%0D%0A      stroke=\"%23FAFCFF\" stroke-width=\"4\"/>%0D%0A  </mask>%0D%0A  <g mask=\"url(%23mask0)\">%0D%0A    <path d=\"M24.5621 -0.445973L12.0781 -0.00292969L12.9376 24.2163L25.4216 23.7733L24.5621 -0.445973Z\" fill=\"white\"/>%0D%0A    <path%0D%0A      d=\"M12.2578 4C13.3624 4 14.2578 3.10457 14.2578 2C14.2578 0.89543 13.3624 0 12.2578 0C11.1532 0 10.2578 0.89543 10.2578 2C10.2578 3.10457 11.1532 4 12.2578 4Z\"%0D%0A      fill=\"white\"/>%0D%0A    <path%0D%0A      d=\"M12.916 23.9609C14.0206 23.9609 14.916 23.0655 14.916 21.9609C14.916 20.8564 14.0206 19.9609 12.916 19.9609C11.8114 19.9609 10.916 20.8564 10.916 21.9609C10.916 23.0655 11.8114 23.9609 12.916 23.9609Z\"%0D%0A      fill=\"white\"/>%0D%0A  </g>%0D%0A</svg>%0D%0A') center no-repeat;animation:rotate 1.5s linear infinite}.button-container button .arrow::ng-deep svg path{stroke:var(--menu-arr-color)}@media screen and (max-width: 840px){.button-container button .close{width:24px;height:24px;border-radius:8px;background-color:var(--gray-color-200)}.button-container button .close::ng-deep svg path{stroke:var(--second-gray-color)}}@keyframes rotate{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: TooltipDirective, selector: "[ddTooltip]", inputs: ["ddTooltip", "withClick", "position"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibFilterButtonComponent, isStandalone: true, selector: "dd-lib-filter-button", inputs: { btnTitle: "btnTitle", hintContent: "hintContent" }, outputs: { clearEvent: "clearEvent", hintEvent: "hintEvent" }, usesInheritance: true, ngImport: i0, template: "<div (click)=\"onClick($event)\" [class.disabled]=\"disabled\" [ngStyle]=\"{width}\" class=\"button-container\">\r\n  <button\r\n    #btn\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [autofocus]=\"autofocus\"\r\n    [disabled]=\"disabled\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      loader: showLoader,\r\n      active: active,\r\n      white: btnColor === 'white',\r\n      transparent: btnColor === 'transparent',\r\n    }\"\r\n    [type]=\"buttonType\"\r\n    class=\"\"\r\n    role=\"button\">\r\n    @if (!showLoader) {\r\n      <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n    } @if (showLoader) {\r\n    <div class=\"loader\"></div>\r\n  }\r\n  </button>\r\n</div>\r\n\r\n<ng-template #content>\r\n  @if (btnTitle) {\r\n  <span class=\"btn-title\">{{ btnTitle }}</span>\r\n  }\r\n  <span #contentData><ng-content></ng-content></span>\r\n  <span class=\"d-flex\">\r\n    @if (hintContent) {\r\n      <dd-lib-svg-icon (click)=\"hintClick($event)\"\r\n                       [ddTooltip]=\"hintContent\"\r\n                       [withClick]=\"true\"\r\n                       class=\"ml-8\"\r\n                       icon=\"question{{ active ? '-white-g' : '' }}\"></dd-lib-svg-icon>\r\n    }\r\n    @if (active) {\r\n      <dd-lib-svg-icon (click)=\"onClear($event)\" color=\"white\" icon=\"close\" class=\"ml-8 cup close\"></dd-lib-svg-icon>\r\n    }\r\n    <dd-lib-svg-icon icon=\"toggle_arrow_right\" class=\"arrow show-tablet ml-12\"></dd-lib-svg-icon>\r\n  </span>\r\n</ng-template>\r\n", styles: [":host{display:block}.button-container{display:inline-block}@media screen and (max-width: 840px){.button-container{display:block}}.button-container button{display:flex;align-items:center;justify-content:center;height:40px;font-size:14px;line-height:24px;outline:none;cursor:pointer;white-space:nowrap;color:var(--black-color);background-color:var(--btn-white-bgc);border:1px solid var(--gray-color-200);border-radius:24px;padding:8px 16px;font-weight:var(--font-wheit-small)}@media screen and (max-width: 840px){.button-container button{width:100%;justify-content:space-between;border-top-color:transparent;border-left:none;border-right:none;border-radius:0;padding:35px 0;font-size:16px;font-weight:500}}.button-container button:hover{color:var(--btn-white-hover-color)}.button-container button.loader{min-width:100px}.button-container button.transparent{background-color:transparent}.button-container button.active{color:#fff;background-color:var(--primary-green-color)}@media screen and (max-width: 840px){.button-container button.active{background-color:transparent;color:var(--black-color)}}.button-container button.active:hover{background-color:var(--btn-green-hover)}.button-container button.disabled{color:var(--disabled-color);background-color:var(--btn-disabled-bgc);pointer-events:none;cursor:default}@media screen and (max-width: 840px){.button-container button.disabled{background-color:transparent}}.button-container button .loader{width:24px;height:24px;background:url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <path%0D%0A    d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\"%0D%0A    stroke=\"%23306030E8\" stroke-width=\"4\"/>%0D%0A  <mask height=\"24\" id=\"mask0\" mask-type=\"alpha\" maskUnits=\"userSpaceOnUse\" width=\"24\" x=\"0\" y=\"0\">%0D%0A    <path%0D%0A      d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\"%0D%0A      stroke=\"%23FAFCFF\" stroke-width=\"4\"/>%0D%0A  </mask>%0D%0A  <g mask=\"url(%23mask0)\">%0D%0A    <path d=\"M24.5621 -0.445973L12.0781 -0.00292969L12.9376 24.2163L25.4216 23.7733L24.5621 -0.445973Z\" fill=\"white\"/>%0D%0A    <path%0D%0A      d=\"M12.2578 4C13.3624 4 14.2578 3.10457 14.2578 2C14.2578 0.89543 13.3624 0 12.2578 0C11.1532 0 10.2578 0.89543 10.2578 2C10.2578 3.10457 11.1532 4 12.2578 4Z\"%0D%0A      fill=\"white\"/>%0D%0A    <path%0D%0A      d=\"M12.916 23.9609C14.0206 23.9609 14.916 23.0655 14.916 21.9609C14.916 20.8564 14.0206 19.9609 12.916 19.9609C11.8114 19.9609 10.916 20.8564 10.916 21.9609C10.916 23.0655 11.8114 23.9609 12.916 23.9609Z\"%0D%0A      fill=\"white\"/>%0D%0A  </g>%0D%0A</svg>%0D%0A') center no-repeat;animation:rotate 1.5s linear infinite}.button-container button .arrow::ng-deep svg path{stroke:var(--menu-arr-color)}@media screen and (max-width: 840px){.button-container button .close{width:24px;height:24px;border-radius:8px;background-color:var(--gray-color-200)}.button-container button .close::ng-deep svg path{stroke:var(--second-gray-color)}}@keyframes rotate{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: TooltipDirective, selector: "[ddTooltip]", inputs: ["ddTooltip", "withClick", "position"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibFilterButtonComponent, decorators: [{
             type: Component,
@@ -1886,11 +2176,11 @@ class LibSkeletonComponent {
         this.length = length;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSkeletonComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibSkeletonComponent, isStandalone: true, selector: "dd-lib-skeleton", inputs: { deepParent: "deepParent", sHeight: "sHeight", sMb: "sMb", skeleton: "skeleton", plugs: "plugs" }, ngImport: i0, template: "@if (_skeleton && _plugs.length) { @for (plug of _plugs; track plug) {\r\n<div\r\n  [class.skeleton]=\"_skeleton\"\r\n  [style.height]=\"_skeleton ? sHeight : ''\"\r\n  [style.margin-bottom]=\"sMb\"\r\n  class=\"skelet full-width full-height\"></div>\r\n} } @else {\r\n<div [style.height]=\"_skeleton ? sHeight : ''\" [class.skeleton]=\"_skeleton\" [ddAutoHeight]=\"deepParent\">\r\n  <ng-content></ng-content>\r\n</div>\r\n}\r\n", styles: [":host{min-width:100%}.skeleton{position:relative;overflow:hidden;min-height:100%}.skeleton:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#d0cdcd00 0,#d0cdcd33 20%,#d0cdcd80 60%,#d0cdcd00);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.skelet{min-height:100%;border-radius:24px}\n"], dependencies: [{ kind: "directive", type: AutoHeightDirective, selector: "[ddAutoHeight]", inputs: ["ddAutoHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibSkeletonComponent, isStandalone: true, selector: "dd-lib-skeleton", inputs: { deepParent: "deepParent", sHeight: "sHeight", sMb: "sMb", skeleton: "skeleton", plugs: "plugs" }, ngImport: i0, template: "@if (_skeleton && _plugs.length) { @for (plug of _plugs; track plug) {\r\n<div\r\n  [class.skeleton]=\"_skeleton\"\r\n  [style.height]=\"_skeleton ? sHeight : ''\"\r\n  [style.margin-bottom]=\"sMb\"\r\n  class=\"skelet full-width full-height\"></div>\r\n} } @else {\r\n<div class=\"full-width\" [style.height]=\"_skeleton ? sHeight : ''\" [class.skeleton]=\"_skeleton\" [ddAutoHeight]=\"deepParent\">\r\n  <ng-content></ng-content>\r\n</div>\r\n}\r\n", styles: [":host{min-width:100%;display:flex}.skeleton{position:relative;overflow:hidden;min-height:100%;flex-grow:1;border-radius:12px}.skeleton:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#d0cdcd00 0,#d0cdcd33 20%,#d0cdcd80 60%,#d0cdcd00);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.skelet{min-height:100%;border-radius:24px}\n"], dependencies: [{ kind: "directive", type: AutoHeightDirective, selector: "[ddAutoHeight]", inputs: ["ddAutoHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSkeletonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dd-lib-skeleton', standalone: true, imports: [AutoHeightDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_skeleton && _plugs.length) { @for (plug of _plugs; track plug) {\r\n<div\r\n  [class.skeleton]=\"_skeleton\"\r\n  [style.height]=\"_skeleton ? sHeight : ''\"\r\n  [style.margin-bottom]=\"sMb\"\r\n  class=\"skelet full-width full-height\"></div>\r\n} } @else {\r\n<div [style.height]=\"_skeleton ? sHeight : ''\" [class.skeleton]=\"_skeleton\" [ddAutoHeight]=\"deepParent\">\r\n  <ng-content></ng-content>\r\n</div>\r\n}\r\n", styles: [":host{min-width:100%}.skeleton{position:relative;overflow:hidden;min-height:100%}.skeleton:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#d0cdcd00 0,#d0cdcd33 20%,#d0cdcd80 60%,#d0cdcd00);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.skelet{min-height:100%;border-radius:24px}\n"] }]
+            args: [{ selector: 'dd-lib-skeleton', standalone: true, imports: [AutoHeightDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (_skeleton && _plugs.length) { @for (plug of _plugs; track plug) {\r\n<div\r\n  [class.skeleton]=\"_skeleton\"\r\n  [style.height]=\"_skeleton ? sHeight : ''\"\r\n  [style.margin-bottom]=\"sMb\"\r\n  class=\"skelet full-width full-height\"></div>\r\n} } @else {\r\n<div class=\"full-width\" [style.height]=\"_skeleton ? sHeight : ''\" [class.skeleton]=\"_skeleton\" [ddAutoHeight]=\"deepParent\">\r\n  <ng-content></ng-content>\r\n</div>\r\n}\r\n", styles: [":host{min-width:100%;display:flex}.skeleton{position:relative;overflow:hidden;min-height:100%;flex-grow:1;border-radius:12px}.skeleton:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#d0cdcd00 0,#d0cdcd33 20%,#d0cdcd80 60%,#d0cdcd00);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.skelet{min-height:100%;border-radius:24px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { deepParent: [{
                 type: Input
             }], sHeight: [{
@@ -1911,11 +2201,11 @@ class LibCardComponent {
         this.cardBtnEvent = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCardComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibCardComponent, isStandalone: true, selector: "dd-lib-card", inputs: { type: "type", footerBtn: "footerBtn", sHeight: "sHeight", skeleton: "skeleton", parentLvlForSkeleton: "parentLvlForSkeleton", plugs: "plugs", borderRadius: "borderRadius" }, outputs: { cardBtnEvent: "cardBtnEvent" }, ngImport: i0, template: "<div\r\n  class=\"lib-card-wrapper\"\r\n  [class.border-r-bottom]=\"borderRadius === 'bottom'\"\r\n  [class.border-r-none]=\"borderRadius === 'none'\"\r\n  [class.border-r-top]=\"borderRadius === 'top'\"\r\n  [class.giant-card]=\"type === 'giant'\"\r\n  [class.small-card]=\"type === 'small'\"\r\n  [class.with-footer]=\"!!footerBtn\">\r\n  <dd-lib-skeleton\r\n    [deepParent]=\"parentLvlForSkeleton\"\r\n    [skeleton]=\"skeleton\"\r\n    [plugs]=\"plugs\"\r\n    [sHeight]=\"sHeight\">\r\n    <div class=\"lib-card\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </dd-lib-skeleton>\r\n</div>\r\n@if (footerBtn) {\r\n<div (click)=\"cardBtnEvent.emit(); cdr.detectChanges()\" class=\"lib-card-footer-btn\">\r\n  {{ footerBtn }}\r\n</div>\r\n}\r\n", styles: [":host{display:block}.lib-card-wrapper{border-radius:24px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color);min-height:100%}@media screen and (max-width: 480px){.lib-card-wrapper{border-radius:16px}}.lib-card-wrapper.border-r-bottom{border-radius:0 0 24px 24px}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-bottom{border-radius:0 0 16px 16px}}.lib-card-wrapper.border-r-top{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-top{border-radius:16px 16px 0 0}}.lib-card-wrapper.border-r-none{border-radius:0}.lib-card-wrapper.small-card{border-radius:12px}.lib-card-wrapper.giant-card .lib-card{padding:32px}@media screen and (max-width: 840px){.lib-card-wrapper.giant-card .lib-card{padding:24px}}@media screen and (max-width: 480px){.lib-card-wrapper.giant-card .lib-card{padding:16px}}.lib-card-wrapper.with-footer{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.with-footer{border-radius:16px 16px 0 0}}.lib-card{min-height:100%;padding:24px}@media screen and (max-width: 480px){.lib-card{padding:16px}}.lib-card-footer-btn{border-radius:0 0 12px 12px;font-weight:500;background-color:var(--primary-green-color);color:var(--white-color);cursor:pointer;height:48px;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: LibSkeletonComponent, selector: "dd-lib-skeleton", inputs: ["deepParent", "sHeight", "sMb", "skeleton", "plugs"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibCardComponent, isStandalone: true, selector: "dd-lib-card", inputs: { type: "type", footerBtn: "footerBtn", sHeight: "sHeight", skeleton: "skeleton", parentLvlForSkeleton: "parentLvlForSkeleton", plugs: "plugs", borderRadius: "borderRadius" }, outputs: { cardBtnEvent: "cardBtnEvent" }, ngImport: i0, template: "<div\r\n  class=\"lib-card-wrapper\"\r\n  [class.border-r-bottom]=\"borderRadius === 'bottom'\"\r\n  [class.border-r-none]=\"borderRadius === 'none'\"\r\n  [class.border-r-top]=\"borderRadius === 'top'\"\r\n  [class.giant-card]=\"type === 'giant'\"\r\n  [class.small-card]=\"type === 'small'\"\r\n  [class.with-footer]=\"!!footerBtn\">\r\n  @if (skeleton) {\r\n    <dd-lib-skeleton\r\n      [deepParent]=\"parentLvlForSkeleton\"\r\n      [skeleton]=\"skeleton\"\r\n      [plugs]=\"plugs\"\r\n      [sHeight]=\"sHeight\">\r\n      <div class=\"lib-card\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </dd-lib-skeleton>\r\n  } @else {\r\n    <div class=\"lib-card\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  }\r\n</div>\r\n@if (footerBtn) {\r\n<div (click)=\"cardBtnEvent.emit(); cdr.detectChanges()\" class=\"lib-card-footer-btn\">\r\n  {{ footerBtn }}\r\n</div>\r\n}\r\n", styles: [":host{display:block}.lib-card-wrapper{display:flex;border-radius:24px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color);min-height:100%}@media screen and (max-width: 480px){.lib-card-wrapper{border-radius:16px}}.lib-card-wrapper.border-r-bottom{border-radius:0 0 24px 24px}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-bottom{border-radius:0 0 16px 16px}}.lib-card-wrapper.border-r-top{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-top{border-radius:16px 16px 0 0}}.lib-card-wrapper.border-r-none{border-radius:0}.lib-card-wrapper.small-card{border-radius:12px}.lib-card-wrapper.giant-card .lib-card{padding:32px}@media screen and (max-width: 840px){.lib-card-wrapper.giant-card .lib-card{padding:24px}}@media screen and (max-width: 480px){.lib-card-wrapper.giant-card .lib-card{padding:16px}}.lib-card-wrapper.with-footer{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.with-footer{border-radius:16px 16px 0 0}}.lib-card{min-height:100%;min-width:100%;padding:24px;display:flex}@media screen and (max-width: 480px){.lib-card{padding:16px}}.lib-card-footer-btn{border-radius:0 0 12px 12px;font-weight:500;background-color:var(--primary-green-color);color:var(--white-color);cursor:pointer;height:48px;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: LibSkeletonComponent, selector: "dd-lib-skeleton", inputs: ["deepParent", "sHeight", "sMb", "skeleton", "plugs"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dd-lib-card', standalone: true, imports: [LibSkeletonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"lib-card-wrapper\"\r\n  [class.border-r-bottom]=\"borderRadius === 'bottom'\"\r\n  [class.border-r-none]=\"borderRadius === 'none'\"\r\n  [class.border-r-top]=\"borderRadius === 'top'\"\r\n  [class.giant-card]=\"type === 'giant'\"\r\n  [class.small-card]=\"type === 'small'\"\r\n  [class.with-footer]=\"!!footerBtn\">\r\n  <dd-lib-skeleton\r\n    [deepParent]=\"parentLvlForSkeleton\"\r\n    [skeleton]=\"skeleton\"\r\n    [plugs]=\"plugs\"\r\n    [sHeight]=\"sHeight\">\r\n    <div class=\"lib-card\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </dd-lib-skeleton>\r\n</div>\r\n@if (footerBtn) {\r\n<div (click)=\"cardBtnEvent.emit(); cdr.detectChanges()\" class=\"lib-card-footer-btn\">\r\n  {{ footerBtn }}\r\n</div>\r\n}\r\n", styles: [":host{display:block}.lib-card-wrapper{border-radius:24px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color);min-height:100%}@media screen and (max-width: 480px){.lib-card-wrapper{border-radius:16px}}.lib-card-wrapper.border-r-bottom{border-radius:0 0 24px 24px}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-bottom{border-radius:0 0 16px 16px}}.lib-card-wrapper.border-r-top{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-top{border-radius:16px 16px 0 0}}.lib-card-wrapper.border-r-none{border-radius:0}.lib-card-wrapper.small-card{border-radius:12px}.lib-card-wrapper.giant-card .lib-card{padding:32px}@media screen and (max-width: 840px){.lib-card-wrapper.giant-card .lib-card{padding:24px}}@media screen and (max-width: 480px){.lib-card-wrapper.giant-card .lib-card{padding:16px}}.lib-card-wrapper.with-footer{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.with-footer{border-radius:16px 16px 0 0}}.lib-card{min-height:100%;padding:24px}@media screen and (max-width: 480px){.lib-card{padding:16px}}.lib-card-footer-btn{border-radius:0 0 12px 12px;font-weight:500;background-color:var(--primary-green-color);color:var(--white-color);cursor:pointer;height:48px;display:flex;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'dd-lib-card', standalone: true, imports: [LibSkeletonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"lib-card-wrapper\"\r\n  [class.border-r-bottom]=\"borderRadius === 'bottom'\"\r\n  [class.border-r-none]=\"borderRadius === 'none'\"\r\n  [class.border-r-top]=\"borderRadius === 'top'\"\r\n  [class.giant-card]=\"type === 'giant'\"\r\n  [class.small-card]=\"type === 'small'\"\r\n  [class.with-footer]=\"!!footerBtn\">\r\n  @if (skeleton) {\r\n    <dd-lib-skeleton\r\n      [deepParent]=\"parentLvlForSkeleton\"\r\n      [skeleton]=\"skeleton\"\r\n      [plugs]=\"plugs\"\r\n      [sHeight]=\"sHeight\">\r\n      <div class=\"lib-card\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </dd-lib-skeleton>\r\n  } @else {\r\n    <div class=\"lib-card\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  }\r\n</div>\r\n@if (footerBtn) {\r\n<div (click)=\"cardBtnEvent.emit(); cdr.detectChanges()\" class=\"lib-card-footer-btn\">\r\n  {{ footerBtn }}\r\n</div>\r\n}\r\n", styles: [":host{display:block}.lib-card-wrapper{display:flex;border-radius:24px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color);min-height:100%}@media screen and (max-width: 480px){.lib-card-wrapper{border-radius:16px}}.lib-card-wrapper.border-r-bottom{border-radius:0 0 24px 24px}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-bottom{border-radius:0 0 16px 16px}}.lib-card-wrapper.border-r-top{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.border-r-top{border-radius:16px 16px 0 0}}.lib-card-wrapper.border-r-none{border-radius:0}.lib-card-wrapper.small-card{border-radius:12px}.lib-card-wrapper.giant-card .lib-card{padding:32px}@media screen and (max-width: 840px){.lib-card-wrapper.giant-card .lib-card{padding:24px}}@media screen and (max-width: 480px){.lib-card-wrapper.giant-card .lib-card{padding:16px}}.lib-card-wrapper.with-footer{border-radius:24px 24px 0 0}@media screen and (max-width: 480px){.lib-card-wrapper.with-footer{border-radius:16px 16px 0 0}}.lib-card{min-height:100%;min-width:100%;padding:24px;display:flex}@media screen and (max-width: 480px){.lib-card{padding:16px}}.lib-card-footer-btn{border-radius:0 0 12px 12px;font-weight:500;background-color:var(--primary-green-color);color:var(--white-color);cursor:pointer;height:48px;display:flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
                 type: Input
             }], footerBtn: [{
@@ -1935,14 +2225,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
             }] } });
 
 class LibRadioComponent {
-    constructor() {
+    static { this.idCounter = 1; }
+    constructor(cdr) {
+        this.cdr = cdr;
         this.disabled = false; // состояние: по умолчанию - активное
         this.required = false;
         this.checked = false;
         this.changed = new EventEmitter();
         this.modelInitialization = true;
     }
-    static { this.idCounter = 1; }
     ngOnInit() {
         if (!this.radioId) {
             this.radioId = 'dd-radio-' + LibRadioComponent.idCounter++;
@@ -1969,16 +2260,17 @@ class LibRadioComponent {
             return;
         }
         this.checked = value === this.value;
+        this.cdr.detectChanges();
     }
     propagateChange(_value) { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibRadioComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibRadioComponent, isStandalone: true, selector: "dd-lib-radio", inputs: { radioId: "radioId", disabled: "disabled", required: "required", name: "name", value: "value", checked: "checked" }, outputs: { changed: "changed" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => LibRadioComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "<label [for]=\"radioId\" [ngClass]=\"{ disabled: disabled }\" class=\"radio\">\r\n  <input\r\n    (change)=\"onSelected($event.target)\"\r\n    [attr.aria-checked]=\"checked\"\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [attr.value]=\"value\"\r\n    [checked]=\"checked\"\r\n    [disabled]=\"disabled\"\r\n    [id]=\"radioId\"\r\n    [name]=\"name\"\r\n    [ngClass]=\"{ disabled: disabled }\"\r\n    [required]=\"required\"\r\n    class=\"radio__input\"\r\n    role=\"radio\"\r\n    type=\"radio\" />\r\n  <div [class.focused]=\"focused\" class=\"radio__mark\"></div>\r\n  <div class=\"radio__text g-text\" [ngClass]=\"disabled ? 'gray' : 'black'\">\r\n    <span><ng-content></ng-content></span>\r\n  </div>\r\n</label>\r\n", styles: [":host{outline:none}.radio{position:relative;display:flex;align-items:center;cursor:pointer}.radio:hover .radio__mark{border-color:var(--light-black-color)}.radio.disabled{cursor:default}.radio.disabled .radio__mark{border-color:var(--gray-color-200)}.radio__input{opacity:0;position:absolute;z-index:-1;min-width:20px;min-height:20px;margin:0}.radio__input:focus+.radio__mark{border-color:var(--light-black-color)}.radio__input:checked+.radio__mark{border:2px solid var(--primary-green-color)}.radio__input:checked+.radio__mark:before{background:var(--primary-green-color)}.radio__input:checked~.radio__text{font-weight:500}.radio__input:checked.disabled+.radio__mark{border-color:var(--gray-color-200)}.radio__input:checked.disabled+.radio__mark:before{background:var(--gray-color-200)}.radio__mark{position:relative;width:20px;height:20px;min-width:20px;min-height:20px;border:1px solid var(--primary-gray-color);border-radius:50%;margin-right:12px;transition:border-color .25s linear}.radio__mark:before{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:transparent;transition:background-color .25s linear;content:\"\"}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "<label [for]=\"radioId\" [ngClass]=\"{ disabled: disabled }\" class=\"radio\">\r\n  <input\r\n    (change)=\"onSelected($event.target)\"\r\n    [attr.aria-checked]=\"checked\"\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [attr.value]=\"value\"\r\n    [checked]=\"checked\"\r\n    [disabled]=\"disabled\"\r\n    [id]=\"radioId\"\r\n    [name]=\"name\"\r\n    [ngClass]=\"{ disabled: disabled }\"\r\n    [required]=\"required\"\r\n    class=\"radio__input\"\r\n    role=\"radio\"\r\n    type=\"radio\" />\r\n  <div [class.focused]=\"focused\" class=\"radio__mark\"></div>\r\n  <div class=\"radio__text g-text\" [ngClass]=\"disabled ? 'gray' : 'black'\">\r\n    <span><ng-content></ng-content></span>\r\n  </div>\r\n</label>\r\n", styles: [":host{outline:none}.radio{position:relative;display:flex;align-items:center;cursor:pointer}.radio:hover .radio__mark{border-color:var(--light-black-color)}.radio.disabled{cursor:default}.radio.disabled .radio__mark{border-color:var(--gray-color-200)}.radio__input{opacity:0;position:absolute;z-index:-1;min-width:20px;min-height:20px;margin:0}.radio__input:focus+.radio__mark{border-color:var(--light-black-color)}.radio__input:checked+.radio__mark{border:2px solid var(--primary-green-color)}.radio__input:checked+.radio__mark:before{background:var(--primary-green-color)}.radio__input:checked~.radio__text{font-weight:500}.radio__input:checked.disabled+.radio__mark{border-color:var(--gray-color-200)}.radio__input:checked.disabled+.radio__mark:before{background:var(--gray-color-200)}.radio__mark{position:relative;width:20px;height:20px;min-width:20px;min-height:20px;border:1px solid var(--primary-gray-color);border-radius:50%;margin-right:12px;transition:border-color .25s linear}.radio__mark:before{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:transparent;transition:background-color .25s linear;content:\"\"}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibRadioComponent, decorators: [{
             type: Component,
@@ -1989,7 +2281,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             multi: true,
                         },
                     ], template: "<label [for]=\"radioId\" [ngClass]=\"{ disabled: disabled }\" class=\"radio\">\r\n  <input\r\n    (change)=\"onSelected($event.target)\"\r\n    [attr.aria-checked]=\"checked\"\r\n    [attr.tabIndex]=\"disabled ? -1 : 0\"\r\n    [attr.value]=\"value\"\r\n    [checked]=\"checked\"\r\n    [disabled]=\"disabled\"\r\n    [id]=\"radioId\"\r\n    [name]=\"name\"\r\n    [ngClass]=\"{ disabled: disabled }\"\r\n    [required]=\"required\"\r\n    class=\"radio__input\"\r\n    role=\"radio\"\r\n    type=\"radio\" />\r\n  <div [class.focused]=\"focused\" class=\"radio__mark\"></div>\r\n  <div class=\"radio__text g-text\" [ngClass]=\"disabled ? 'gray' : 'black'\">\r\n    <span><ng-content></ng-content></span>\r\n  </div>\r\n</label>\r\n", styles: [":host{outline:none}.radio{position:relative;display:flex;align-items:center;cursor:pointer}.radio:hover .radio__mark{border-color:var(--light-black-color)}.radio.disabled{cursor:default}.radio.disabled .radio__mark{border-color:var(--gray-color-200)}.radio__input{opacity:0;position:absolute;z-index:-1;min-width:20px;min-height:20px;margin:0}.radio__input:focus+.radio__mark{border-color:var(--light-black-color)}.radio__input:checked+.radio__mark{border:2px solid var(--primary-green-color)}.radio__input:checked+.radio__mark:before{background:var(--primary-green-color)}.radio__input:checked~.radio__text{font-weight:500}.radio__input:checked.disabled+.radio__mark{border-color:var(--gray-color-200)}.radio__input:checked.disabled+.radio__mark:before{background:var(--gray-color-200)}.radio__mark{position:relative;width:20px;height:20px;min-width:20px;min-height:20px;border:1px solid var(--primary-gray-color);border-radius:50%;margin-right:12px;transition:border-color .25s linear}.radio__mark:before{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:transparent;transition:background-color .25s linear;content:\"\"}\n"] }]
-        }], propDecorators: { radioId: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { radioId: [{
                 type: Input
             }], disabled: [{
                 type: Input
@@ -2345,7 +2637,7 @@ class LibCalendarComponent {
                 useExisting: forwardRef(() => LibCalendarComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n  @if (dateValue) {\r\n  <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n  }\r\n  <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n  @if (dateValue) {\r\n    <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n  } @if (showCalendar) {\r\n  <div class=\"calendar-abs-wrapper\">\r\n    <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n  </div>\r\n  }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n  <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n    <div class=\"calendar-block__header\">\r\n      <div class=\"calendar-block__header_arrow\">\r\n        <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n      </div>\r\n      <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n      <div class=\"calendar-block__header_arrow\">\r\n        <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n      </div>\r\n    </div>\r\n    <div class=\"calendar-block__week\">\r\n      @for (day of week; track day) {\r\n      <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n      }\r\n    </div>\r\n    <div class=\"calendar-block__days\">\r\n      @for (day of daysInMonth?.prevDays; track day) {\r\n      <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n      } @for (day of daysInMonth?.days; track day) {\r\n      <div\r\n        (click)=\"selectDay(day)\"\r\n        [class.active]=\"checkActiveDay(day)\"\r\n\r\n        [class.current]=\"\r\n          dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n        \"\r\n        [class.hide]=\"checkHideDay(day)\"\r\n        class=\"calendar-block__days_day normal\">\r\n        {{ day }}\r\n      </div>\r\n      } @for (day of daysInMonth?.lastDays; track day) {\r\n      <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n      }\r\n    </div>\r\n    @if(needTime) {\r\n      <div class=\"calendar-block__time\">\r\n        <div class=\"d-flex justify-between\">\r\n          <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n          <div class=\"d-flex\">\r\n            <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n                   type=\"text\"\r\n                   [ddMaxNum]=\"maxHours\"\r\n                   [curVal]=\"hours\"\r\n                   [disabled]=\"!dateValue\"\r\n                   [regExp]=\"true\"\r\n                   ddBanSymbol=\"^\\d+$\"\r\n                   max=\"23\"\r\n                   maxlength=\"2\"\r\n                   pattern=\"^\\d+$\">\r\n            <span class=\"second-dot\">:</span>\r\n            <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n                   [ddMaxNum]=\"maxMinutes\"\r\n                   [curVal]=\"minutes\"\r\n                   [disabled]=\"!dateValue\"\r\n                   [regExp]=\"true\"\r\n                   ddBanSymbol=\"^\\d+$\"\r\n                   max=\"59\"\r\n                   maxlength=\"2\"\r\n                   pattern=\"^\\d+$\"\r\n                   type=\"text\">\r\n          </div>\r\n        </div>\r\n      </div>\r\n    }\r\n    <div class=\"calendar-block__footer\">\r\n      <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n        >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n      </dd-lib-button>\r\n      <dd-lib-button (click)=\"selectDate()\"\r\n                     [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n                     class=\"calendar-block__footer_btn\"\r\n        >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n      </dd-lib-button>\r\n    </div>\r\n  </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: LibCardComponent, selector: "dd-lib-card", inputs: ["type", "footerBtn", "sHeight", "skeleton", "parentLvlForSkeleton", "plugs", "borderRadius"], outputs: ["cardBtnEvent"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: BanSymbolDirective, selector: "[ddBanSymbol]", inputs: ["ddBanSymbol", "regExp"] }, { kind: "directive", type: MaxNumDirective, selector: "[ddMaxNum]", inputs: ["ddMaxNum", "curVal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n  @if (dateValue) {\r\n  <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n  }\r\n  <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n  @if (dateValue) {\r\n    <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n  } @if (showCalendar) {\r\n  <div class=\"calendar-abs-wrapper\">\r\n    <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n  </div>\r\n  }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n  <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n   <div class=\"full-width\">\r\n     <div class=\"calendar-block__header\">\r\n       <div class=\"calendar-block__header_arrow\">\r\n         <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n       </div>\r\n       <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n       <div class=\"calendar-block__header_arrow\">\r\n         <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n       </div>\r\n     </div>\r\n     <div class=\"calendar-block__week\">\r\n       @for (day of week; track day) {\r\n         <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n       }\r\n     </div>\r\n     <div class=\"calendar-block__days\">\r\n       @for (day of daysInMonth?.prevDays; track day) {\r\n         <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n       } @for (day of daysInMonth?.days; track day) {\r\n       <div\r\n         (click)=\"selectDay(day)\"\r\n         [class.active]=\"checkActiveDay(day)\"\r\n\r\n         [class.current]=\"\r\n          dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n        \"\r\n         [class.hide]=\"checkHideDay(day)\"\r\n         class=\"calendar-block__days_day normal\">\r\n         {{ day }}\r\n       </div>\r\n     } @for (day of daysInMonth?.lastDays; track day) {\r\n       <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n     }\r\n     </div>\r\n     @if(needTime) {\r\n       <div class=\"calendar-block__time\">\r\n         <div class=\"d-flex justify-between\">\r\n           <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n           <div class=\"d-flex\">\r\n             <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n                    type=\"text\"\r\n                    [ddMaxNum]=\"maxHours\"\r\n                    [curVal]=\"hours\"\r\n                    [disabled]=\"!dateValue\"\r\n                    [regExp]=\"true\"\r\n                    ddBanSymbol=\"^\\d+$\"\r\n                    max=\"23\"\r\n                    maxlength=\"2\"\r\n                    pattern=\"^\\d+$\">\r\n             <span class=\"second-dot\">:</span>\r\n             <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n                    [ddMaxNum]=\"maxMinutes\"\r\n                    [curVal]=\"minutes\"\r\n                    [disabled]=\"!dateValue\"\r\n                    [regExp]=\"true\"\r\n                    ddBanSymbol=\"^\\d+$\"\r\n                    max=\"59\"\r\n                    maxlength=\"2\"\r\n                    pattern=\"^\\d+$\"\r\n                    type=\"text\">\r\n           </div>\r\n         </div>\r\n       </div>\r\n     }\r\n     <div class=\"calendar-block__footer\">\r\n       <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n       >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n       </dd-lib-button>\r\n       <dd-lib-button (click)=\"selectDate()\"\r\n                      [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n                      class=\"calendar-block__footer_btn\"\r\n       >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n       </dd-lib-button>\r\n     </div>\r\n   </div>\r\n  </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: LibCardComponent, selector: "dd-lib-card", inputs: ["type", "footerBtn", "sHeight", "skeleton", "parentLvlForSkeleton", "plugs", "borderRadius"], outputs: ["cardBtnEvent"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$3.DatePipe, name: "date" }, { kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: BanSymbolDirective, selector: "[ddBanSymbol]", inputs: ["ddBanSymbol", "regExp"] }, { kind: "directive", type: MaxNumDirective, selector: "[ddMaxNum]", inputs: ["ddMaxNum", "curVal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCalendarComponent, decorators: [{
             type: Component,
@@ -2366,7 +2658,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             useExisting: forwardRef(() => LibCalendarComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n  @if (dateValue) {\r\n  <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n  }\r\n  <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n  @if (dateValue) {\r\n    <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n  } @if (showCalendar) {\r\n  <div class=\"calendar-abs-wrapper\">\r\n    <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n  </div>\r\n  }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n  <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n    <div class=\"calendar-block__header\">\r\n      <div class=\"calendar-block__header_arrow\">\r\n        <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n      </div>\r\n      <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n      <div class=\"calendar-block__header_arrow\">\r\n        <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n      </div>\r\n    </div>\r\n    <div class=\"calendar-block__week\">\r\n      @for (day of week; track day) {\r\n      <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n      }\r\n    </div>\r\n    <div class=\"calendar-block__days\">\r\n      @for (day of daysInMonth?.prevDays; track day) {\r\n      <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n      } @for (day of daysInMonth?.days; track day) {\r\n      <div\r\n        (click)=\"selectDay(day)\"\r\n        [class.active]=\"checkActiveDay(day)\"\r\n\r\n        [class.current]=\"\r\n          dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n        \"\r\n        [class.hide]=\"checkHideDay(day)\"\r\n        class=\"calendar-block__days_day normal\">\r\n        {{ day }}\r\n      </div>\r\n      } @for (day of daysInMonth?.lastDays; track day) {\r\n      <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n      }\r\n    </div>\r\n    @if(needTime) {\r\n      <div class=\"calendar-block__time\">\r\n        <div class=\"d-flex justify-between\">\r\n          <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n          <div class=\"d-flex\">\r\n            <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n                   type=\"text\"\r\n                   [ddMaxNum]=\"maxHours\"\r\n                   [curVal]=\"hours\"\r\n                   [disabled]=\"!dateValue\"\r\n                   [regExp]=\"true\"\r\n                   ddBanSymbol=\"^\\d+$\"\r\n                   max=\"23\"\r\n                   maxlength=\"2\"\r\n                   pattern=\"^\\d+$\">\r\n            <span class=\"second-dot\">:</span>\r\n            <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n                   [ddMaxNum]=\"maxMinutes\"\r\n                   [curVal]=\"minutes\"\r\n                   [disabled]=\"!dateValue\"\r\n                   [regExp]=\"true\"\r\n                   ddBanSymbol=\"^\\d+$\"\r\n                   max=\"59\"\r\n                   maxlength=\"2\"\r\n                   pattern=\"^\\d+$\"\r\n                   type=\"text\">\r\n          </div>\r\n        </div>\r\n      </div>\r\n    }\r\n    <div class=\"calendar-block__footer\">\r\n      <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n        >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n      </dd-lib-button>\r\n      <dd-lib-button (click)=\"selectDate()\"\r\n                     [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n                     class=\"calendar-block__footer_btn\"\r\n        >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n      </dd-lib-button>\r\n    </div>\r\n  </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n  @if (dateValue) {\r\n  <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n  }\r\n  <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n  @if (dateValue) {\r\n    <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n  } @if (showCalendar) {\r\n  <div class=\"calendar-abs-wrapper\">\r\n    <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n  </div>\r\n  }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n  <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n   <div class=\"full-width\">\r\n     <div class=\"calendar-block__header\">\r\n       <div class=\"calendar-block__header_arrow\">\r\n         <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n       </div>\r\n       <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n       <div class=\"calendar-block__header_arrow\">\r\n         <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n       </div>\r\n     </div>\r\n     <div class=\"calendar-block__week\">\r\n       @for (day of week; track day) {\r\n         <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n       }\r\n     </div>\r\n     <div class=\"calendar-block__days\">\r\n       @for (day of daysInMonth?.prevDays; track day) {\r\n         <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n       } @for (day of daysInMonth?.days; track day) {\r\n       <div\r\n         (click)=\"selectDay(day)\"\r\n         [class.active]=\"checkActiveDay(day)\"\r\n\r\n         [class.current]=\"\r\n          dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n        \"\r\n         [class.hide]=\"checkHideDay(day)\"\r\n         class=\"calendar-block__days_day normal\">\r\n         {{ day }}\r\n       </div>\r\n     } @for (day of daysInMonth?.lastDays; track day) {\r\n       <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n     }\r\n     </div>\r\n     @if(needTime) {\r\n       <div class=\"calendar-block__time\">\r\n         <div class=\"d-flex justify-between\">\r\n           <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n           <div class=\"d-flex\">\r\n             <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n                    type=\"text\"\r\n                    [ddMaxNum]=\"maxHours\"\r\n                    [curVal]=\"hours\"\r\n                    [disabled]=\"!dateValue\"\r\n                    [regExp]=\"true\"\r\n                    ddBanSymbol=\"^\\d+$\"\r\n                    max=\"23\"\r\n                    maxlength=\"2\"\r\n                    pattern=\"^\\d+$\">\r\n             <span class=\"second-dot\">:</span>\r\n             <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n                    [ddMaxNum]=\"maxMinutes\"\r\n                    [curVal]=\"minutes\"\r\n                    [disabled]=\"!dateValue\"\r\n                    [regExp]=\"true\"\r\n                    ddBanSymbol=\"^\\d+$\"\r\n                    max=\"59\"\r\n                    maxlength=\"2\"\r\n                    pattern=\"^\\d+$\"\r\n                    type=\"text\">\r\n           </div>\r\n         </div>\r\n       </div>\r\n     }\r\n     <div class=\"calendar-block__footer\">\r\n       <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n       >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n       </dd-lib-button>\r\n       <dd-lib-button (click)=\"selectDate()\"\r\n                      [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n                      class=\"calendar-block__footer_btn\"\r\n       >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n       </dd-lib-button>\r\n     </div>\r\n   </div>\r\n  </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], ctorParameters: () => [{ type: DateService }], propDecorators: { type: [{
                 type: Input
             }], formatDate: [{
@@ -2394,7 +2686,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
             }] } });
 
 class LibCheckboxComponent {
-    constructor() {
+    static { this.idCounter = 1; }
+    constructor(cdr) {
+        this.cdr = cdr;
         this.required = false;
         this.disabled = false;
         this.checked = false;
@@ -2402,7 +2696,6 @@ class LibCheckboxComponent {
         this.hasContent = true;
         this.checkEvent = new EventEmitter();
     }
-    static { this.idCounter = 1; }
     ngOnInit() {
         if (!this.checkboxId) {
             this.checkboxId = 'dd-checkbox-' + LibCheckboxComponent.idCounter++;
@@ -2421,9 +2714,10 @@ class LibCheckboxComponent {
     }
     writeValue(value) {
         this.checked = value;
+        this.cdr.detectChanges();
     }
     propagateChange(value) { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibCheckboxComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibCheckboxComponent, isStandalone: true, selector: "dd-lib-checkbox", inputs: { checkboxId: "checkboxId", required: "required", disabled: "disabled", checked: "checked", customClass: "customClass", invalid: "invalid", hasContent: "hasContent" }, outputs: { checkEvent: "checkEvent" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -2441,7 +2735,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             multi: true,
                         },
                     ], template: "<input\n  (change)=\"onChecked($event.target)\"\n  [checked]=\"checked\"\n  [class.disabled]=\"disabled\"\n  [class.invalid]=\"invalid\"\n  [disabled]=\"disabled\"\n  [id]=\"checkboxId\"\n  [required]=\"required\"\n  [tabindex]=\"disabled ? -1 : null\"\n  class=\"check-input\"\n  type=\"checkbox\" />\n<label [for]=\"checkboxId\" class=\"{{ customClass }} check\">\n  <span [class.focused]=\"focused\" class=\"checkbox\"></span>\n  @if (hasContent) {\n    <span class=\"ml-12\">\n      <ng-content></ng-content>\n    </span>\n  }\n</label>\n", styles: [":host{outline:none;position:relative}.check{display:flex;position:relative;font-size:16px;width:fit-content;cursor:pointer;align-items:center}.check-input{appearance:none;position:absolute;opacity:0;margin:0;width:20px;height:20px}.check-input:hover+label .checkbox{border-color:var(--primary-green-color)}.check-input:hover:checked+label .checkbox{background:var(--cb-hover-bgc);border:none}.check-input:disabled+label,.check-input:disabled+label .checkbox,.check-input:hover:disabled+label,.check-input:hover:disabled+label .checkbox{cursor:default;pointer-events:none;border-color:var(--cb-init-border)}.check-input:disabled:checked+label .checkbox{cursor:default;pointer-events:none;border-color:var(--cb-init-border);background-color:var(--cb-init-border);font-weight:700}.check-input:checked+label{font-weight:700}.check-input:checked+label .checkbox{background:var(--cb-checked-bgc);border:none;position:relative}.check-input:checked+label .checkbox:before{content:\"\";background:url('data:image/svg+xml,<svg fill=\"none\" height=\"10\" viewBox=\"0 0 13 10\" width=\"13\" xmlns=\"http://www.w3.org/2000/svg\">%0D%0A  <path d=\"M1.33301 5.00008L4.66634 8.33341L11.333 1.66675\" stroke=\"white\" stroke-linecap=\"round\"%0D%0A        stroke-linejoin=\"round\"%0D%0A        stroke-width=\"1.7\"/>%0D%0A</svg>%0D%0A') no-repeat;height:10px;position:absolute;width:13px;top:5px;left:4px}.checkbox{min-width:20px;min-height:20px;padding:3px;background-color:var(--white-color);border-radius:5px;border:1px solid var(--cb-init-border);cursor:pointer}\n"] }]
-        }], propDecorators: { checkboxId: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { checkboxId: [{
                 type: Input
             }], required: [{
                 type: Input
@@ -2537,7 +2831,7 @@ class LibInputComponent extends LibCommonInputTextComponent {
     changeValueSub(control) {
         control.valueChanges
             .pipe(takeUntil(this.destroyed$))
-            .subscribe(val => {
+            .subscribe(() => {
             this.errorText = ValidatorsService.getErrorText(this.control?.errors);
         });
     }
@@ -2563,7 +2857,7 @@ class LibInputComponent extends LibCommonInputTextComponent {
                 useExisting: forwardRef(() => LibInputComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "contentInput", first: true, predicate: ["contentInput"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-input\">\n  <label [for]=\"id\" class=\"lib-input__title\">\n    {{ label }}\n    @if (required) {\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\n    }\n  </label>\n  <input\n    #input\n    (blur)=\"handleBlur()\"\n    (change)=\"handleChange()\"\n    (focus)=\"handleFocus()\"\n    (input)=\"handleInput($event)\"\n    (keyup.enter)=\"forceChange()\"\n    [showMaskTyped]=\"showMaskTyped\"\n    [dropSpecialCharacters]=\"dropSpecialCharacters\"\n    [shownMaskExpression]=\"shownMaskExpression\"\n    [mask]=\"mask\"\n    [validation]=\"validation\"\n    [prefix]=\"prefix\"\n    [suffix]=\"suffix\"\n    [(ngModel)]=\"value\"\n    [attr.autofocus]=\"autofocus\"\n    [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\n    [attr.id]=\"id ? id : null\"\n    [attr.max]=\"max\"\n    [attr.min]=\"min\"\n    [attr.maxlength]=\"maxlength\"\n    [attr.minlength]=\"minlength\"\n    [attr.name]=\"name\"\n    [attr.placeholder]=\"placeholder\"\n    [attr.tabIndex]=\"tabIndex\"\n    [attr.type]=\"type || 'text'\"\n    [class.focused]=\"focused\"\n    [class.invalid]=\"showError\"\n    [disabled]=\"disabled\"\n    [readOnly]=\"readOnly\"\n    class=\"text-input\" />\n  @if (errorTexts.length && showError) {\n    @for (error of errorTexts; track error) {\n      <div class=\"lib-input__error\">{{ error }}</div>\n    }\n  }\n  @if (errorText && showSelfError && showError) {\n      <div class=\"lib-input__error\">{{ errorText }}</div>\n  }\n</div>\n", styles: [":host{display:block}.lib-input{position:relative}.lib-input input{width:100%;height:48px;padding:15px 16px;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative;color:var(--light-black-color)}.lib-input input:hover{border-color:var(--input-active-border-colort)}.lib-input input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-input input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-input input:disabled::placeholder{color:var(--input-placeholder)}.lib-input input.invalid,.lib-input input.invalid:hover{border-color:var(--input-error-border-color)}.lib-input input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start;color:var(--light-black-color)}.lib-input__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-input .password-eye{position:absolute;right:16px;top:40px;cursor:pointer}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "contentInput", first: true, predicate: ["input"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-input\">\r\n  <label [for]=\"id\" class=\"lib-input__title g-text-sm\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n  <input\r\n    #input\r\n    (blur)=\"handleBlur()\"\r\n    (change)=\"handleChange()\"\r\n    (focus)=\"handleFocus()\"\r\n    (input)=\"handleInput($event)\"\r\n    (keyup.enter)=\"forceChange()\"\r\n    [showMaskTyped]=\"showMaskTyped\"\r\n    [dropSpecialCharacters]=\"dropSpecialCharacters\"\r\n    [shownMaskExpression]=\"shownMaskExpression\"\r\n    [mask]=\"mask\"\r\n    [validation]=\"validation\"\r\n    [prefix]=\"prefix\"\r\n    [suffix]=\"suffix\"\r\n    [(ngModel)]=\"value\"\r\n    [attr.autofocus]=\"autofocus\"\r\n    [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\r\n    [attr.id]=\"id ? id : null\"\r\n    [attr.max]=\"max\"\r\n    [attr.min]=\"min\"\r\n    [attr.maxlength]=\"maxlength\"\r\n    [attr.minlength]=\"minlength\"\r\n    [attr.name]=\"name\"\r\n    [attr.placeholder]=\"placeholder\"\r\n    [attr.tabIndex]=\"tabIndex\"\r\n    [attr.type]=\"type || 'text'\"\r\n    [class.focused]=\"focused\"\r\n    [class.invalid]=\"showError\"\r\n\r\n    [disabled]=\"disabled\"\r\n    [readOnly]=\"readOnly\"\r\n    class=\"text-input\" />\r\n  {{ngControl?.touched}}\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-input__error\">{{ error }}</div>\r\n    }\r\n  }\r\n  @if (errorText && showSelfError && showError) {\r\n      <div class=\"lib-input__error\">{{ errorText }}</div>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}.lib-input{position:relative}.lib-input input{width:100%;height:48px;padding:15px 16px;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative;color:var(--light-black-color)}.lib-input input:hover{border-color:var(--input-active-border-colort)}.lib-input input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-input input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-input input:disabled::placeholder{color:var(--input-placeholder)}.lib-input input.invalid,.lib-input input.invalid:hover{border-color:var(--input-error-border-color)}.lib-input input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start;color:var(--light-black-color)}.lib-input__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-input .password-eye{position:absolute;right:16px;top:40px;cursor:pointer}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibInputComponent, decorators: [{
             type: Component,
@@ -2574,7 +2868,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             useExisting: forwardRef(() => LibInputComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, NgxMaskDirective, NgOptimizedImage, LibCardComponent, LibSvgIconComponent], template: "<div class=\"lib-input\">\n  <label [for]=\"id\" class=\"lib-input__title\">\n    {{ label }}\n    @if (required) {\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\n    }\n  </label>\n  <input\n    #input\n    (blur)=\"handleBlur()\"\n    (change)=\"handleChange()\"\n    (focus)=\"handleFocus()\"\n    (input)=\"handleInput($event)\"\n    (keyup.enter)=\"forceChange()\"\n    [showMaskTyped]=\"showMaskTyped\"\n    [dropSpecialCharacters]=\"dropSpecialCharacters\"\n    [shownMaskExpression]=\"shownMaskExpression\"\n    [mask]=\"mask\"\n    [validation]=\"validation\"\n    [prefix]=\"prefix\"\n    [suffix]=\"suffix\"\n    [(ngModel)]=\"value\"\n    [attr.autofocus]=\"autofocus\"\n    [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\n    [attr.id]=\"id ? id : null\"\n    [attr.max]=\"max\"\n    [attr.min]=\"min\"\n    [attr.maxlength]=\"maxlength\"\n    [attr.minlength]=\"minlength\"\n    [attr.name]=\"name\"\n    [attr.placeholder]=\"placeholder\"\n    [attr.tabIndex]=\"tabIndex\"\n    [attr.type]=\"type || 'text'\"\n    [class.focused]=\"focused\"\n    [class.invalid]=\"showError\"\n    [disabled]=\"disabled\"\n    [readOnly]=\"readOnly\"\n    class=\"text-input\" />\n  @if (errorTexts.length && showError) {\n    @for (error of errorTexts; track error) {\n      <div class=\"lib-input__error\">{{ error }}</div>\n    }\n  }\n  @if (errorText && showSelfError && showError) {\n      <div class=\"lib-input__error\">{{ errorText }}</div>\n  }\n</div>\n", styles: [":host{display:block}.lib-input{position:relative}.lib-input input{width:100%;height:48px;padding:15px 16px;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative;color:var(--light-black-color)}.lib-input input:hover{border-color:var(--input-active-border-colort)}.lib-input input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-input input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-input input:disabled::placeholder{color:var(--input-placeholder)}.lib-input input.invalid,.lib-input input.invalid:hover{border-color:var(--input-error-border-color)}.lib-input input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start;color:var(--light-black-color)}.lib-input__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-input .password-eye{position:absolute;right:16px;top:40px;cursor:pointer}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, NgxMaskDirective, NgOptimizedImage, LibCardComponent, LibSvgIconComponent], template: "<div class=\"lib-input\">\r\n  <label [for]=\"id\" class=\"lib-input__title g-text-sm\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n  <input\r\n    #input\r\n    (blur)=\"handleBlur()\"\r\n    (change)=\"handleChange()\"\r\n    (focus)=\"handleFocus()\"\r\n    (input)=\"handleInput($event)\"\r\n    (keyup.enter)=\"forceChange()\"\r\n    [showMaskTyped]=\"showMaskTyped\"\r\n    [dropSpecialCharacters]=\"dropSpecialCharacters\"\r\n    [shownMaskExpression]=\"shownMaskExpression\"\r\n    [mask]=\"mask\"\r\n    [validation]=\"validation\"\r\n    [prefix]=\"prefix\"\r\n    [suffix]=\"suffix\"\r\n    [(ngModel)]=\"value\"\r\n    [attr.autofocus]=\"autofocus\"\r\n    [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\r\n    [attr.id]=\"id ? id : null\"\r\n    [attr.max]=\"max\"\r\n    [attr.min]=\"min\"\r\n    [attr.maxlength]=\"maxlength\"\r\n    [attr.minlength]=\"minlength\"\r\n    [attr.name]=\"name\"\r\n    [attr.placeholder]=\"placeholder\"\r\n    [attr.tabIndex]=\"tabIndex\"\r\n    [attr.type]=\"type || 'text'\"\r\n    [class.focused]=\"focused\"\r\n    [class.invalid]=\"showError\"\r\n\r\n    [disabled]=\"disabled\"\r\n    [readOnly]=\"readOnly\"\r\n    class=\"text-input\" />\r\n  {{ngControl?.touched}}\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-input__error\">{{ error }}</div>\r\n    }\r\n  }\r\n  @if (errorText && showSelfError && showError) {\r\n      <div class=\"lib-input__error\">{{ errorText }}</div>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}.lib-input{position:relative}.lib-input input{width:100%;height:48px;padding:15px 16px;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative;color:var(--light-black-color)}.lib-input input:hover{border-color:var(--input-active-border-colort)}.lib-input input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-input input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-input input:disabled::placeholder{color:var(--input-placeholder)}.lib-input input.invalid,.lib-input input.invalid:hover{border-color:var(--input-error-border-color)}.lib-input input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start;color:var(--light-black-color)}.lib-input__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-input .password-eye{position:absolute;right:16px;top:40px;cursor:pointer}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}\n"] }]
         }], ctorParameters: () => [{ type: DestroyService }, { type: i0.ChangeDetectorRef }, { type: i1$5.ControlContainer, decorators: [{
                     type: Optional
                 }, {
@@ -2583,7 +2877,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                     type: SkipSelf
                 }] }], propDecorators: { contentInput: [{
                 type: ViewChild,
-                args: ['contentInput', { read: ElementRef, static: true }]
+                args: ['input', { read: ElementRef, static: true }]
             }], showMaskTyped: [{
                 type: Input
             }], dropSpecialCharacters: [{
@@ -2602,8 +2896,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
 
 class LibPeriodComponent {
     static { this.idCounter = 1; }
-    constructor(dateService) {
+    constructor(dateService, cdr) {
         this.dateService = dateService;
+        this.cdr = cdr;
         this.setPeriodDate = new EventEmitter();
         this.periodIsShown = false;
         this.calendarIsShown = false;
@@ -2645,6 +2940,7 @@ class LibPeriodComponent {
     }
     writeValue(value) {
         this.selectedPeriod = value;
+        this.cdr.detectChanges();
     }
     selectDate($event) {
         this.calendarIsShown = false;
@@ -2672,7 +2968,7 @@ class LibPeriodComponent {
         }
     }
     propagateChange(value) { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibPeriodComponent, deps: [{ token: DateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibPeriodComponent, deps: [{ token: DateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibPeriodComponent, isStandalone: true, selector: "dd-lib-period", inputs: { maxDate: "maxDate" }, outputs: { setPeriodDate: "setPeriodDate" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -2698,7 +2994,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             multi: true,
                         },
                     ], template: "<div class=\"pos-relative\">\r\n  <dd-lib-filter-button\r\n    (clearEvent)=\"clearPeriod()\"\r\n    (clickEvent)=\"showPeriod()\"\r\n    [active]=\"periodIsSelected || calendarIsSelected\"\r\n    [id]=\"idPeriod\"\r\n    btnColor=\"transparent\">\r\n    <div>\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n  </dd-lib-filter-button>\r\n  @if (periodIsShown) {\r\n  <div (ddClickOutside)=\"clickOutside($event)\" [elements]=\"[idPeriod, idCalendar]\" class=\"period__wrapper\">\r\n    <dd-lib-card class=\"period__block\" type=\"small\">\r\n      <div>\r\n        <div class=\"period__header\">\r\n          <div class=\"period__back\" (click)=\"periodIsShown = false\">\r\n            <dd-lib-svg-icon icon=\"toggle_arrow_left\"></dd-lib-svg-icon>\r\n            <div class=\"g-h5-title\">\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n          </div>\r\n          <div class=\"g-h5-title hide-tablet\">\u041F\u0435\u0440\u0438\u043E\u0434</div>\r\n          <div (click)=\"clearPeriod()\" class=\"g-text font-medium green cup\">\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C</div>\r\n        </div>\r\n        <div class=\"period__list\">\r\n          @for (period of periodMenu; track period) {\r\n          <dd-lib-radio (changed)=\"selectPeriod($event)\" [(ngModel)]=\"selectedPeriod\" [value]=\"period.name\">{{\r\n            period.title\r\n          }}</dd-lib-radio>\r\n          }\r\n        </div>\r\n        <div (click)=\"calendarIsShown = !calendarIsShown\" class=\"g-text font-medium green cup mt-8\">\r\n          {{ calendarIsShown ? '\u0417\u0430\u043A\u0440\u044B\u0442\u044C' : '\u041E\u0442\u043A\u0440\u044B\u0442\u044C' }} \u043A\u0430\u043B\u0435\u043D\u0434\u0430\u0440\u044C\r\n        </div>\r\n      </div>\r\n    </dd-lib-card>\r\n    @if (calendarIsShown) {\r\n    <dd-lib-calendar\r\n      (emitDate)=\"selectDate($event)\"\r\n      [(ngModel)]=\"selectedDate\"\r\n      [id]=\"idCalendar\"\r\n      [maxDate]=\"maxDate\"\r\n      class=\"period__calendar\">\r\n    </dd-lib-calendar>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n", styles: ["dd-lib-filter-button{position:relative}.period__wrapper{position:absolute;left:0;z-index:400;display:block;width:352px;height:348px;margin-top:8px;animation:filter-show .5s forwards}@media screen and (max-width: 840px){.period__wrapper{position:fixed;top:0;width:100%;height:100%;overflow:auto;margin-top:0;animation:shift .3s}}@media screen and (max-width: 840px){.period__block{height:100%}}.period__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}@media screen and (max-width: 840px){.period__header{padding-bottom:24px;border-bottom:1px solid var(--gray-color-200)}}@media screen and (max-width: 480px){.period__header{padding-top:8px}}.period__back{display:none}@media screen and (max-width: 840px){.period__back{display:flex;align-items:center}}.period__back ::ng-deep svg{margin-right:16px}.period__back ::ng-deep svg path{stroke:var(--menu-arr-color)}.period__list{max-height:400px;overflow:auto}@media screen and (max-width: 840px){.period__list{max-height:none}}.period__list ::ng-deep dd-lib-radio{display:block;margin-bottom:16px}@media screen and (max-width: 840px){.period__list ::ng-deep dd-lib-radio:not(:last-child){padding-bottom:16px;border-bottom:1px solid var(--gray-color-200)}}.period__calendar{margin-top:8px;display:block;animation:filter-show .5s forwards}@media screen and (max-width: 840px){.period__calendar{position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;margin-top:0;animation:shift .3s}}\n"] }]
-        }], ctorParameters: () => [{ type: DateService }], propDecorators: { maxDate: [{
+        }], ctorParameters: () => [{ type: DateService }, { type: i0.ChangeDetectorRef }], propDecorators: { maxDate: [{
                 type: Input
             }], setPeriodDate: [{
                 type: Output
@@ -2776,14 +3072,17 @@ class LibSearchInputComponent extends LibCommonInputTextComponent {
     set searchData(data) {
         this.loaded$.next(false);
         this.data = data;
+        if (data?.length) {
+            this.itemSize = this.keyDesc && this.keyTitle ? 90 : this.keyDesc && !this.keyTitle ? 50 : 40;
+            this.updateDropdownPosition(this.el, data, this.itemSize, 400);
+        }
     }
     ;
-    constructor(destroy$, changeDetection, cdr) {
+    constructor(destroy$, el, changeDetection, cdr) {
         super(changeDetection);
         this.destroy$ = destroy$;
+        this.el = el;
         this.cdr = cdr;
-        this.keyTitle = 'title';
-        this.keyDesc = 'description';
         this.styleInput = 'standard';
         this.inputStyle = 'gray';
         this.debounceTime = 100;
@@ -2792,6 +3091,12 @@ class LibSearchInputComponent extends LibCommonInputTextComponent {
         this.keyupEvent = new EventEmitter();
         this.selectedItem = new EventEmitter();
         this.keyUp = new Subject();
+        this.itemSize = this.keyDesc && this.keyTitle ? 90 : this.keyDesc && !this.keyTitle ? 50 : 40;
+    }
+    onWindowScroll() {
+        if (this.data?.length) {
+            this.updateDropdownPosition(this.el, this.data, this.itemSize, 400);
+        }
     }
     ngOnInit() {
         if (this.commitOnInput) {
@@ -2809,6 +3114,12 @@ class LibSearchInputComponent extends LibCommonInputTextComponent {
             }, () => this.loaded$.next(false));
         }
     }
+    writeValue(value) {
+        this.value = value === null || value === undefined ? '' : '' + value;
+        if (!this.destroyed) {
+            this.changeDetection.detectChanges();
+        }
+    }
     forceChange() {
         if (!this.commitOnInput) {
             this.keyupEvent.emit(this.value);
@@ -2827,7 +3138,7 @@ class LibSearchInputComponent extends LibCommonInputTextComponent {
     onClickSearchItem(item) {
         this.loaded$.next(false);
         this.selectedItem.emit(item);
-        this.value = this.getTitle(item);
+        this.value = this.keyTitle ? this.getTitle(item) : this.getDesc(item);
     }
     getTitle(item) {
         return item[this.keyTitle];
@@ -2835,13 +3146,27 @@ class LibSearchInputComponent extends LibCommonInputTextComponent {
     getDesc(item) {
         return item[this.keyDesc];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSearchInputComponent, deps: [{ token: DestroyService }, { token: i0.ChangeDetectorRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibSearchInputComponent, isStandalone: true, selector: "dd-lib-search-input", inputs: { keyTitle: "keyTitle", keyDesc: "keyDesc", styleInput: "styleInput", inputStyle: "inputStyle", searchData: "searchData", debounceTime: "debounceTime", delay: "delay", idClose: "idClose", loaded$: "loaded$" }, outputs: { keyupEvent: "keyupEvent", selectedItem: "selectedItem" }, providers: [DestroyService], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-search-input\">\r\n  <label [for]=\"id\" class=\"lib-search-input__title\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n  <div class=\"pos-relative\">\r\n    <dd-lib-svg-icon (click)=\"forceChange()\" class=\"search-icon\" icon=\"search\"></dd-lib-svg-icon>\r\n    <input\r\n      #searchInput\r\n      (keyup)=\"keyUp.next($event)\"\r\n      (keyup.enter)=\"forceChange()\"\r\n      [(ngModel)]=\"value\"\r\n      [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\r\n      [attr.id]=\"id ? id : null\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [attr.minlength]=\"minlength\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [attr.type]=\"type || 'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.round]=\"styleInput === 'round'\"\r\n      [class.white]=\"inputStyle === 'white'\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      class=\"search-input\" />\r\n    <dd-lib-svg-icon\r\n      (click)=\"onClear()\"\r\n      [id]=\"idClose\" [style.display]=\"value?.length ? 'block' : 'none'\"\r\n      class=\"clear-icon\" icon=\"clear\"></dd-lib-svg-icon>\r\n    @if (loaded$ | async) {\r\n      <div class=\"loading-icon\">\r\n        <dd-lib-loader></dd-lib-loader>\r\n      </div>\r\n    }\r\n  </div>\r\n\r\n  @if (data?.length) {\r\n  <dd-lib-card [class.top]=\"side === 'top'\">\r\n    @for (item of data; track item) {\r\n    <div (click)=\"onClickSearchItem(item)\" class=\"search-result\">\r\n      @if (getTitle(item); as title) {\r\n      <div [innerHTML]=\"title | highlight: value | safe: 'html'\" class=\"search-result__title\"></div>\r\n      } @if (getDesc(item); as desc) {\r\n      <div [innerHTML]=\"desc | highlight: value | safe: 'html'\" class=\"search-result__desc\"></div>\r\n      }\r\n    </div>\r\n    }\r\n  </dd-lib-card>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}.lib-search-input{position:relative}.lib-search-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-search-input input{width:100%;height:48px;padding:16px 16px 15px 44px;border-radius:8px;border:none;color:var(--light-black-color);background-color:var(--input-gray-bgc)}.lib-search-input input.white{background-color:var(--white-color);border:1px solid var(--primary-gray-color)}.lib-search-input .round{border-radius:24px}.lib-search-input .search-icon{position:absolute;left:16px;top:14px;cursor:pointer}.lib-search-input .clear-icon{position:absolute;right:16px;top:14px;cursor:pointer}.lib-search-input .loading-icon{position:absolute;right:40px;top:12px}.lib-search-input .search-result{font-size:16px;font-weight:400;line-height:24px;letter-spacing:0;text-align:left;cursor:pointer}.lib-search-input .search-result:hover{opacity:.8}.lib-search-input .search-result:last-child .search-result__desc{border:none;padding-bottom:0}.lib-search-input .search-result__title{color:var(--second-gray-color);margin:24px 0 2px}.lib-search-input .search-result__desc{padding-bottom:16px;border-bottom:1px solid var(--gray-color-200)}.lib-search-input dd-lib-card{position:absolute;display:block;top:76px;z-index:100;width:100%;max-height:400px;box-shadow:var(--main-card-shadow);overflow:auto}.lib-search-input dd-lib-card.top{bottom:50px;top:unset}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LibCardComponent, selector: "dd-lib-card", inputs: ["type", "footerBtn", "sHeight", "skeleton", "parentLvlForSkeleton", "plugs", "borderRadius"], outputs: ["cardBtnEvent"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: SafePipe, name: "safe" }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSearchInputComponent, deps: [{ token: DestroyService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibSearchInputComponent, isStandalone: true, selector: "dd-lib-search-input", inputs: { keyTitle: "keyTitle", keyDesc: "keyDesc", styleInput: "styleInput", inputStyle: "inputStyle", searchData: "searchData", debounceTime: "debounceTime", delay: "delay", idClose: "idClose", loaded$: "loaded$" }, outputs: { keyupEvent: "keyupEvent", selectedItem: "selectedItem" }, host: { listeners: { "window:resize": "onWindowScroll()", "window:scroll": "onWindowScroll()" } }, providers: [
+            DestroyService,
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => LibSearchInputComponent),
+                multi: true,
+            },
+        ], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-search-input\">\r\n  <label [for]=\"id\" class=\"lib-search-input__title\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n  <div class=\"pos-relative\">\r\n    <dd-lib-svg-icon (click)=\"forceChange()\" class=\"search-icon\" icon=\"search\"></dd-lib-svg-icon>\r\n    <input\r\n      #searchInput\r\n      (keyup)=\"keyUp.next($event)\"\r\n      (keyup.enter)=\"forceChange()\"\r\n      [(ngModel)]=\"value\"\r\n      [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\r\n      [attr.id]=\"id ? id : null\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [attr.minlength]=\"minlength\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [attr.type]=\"type || 'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.round]=\"styleInput === 'round'\"\r\n      [class.white]=\"inputStyle === 'white'\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      class=\"search-input\" />\r\n    <dd-lib-svg-icon\r\n      (click)=\"onClear()\"\r\n      [id]=\"idClose\" [style.display]=\"value?.length ? 'block' : 'none'\"\r\n      class=\"clear-icon\" icon=\"clear\"></dd-lib-svg-icon>\r\n    @if (loaded$ | async) {\r\n      <div class=\"loading-icon\">\r\n        <dd-lib-loader></dd-lib-loader>\r\n      </div>\r\n    }\r\n  </div>\r\n\r\n  @if (data?.length) {\r\n    <div class=\"search-dropdown\" [class.top]=\"side === 'top'\" [ngStyle]=\"dropdownStyle\">\r\n    @for (item of data; track item) {\r\n    <div (click)=\"onClickSearchItem(item)\" class=\"search-result\">\r\n      @if (getTitle(item); as title) {\r\n        <div [innerHTML]=\"title | highlight: value | safe: 'html'\" class=\"search-result__title\"></div>\r\n      }\r\n      @if (getDesc(item); as desc) {\r\n        <div [innerHTML]=\"desc | highlight: value | safe: 'html'\" class=\"search-result__desc\"></div>\r\n      }\r\n    </div>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}.lib-search-input{position:relative}.lib-search-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-search-input input{width:100%;height:48px;padding:16px 16px 15px 44px;border-radius:8px;border:none;color:var(--light-black-color);background-color:var(--input-gray-bgc)}.lib-search-input input.white{background-color:var(--white-color);border:1px solid var(--primary-gray-color)}.lib-search-input .round{border-radius:24px}.lib-search-input .search-icon{position:absolute;left:16px;top:14px;cursor:pointer}.lib-search-input .clear-icon{position:absolute;right:16px;top:14px;cursor:pointer}.lib-search-input .loading-icon{position:absolute;right:40px;top:12px}.lib-search-input .search-result{font-size:16px;font-weight:400;line-height:24px;letter-spacing:0;text-align:left;cursor:pointer}.lib-search-input .search-result:hover{opacity:.8}.lib-search-input .search-result:last-child .search-result__desc{border:none;padding-bottom:0}.lib-search-input .search-result__title{color:var(--second-gray-color);min-height:40px;align-items:center;align-content:center}.lib-search-input .search-result__desc{min-height:50px;align-items:center;align-content:center;border-bottom:1px solid var(--gray-color-200)}.lib-search-input dd-lib-card{position:absolute;display:block;top:76px;z-index:100;width:100%;max-height:400px;box-shadow:var(--main-card-shadow);overflow:auto}.lib-search-input dd-lib-card.top{bottom:50px;top:unset}.lib-search-input .search-dropdown{position:absolute;display:block;top:76px;z-index:100;width:100%;max-height:400px;overflow:auto;border-radius:24px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color);min-height:100%;padding:0 24px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: SafePipe, name: "safe" }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSearchInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dd-lib-search-input', standalone: true, imports: [FormsModule, NgOptimizedImage, LibCardComponent, HighlightPipe, SafePipe, LibSvgIconComponent, LibLoaderComponent, AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, providers: [DestroyService], template: "<div class=\"lib-search-input\">\r\n  <label [for]=\"id\" class=\"lib-search-input__title\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n  <div class=\"pos-relative\">\r\n    <dd-lib-svg-icon (click)=\"forceChange()\" class=\"search-icon\" icon=\"search\"></dd-lib-svg-icon>\r\n    <input\r\n      #searchInput\r\n      (keyup)=\"keyUp.next($event)\"\r\n      (keyup.enter)=\"forceChange()\"\r\n      [(ngModel)]=\"value\"\r\n      [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\r\n      [attr.id]=\"id ? id : null\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [attr.minlength]=\"minlength\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [attr.type]=\"type || 'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.round]=\"styleInput === 'round'\"\r\n      [class.white]=\"inputStyle === 'white'\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      class=\"search-input\" />\r\n    <dd-lib-svg-icon\r\n      (click)=\"onClear()\"\r\n      [id]=\"idClose\" [style.display]=\"value?.length ? 'block' : 'none'\"\r\n      class=\"clear-icon\" icon=\"clear\"></dd-lib-svg-icon>\r\n    @if (loaded$ | async) {\r\n      <div class=\"loading-icon\">\r\n        <dd-lib-loader></dd-lib-loader>\r\n      </div>\r\n    }\r\n  </div>\r\n\r\n  @if (data?.length) {\r\n  <dd-lib-card [class.top]=\"side === 'top'\">\r\n    @for (item of data; track item) {\r\n    <div (click)=\"onClickSearchItem(item)\" class=\"search-result\">\r\n      @if (getTitle(item); as title) {\r\n      <div [innerHTML]=\"title | highlight: value | safe: 'html'\" class=\"search-result__title\"></div>\r\n      } @if (getDesc(item); as desc) {\r\n      <div [innerHTML]=\"desc | highlight: value | safe: 'html'\" class=\"search-result__desc\"></div>\r\n      }\r\n    </div>\r\n    }\r\n  </dd-lib-card>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}.lib-search-input{position:relative}.lib-search-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-search-input input{width:100%;height:48px;padding:16px 16px 15px 44px;border-radius:8px;border:none;color:var(--light-black-color);background-color:var(--input-gray-bgc)}.lib-search-input input.white{background-color:var(--white-color);border:1px solid var(--primary-gray-color)}.lib-search-input .round{border-radius:24px}.lib-search-input .search-icon{position:absolute;left:16px;top:14px;cursor:pointer}.lib-search-input .clear-icon{position:absolute;right:16px;top:14px;cursor:pointer}.lib-search-input .loading-icon{position:absolute;right:40px;top:12px}.lib-search-input .search-result{font-size:16px;font-weight:400;line-height:24px;letter-spacing:0;text-align:left;cursor:pointer}.lib-search-input .search-result:hover{opacity:.8}.lib-search-input .search-result:last-child .search-result__desc{border:none;padding-bottom:0}.lib-search-input .search-result__title{color:var(--second-gray-color);margin:24px 0 2px}.lib-search-input .search-result__desc{padding-bottom:16px;border-bottom:1px solid var(--gray-color-200)}.lib-search-input dd-lib-card{position:absolute;display:block;top:76px;z-index:100;width:100%;max-height:400px;box-shadow:var(--main-card-shadow);overflow:auto}.lib-search-input dd-lib-card.top{bottom:50px;top:unset}\n"] }]
-        }], ctorParameters: () => [{ type: DestroyService }, { type: i0.ChangeDetectorRef }, { type: i0.ChangeDetectorRef }], propDecorators: { keyTitle: [{
+            args: [{ selector: 'dd-lib-search-input', standalone: true, imports: [FormsModule, NgStyle, NgOptimizedImage, LibCardComponent, HighlightPipe, SafePipe, LibSvgIconComponent, LibLoaderComponent, AsyncPipe, DropDownPositionDirective, JsonPipe], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        DestroyService,
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => LibSearchInputComponent),
+                            multi: true,
+                        },
+                    ], template: "<div class=\"lib-search-input\">\r\n  <label [for]=\"id\" class=\"lib-search-input__title\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n  <div class=\"pos-relative\">\r\n    <dd-lib-svg-icon (click)=\"forceChange()\" class=\"search-icon\" icon=\"search\"></dd-lib-svg-icon>\r\n    <input\r\n      #searchInput\r\n      (keyup)=\"keyUp.next($event)\"\r\n      (keyup.enter)=\"forceChange()\"\r\n      [(ngModel)]=\"value\"\r\n      [attr.autocomplete]=\"autocomplete === undefined ? null : autocomplete\"\r\n      [attr.id]=\"id ? id : null\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [attr.minlength]=\"minlength\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [attr.type]=\"type || 'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.round]=\"styleInput === 'round'\"\r\n      [class.white]=\"inputStyle === 'white'\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      class=\"search-input\" />\r\n    <dd-lib-svg-icon\r\n      (click)=\"onClear()\"\r\n      [id]=\"idClose\" [style.display]=\"value?.length ? 'block' : 'none'\"\r\n      class=\"clear-icon\" icon=\"clear\"></dd-lib-svg-icon>\r\n    @if (loaded$ | async) {\r\n      <div class=\"loading-icon\">\r\n        <dd-lib-loader></dd-lib-loader>\r\n      </div>\r\n    }\r\n  </div>\r\n\r\n  @if (data?.length) {\r\n    <div class=\"search-dropdown\" [class.top]=\"side === 'top'\" [ngStyle]=\"dropdownStyle\">\r\n    @for (item of data; track item) {\r\n    <div (click)=\"onClickSearchItem(item)\" class=\"search-result\">\r\n      @if (getTitle(item); as title) {\r\n        <div [innerHTML]=\"title | highlight: value | safe: 'html'\" class=\"search-result__title\"></div>\r\n      }\r\n      @if (getDesc(item); as desc) {\r\n        <div [innerHTML]=\"desc | highlight: value | safe: 'html'\" class=\"search-result__desc\"></div>\r\n      }\r\n    </div>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}.lib-search-input{position:relative}.lib-search-input__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-search-input input{width:100%;height:48px;padding:16px 16px 15px 44px;border-radius:8px;border:none;color:var(--light-black-color);background-color:var(--input-gray-bgc)}.lib-search-input input.white{background-color:var(--white-color);border:1px solid var(--primary-gray-color)}.lib-search-input .round{border-radius:24px}.lib-search-input .search-icon{position:absolute;left:16px;top:14px;cursor:pointer}.lib-search-input .clear-icon{position:absolute;right:16px;top:14px;cursor:pointer}.lib-search-input .loading-icon{position:absolute;right:40px;top:12px}.lib-search-input .search-result{font-size:16px;font-weight:400;line-height:24px;letter-spacing:0;text-align:left;cursor:pointer}.lib-search-input .search-result:hover{opacity:.8}.lib-search-input .search-result:last-child .search-result__desc{border:none;padding-bottom:0}.lib-search-input .search-result__title{color:var(--second-gray-color);min-height:40px;align-items:center;align-content:center}.lib-search-input .search-result__desc{min-height:50px;align-items:center;align-content:center;border-bottom:1px solid var(--gray-color-200)}.lib-search-input dd-lib-card{position:absolute;display:block;top:76px;z-index:100;width:100%;max-height:400px;box-shadow:var(--main-card-shadow);overflow:auto}.lib-search-input dd-lib-card.top{bottom:50px;top:unset}.lib-search-input .search-dropdown{position:absolute;display:block;top:76px;z-index:100;width:100%;max-height:400px;overflow:auto;border-radius:24px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color);min-height:100%;padding:0 24px}\n"] }]
+        }], ctorParameters: () => [{ type: DestroyService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.ChangeDetectorRef }], propDecorators: { keyTitle: [{
                 type: Input
             }], keyDesc: [{
                 type: Input
@@ -2863,6 +3188,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 type: Output
             }], selectedItem: [{
                 type: Output
+            }], onWindowScroll: [{
+                type: HostListener,
+                args: ['window:resize']
+            }, {
+                type: HostListener,
+                args: ['window:scroll']
             }] } });
 
 class LibSelectComponent extends LibCommonInputTextComponent {
@@ -2870,11 +3201,17 @@ class LibSelectComponent extends LibCommonInputTextComponent {
     set data(d) {
         this._data.set(d);
         this.stringArray.set(typeof d?.[0] === 'string');
+        if (!d?.length) {
+            this.isShownList = false;
+            this.changeDetection.detectChanges();
+            this.control?.updateValueAndValidity();
+        }
     }
     ;
-    constructor(destroyed$, changeDetection, controlContainer) {
+    constructor(destroyed$, changeDetection, el, controlContainer) {
         super(changeDetection);
         this.destroyed$ = destroyed$;
+        this.el = el;
         this.controlContainer = controlContainer;
         this.tooltipPosition = 'top';
         this.highlight = true;
@@ -2884,11 +3221,18 @@ class LibSelectComponent extends LibCommonInputTextComponent {
         this.keyValue = '';
         this.placeholder = 'Выберите из списка';
         this.selectedItem = new EventEmitter();
+        this.selectedItems = new EventEmitter();
         // TODO: надо сделать типизацию и конструктор принмайющий объект форматирующий во внутренний и отдающий обратно что нужно
         this._data = signal([]);
         this.checkedItems = [];
+        this.initWriteValue = true;
         this.stringArray = signal(false);
     }
+    onWindowScroll() {
+        if (this.isShownList) {
+            this.updateDropdownPosition(this.el, this._data(), this.itemSize, 300);
+        }
+    }
     ngOnInit() {
         this.showMultiCountValue = this.multi;
         if (!this.selectId) {
@@ -2902,6 +3246,14 @@ class LibSelectComponent extends LibCommonInputTextComponent {
             this.changeValueSub(this.control);
         }
     }
+    ngOnChanges(changes) {
+        if (!changes['data'].previousValue && changes['data'].currentValue && this.writtenValue) {
+            console.log(changes['data'].previousValue);
+            console.log(changes['data'].currentValue);
+            console.log(this.writtenValue);
+            this.writeValue(this.writtenValue);
+        }
+    }
     onClear(checkedItem) {
         this.cleared.emit();
         this.selectItem(checkedItem, true);
@@ -2910,6 +3262,7 @@ class LibSelectComponent extends LibCommonInputTextComponent {
         control.valueChanges
             .pipe(takeUntil(this.destroyed$))
             .subscribe(val => {
+            this.initWriteValue = true;
             this.writeValue(val);
             this.errorText = ValidatorsService.getErrorText(this.control?.errors);
             this.changeDetection.detectChanges();
@@ -2923,14 +3276,32 @@ class LibSelectComponent extends LibCommonInputTextComponent {
         this.onTouchedCallback = fn;
         super.registerOnTouched(fn);
     }
+    searchInput($event) {
+        this.isShownList = true;
+        // this.searchValue = this.inputValue;
+        // меняем позицию дропдауна тк список будет меняться
+        if (this.isShownList && this.searchValue) {
+            const filteredData = new FilterByKeyPipe().transform(this._data.bind(this)(), this.filterList.bind(this));
+            this.updateDropdownPosition(this.el, filteredData, this.itemSize, 300);
+        }
+        else if (this.isShownList && !this.searchValue) {
+            this.updateDropdownPosition(this.el, this._data(), this.itemSize, 300);
+        }
+    }
     handleInput(e) {
         this.isShownList = true;
-        this.searchValue = this.inputValue;
+        // this.searchValue = this.inputValue;
         super.handleInput(e);
     }
     notifyFocusEvent(e) {
         if (!this.disabled) {
             this.isShownList = !this.isShownList;
+            if (this.isShownList) {
+                setTimeout(() => {
+                    this.searchInputEl?.nativeElement.focus();
+                });
+                this.updateDropdownPosition(this.el, this._data(), this.itemSize, 300);
+            }
             if (this.fetchMode) {
                 this.fetchEvent.emit();
             }
@@ -2938,41 +3309,63 @@ class LibSelectComponent extends LibCommonInputTextComponent {
         super.notifyFocusEvent(e);
     }
     writeValue(value) {
-        if (this.multi && value?.length) {
-            this.multiCountValue = `Выбрано (${value.length})`;
-            if (this.keyValue) {
-                this.checkedItems = this._data().filter((f) => value.includes(f[this.keyValue]));
-            }
-            else {
-                if (this.stringArray()) {
-                    this.checkedItems = this._data().filter((f) => value.includes(f));
+        this.writtenValue = value;
+        if (this.multi) {
+            if (value?.length && this._data()?.length) {
+                this.multiCountValue = `Выбрано (${value.length})`;
+                if (this.keyValue) {
+                    this.checkedItems = this._data()?.filter((f) => value.includes(f[this.keyValue])) || [];
                 }
                 else {
-                    const strArr = value.map(JSON.stringify);
-                    this.checkedItems = this._data().filter((f) => strArr.includes(JSON.stringify(f)));
+                    if (this.stringArray()) {
+                        this.checkedItems = this._data()?.filter((f) => value.includes(f)) || [];
+                    }
+                    else {
+                        const strArr = value.map(JSON.stringify);
+                        this.checkedItems = this._data()?.filter((f) => strArr.includes(JSON.stringify(f))) || [];
+                    }
                 }
             }
+            else {
+                this.checkedItems = [];
+                this.multiCountValue = '';
+            }
+            if (!this.initWriteValue) {
+                this.selectedItems.emit(this.checkedItems);
+            }
         }
         else {
-            if (this.stringArray()) {
-                this.value = value;
-                this.inputValue = value;
-            }
-            else {
-                if (!!this.keyValue) {
-                    const fVal = this._data()?.find((f) => f?.[this.keyValue] === value);
-                    this.value = fVal?.[this.keyValue];
-                    this.inputValue = this.keyTitle ? fVal?.[this.keyTitle] : fVal;
-                    this.checkedItem = fVal;
+            if (value) {
+                if (this.stringArray()) {
+                    this.value = value;
+                    this.inputValue = value;
                 }
                 else {
-                    const fVal = this._data()?.find((f) => JSON.stringify(f) === JSON.stringify(value));
-                    this.value = fVal;
-                    this.inputValue = this.keyTitle ? fVal?.[this.keyTitle] : fVal;
-                    this.checkedItem = fVal;
+                    if (!!this.keyValue) {
+                        const fVal = this._data()?.find((f) => f?.[this.keyValue] === value);
+                        this.value = fVal?.[this.keyValue];
+                        this.inputValue = this.keyTitle ? fVal?.[this.keyTitle] : fVal;
+                        this.checkedItem = fVal;
+                    }
+                    else {
+                        const fVal = this._data()?.find((f) => JSON.stringify(f) === JSON.stringify(value));
+                        this.value = fVal;
+                        this.inputValue = this.keyTitle ? fVal?.[this.keyTitle] : fVal;
+                        this.checkedItem = fVal;
+                    }
                 }
             }
+            else {
+                this.value = undefined;
+                this.inputValue = '';
+                this.checkedItem = undefined;
+            }
+            if (!this.initWriteValue) {
+                this.selectedItem.emit(this.checkedItem);
+            }
         }
+        this.initWriteValue = false;
+        this.changeDetection.detectChanges();
     }
     selectItem(item, cleared) {
         if (this.disabled || item.disabled) {
@@ -2980,11 +3373,13 @@ class LibSelectComponent extends LibCommonInputTextComponent {
         }
         if (this.multi) {
             this.selectMultiItem(item);
+            this.selectedItems.emit(cleared ? undefined : item);
         }
         else {
             this.selectSingleItem(item);
+            this.selectedItem.emit(cleared ? undefined : item);
         }
-        this.selectedItem.emit(cleared ? undefined : item);
+        this.changeDetection.detectChanges();
     }
     filterList(item) {
         if (this.stringArray()) {
@@ -3084,17 +3479,17 @@ class LibSelectComponent extends LibCommonInputTextComponent {
     }
     handleFocus() {
         super.handleFocus();
-        this.showMultiCountValue = false;
+        // this.showMultiCountValue = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSelectComponent, deps: [{ token: DestroyService }, { token: i0.ChangeDetectorRef }, { token: i1$5.ControlContainer, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibSelectComponent, isStandalone: true, selector: "dd-lib-select", inputs: { data: "data", multi: "multi", tooltipPosition: "tooltipPosition", highlight: "highlight", selectId: "selectId", itemSize: "itemSize", keyTitle: "keyTitle", keyDesc: "keyDesc", keyValue: "keyValue", placeholder: "placeholder" }, outputs: { selectedItem: "selectedItem" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSelectComponent, deps: [{ token: DestroyService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$5.ControlContainer, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibSelectComponent, isStandalone: true, selector: "dd-lib-select", inputs: { data: "data", virtualScroll: "virtualScroll", multi: "multi", tooltipPosition: "tooltipPosition", highlight: "highlight", selectId: "selectId", itemSize: "itemSize", keyTitle: "keyTitle", keyDesc: "keyDesc", keyValue: "keyValue", placeholder: "placeholder" }, outputs: { selectedItem: "selectedItem", selectedItems: "selectedItems" }, host: { listeners: { "window:resize": "onWindowScroll()", "window:scroll": "onWindowScroll()" } }, providers: [
             DestroyService,
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => LibSelectComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-select\" id=\"lib-select-{{ selectId }}\">\r\n  <label [for]=\"id\" class=\"lib-select__title\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n\r\n  <div class=\"pos-relative\">\r\n    <input\r\n      #select\r\n      (change)=\"handleChange()\"\r\n      (click)=\"notifyFocusEvent($event)\"\r\n      (input)=\"handleInput($event)\"\r\n      (blur)=\"handleBlur()\"\r\n      (focus)=\"handleFocus()\"\r\n      [(ngModel)]=\"inputValue\"\r\n      [attr.id]=\"selectId\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"multiCountValue ? '' : placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [attr.type]=\"'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.invalid]=\"showError\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      [title]=\"inputValue || ''\"\r\n      class=\"text-select\" />\r\n    @if (multiCountValue && showMultiCountValue) {\r\n      <span class=\"multi-count text-plain small\">{{multiCountValue}}</span>\r\n    }\r\n    <!--    (blur)=\"notifyFocusEvent($event)\"-->\r\n    @if (!checkedItem) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"notifyFocusEvent($event)\"\r\n        [class.black-svg]=\"isShownList\"\r\n        [class.disabled]=\"disabled\"\r\n        [class.gray-svg]=\"!isShownList\"\r\n        [class.up]=\"isShownList\"\r\n        id=\"chevron-{{ selectId }}\" class=\"chevron\" icon=\"down_chevron\"></dd-lib-svg-icon>\r\n\r\n    } @else if (clearable) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"onClear(checkedItem)\"\r\n        class=\"clear\"\r\n        id=\"chevron-{{ selectId }}\" icon=\"clear\"></dd-lib-svg-icon>\r\n    }\r\n  </div>\r\n\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-select__error\">{{ error }}</div>\r\n    }\r\n  }\r\n  @if (errorText && showSelfError && showError) {\r\n    <div class=\"lib-select__error\">{{ errorText }}</div>\r\n  }\r\n  @if (isShownList) {\r\n  <div\r\n    (ddClickOutside)=\"notifyFocusEvent($event);fullBlur.emit($event)\"\r\n    [elements]=\"['lib-select-' + selectId, 'chevron' + selectId]\"\r\n    [class.top]=\"side === 'top'\"\r\n    class=\"select-list-wrapper\">\r\n    @if (_data()?.length) {\r\n      <cdk-virtual-scroll-viewport [itemSize]=\"itemSize\" [style.height]=\"_data().length * itemSize + 'px'\">\r\n        <div *cdkVirtualFor=\"let item of _data() | filterByKey: filterList.bind(this)\">\r\n          <div [ddTooltip]=\"item.tooltip ? item.tooltip : ''\" [position]=\"tooltipPosition\"\r\n            (click)=\"selectItem(item)\"\r\n            [class.s-item-active]=\"checkSelected(item) && !item.disabled\"\r\n            [class.s-item-disabled]=\"item.disabled\"\r\n            class=\"select-data\">\r\n            @if (stringArray()) {\r\n              <div [innerHTML]=\"item | highlight: (highlight ? inputValue : '') | safe: 'html'\" class=\"select-data__title\"></div>\r\n            }\r\n            @if (keyTitle && !stringArray()) {\r\n              <div\r\n                [innerHTML]=\"item[keyTitle!] | highlight: (highlight ? inputValue : '') | safe: 'html'\"\r\n                class=\"select-data__title\"></div>\r\n            }\r\n            @if (keyDesc && !stringArray()) {\r\n              <div\r\n                [innerHTML]=\"item[keyDesc!] | highlight: (highlight ? inputValue : '') | safe: 'html'\"\r\n                [title]=\"item[keyDesc]\"\r\n                class=\"select-data__desc\"></div>\r\n            } @if (checkSelected(item)) {\r\n            <dd-lib-svg-icon\r\n              (click)=\"selectItem(checkedItem)\"\r\n              class=\"checked\"\r\n              id=\"chevron-{{ selectId }}\" icon=\"check_green\"></dd-lib-svg-icon>\r\n          }\r\n          </div>\r\n        </div>\r\n      </cdk-virtual-scroll-viewport>\r\n    } @else {\r\n    <div class=\"select-loader\">\r\n      <dd-lib-loader></dd-lib-loader>\r\n    </div>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".lib-select{position:relative}.lib-select input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-select input:hover{border-color:var(--input-active-border-colort)}.lib-select input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-select input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-select input:disabled::placeholder{color:var(--input-placeholder)}.lib-select input.invalid,.lib-select input.invalid:hover{border-color:var(--input-error-border-color)}.lib-select input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-select .multi-count{position:absolute;top:12px;left:16px}.lib-select .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-select .chevron{cursor:pointer;position:absolute;right:16px;top:10px}.lib-select .chevron.up{transform:rotate(180deg)}.lib-select__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-select__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-select .select-list-wrapper{position:absolute;display:block;z-index:100;width:100%;max-height:300px;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}.lib-select .select-list-wrapper cdk-virtual-scroll-viewport{max-height:300px}.lib-select .select-list-wrapper.top{bottom:50px;top:unset}.lib-select .select-list-wrapper .select-data{padding:12px 42px 12px 16px;cursor:pointer;position:relative;min-height:40px}.lib-select .select-list-wrapper .select-data__desc{font-size:14px;font-weight:400;line-height:24px;text-overflow:ellipsis;text-wrap:nowrap;padding-top:2px;overflow:hidden;color:var(--second-gray-color)}.lib-select .select-list-wrapper .select-data:hover,.lib-select .select-list-wrapper .select-data.s-item-active{background:var(--select-act-hov-bgc)}.lib-select .select-list-wrapper .select-data.s-item-active .checked{position:absolute;right:16px;top:10px}.lib-select .select-list-wrapper .select-data.s-item-disabled{cursor:auto;background:var(--disabled-bgc);color:var(--disabled-color)}.lib-select .select-list-wrapper .select-loader{padding:24px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: SafePipe, name: "safe" }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }, { kind: "pipe", type: FilterByKeyPipe, name: "filterByKey" }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: TooltipDirective, selector: "[ddTooltip]", inputs: ["ddTooltip", "withClick", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "selectEl", first: true, predicate: ["select"], descendants: true, read: ElementRef, static: true }, { propertyName: "searchInputEl", first: true, predicate: ["searchInputEl"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"lib-select\" id=\"lib-select-{{ selectId }}\" ddFixedPosition>\r\n  @if (label) {\r\n    <label [for]=\"id\" class=\"lib-select__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n\r\n  <div class=\"pos-relative\" data-child=\"input\">\r\n    <div class=\"search-block\"\r\n         [style.right]=\"multiCountValue ? '125px' : multi ? '40px' : '30px'\"\r\n         [style.display]=\"(isShownList) ? 'flex' : 'none'\">\r\n      <input class=\"search-block__input\"  #searchInputEl [attr.name]=\"name\"\r\n             [readOnly]=\"readOnly\"\r\n             (input)=\"searchInput($event)\"\r\n             (blur)=\"handleBlur()\"\r\n             (focus)=\"handleFocus()\"\r\n             [(ngModel)]=\"searchValue\" type=\"text\" >\r\n        <dd-lib-svg-icon\r\n          [style.display]=\"searchValue ? 'block' : 'none'\"\r\n          class=\"cup\"\r\n          (click)=\"searchValue=''\"\r\n          id=\"chevron-{{ selectId }}\" icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    </div>\r\n    @if (!this._data()?.length || !this._data()) {\r\n      <div class=\"data-loader\">\r\n        <dd-lib-loader></dd-lib-loader>\r\n      </div>\r\n    }\r\n    <input\r\n      #select\r\n      (change)=\"handleChange()\"\r\n      (click)=\"notifyFocusEvent($event)\"\r\n      (input)=\"handleInput($event)\"\r\n      (blur)=\"handleBlur()\"\r\n      (focus)=\"handleFocus()\"\r\n      [attr.id]=\"selectId\"\r\n      [attr.placeholder]=\"(multiCountValue || searchValue) ? '' : placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [style.color]=\"(searchValue && isShownList) ? 'transparent' : 'inherit'\"\r\n      [attr.type]=\"'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.invalid]=\"showError\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"true\"\r\n      [(ngModel)]=\"inputValue\"\r\n      [title]=\"inputValue || ''\"\r\n      class=\"text-select select-block\" />\r\n    @if (multiCountValue) {\r\n      <span class=\"multi-count text-plain small\">{{multiCountValue}}</span>\r\n    }\r\n    <!--    (blur)=\"notifyFocusEvent($event)\"-->\r\n    @if (!checkedItem) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"notifyFocusEvent($event)\"\r\n        [class.black-svg]=\"isShownList\"\r\n        [class.disabled]=\"disabled\"\r\n        [class.gray-svg]=\"!isShownList\"\r\n        [class.up]=\"isShownList\"\r\n        id=\"chevron-{{ selectId }}\" class=\"chevron\" icon=\"down_chevron\"></dd-lib-svg-icon>\r\n\r\n    } @else if (clearable && !searchValue) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"onClear(checkedItem)\"\r\n        class=\"clear\"\r\n        id=\"chevron-{{ selectId }}\" icon=\"clear\"></dd-lib-svg-icon>\r\n    }\r\n  </div>\r\n\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-select__error\">{{ error }}</div>\r\n    }\r\n  }\r\n  @if (errorText && showSelfError && showError) {\r\n    <div class=\"lib-select__error\">{{ errorText }}</div>\r\n  }\r\n  @if (isShownList) {\r\n  <div\r\n    id=\"dropdown\"\r\n    data-child=\"list\"\r\n    [ngStyle]=\"dropdownStyle\"\r\n    (ddClickOutside)=\"notifyFocusEvent($event);fullBlur.emit($event)\"\r\n    [elements]=\"['lib-select-' + selectId, 'chevron' + selectId]\"\r\n    ddListKeyboardNavigation\r\n    class=\"select-list-wrapper\">\r\n    @if (_data()?.length) {\r\n      @if (virtualScroll) {\r\n        <cdk-virtual-scroll-viewport [itemSize]=\"itemSize\" [style.height]=\"(_data()?.length || 0) * itemSize + 'px'\">\r\n          <div *cdkVirtualFor=\"let item of _data() | filterByKey: filterList.bind(this)\">\r\n            <ng-container [ngTemplateOutlet]=\"rowItem\" [ngTemplateOutletContext]=\"{item}\"></ng-container>\r\n          </div>\r\n        </cdk-virtual-scroll-viewport>\r\n      } @else {\r\n        @for (item of _data() | filterByKey: filterList.bind(this); track item) {\r\n          <ng-container [ngTemplateOutlet]=\"rowItem\" [ngTemplateOutletContext]=\"{item}\"></ng-container>\r\n        }\r\n      }\r\n    } @else {\r\n    <div class=\"select-loader\">\r\n      <dd-lib-loader></dd-lib-loader>\r\n    </div>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n\r\n<ng-template #rowItem let-item=item>\r\n  <div ddSelectableItem [ddTooltip]=\"item.tooltip ? item.tooltip : ''\" [position]=\"tooltipPosition\"\r\n       (click)=\"selectItem(item)\"\r\n       (itemSelected)=\"selectItem(item)\"\r\n       [class.s-item-active]=\"checkSelected(item) && !item.disabled\"\r\n       [class.s-item-disabled]=\"item.disabled\"\r\n       class=\"select-data\">\r\n    @if (stringArray()) {\r\n      <div [innerHTML]=\"item | highlight: (highlight ? searchValue : '') | safe: 'html'\"\r\n           class=\"select-data__title\"></div>\r\n    }\r\n    @if (keyTitle && !stringArray()) {\r\n      <div\r\n        [innerHTML]=\"item[keyTitle!] | highlight: (highlight ? searchValue : '') | safe: 'html'\"\r\n        class=\"select-data__title\"></div>\r\n    }\r\n    @if (keyDesc && !stringArray()) {\r\n      <div\r\n        [innerHTML]=\"item[keyDesc!] | highlight: (highlight ? searchValue : '') | safe: 'html'\"\r\n        [title]=\"item[keyDesc]\"\r\n        class=\"select-data__desc\"></div>\r\n    }\r\n    @if (checkSelected(item)) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"selectItem(checkedItem)\"\r\n        class=\"checked\"\r\n        id=\"chevron-{{ selectId }}\" icon=\"check_green\"></dd-lib-svg-icon>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: [".lib-select{position:relative}.lib-select .select-block{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-select .select-block:hover{border-color:var(--input-active-border-colort)}.lib-select .select-block:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-select .select-block:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-select .select-block:disabled::placeholder{color:var(--input-placeholder)}.lib-select .select-block.invalid,.lib-select .select-block.invalid:hover{border-color:var(--input-error-border-color)}.lib-select .select-block.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-select .multi-count{position:absolute;top:10px;right:42px;white-space:nowrap}.lib-select .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-select .chevron{cursor:pointer;position:absolute;right:16px;top:10px}.lib-select .chevron.up{transform:rotate(180deg)}.lib-select__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start;color:var(--light-black-color)}.lib-select__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-select .select-list-wrapper{position:absolute;display:block;z-index:100;width:100%;max-height:300px;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}.lib-select .select-list-wrapper cdk-virtual-scroll-viewport{max-height:300px}.lib-select .select-list-wrapper.top{bottom:50px;top:unset}.lib-select .select-list-wrapper .select-data{padding:12px 42px 12px 16px;cursor:pointer;position:relative;min-height:40px}.lib-select .select-list-wrapper .select-data__desc{font-size:14px;font-weight:400;line-height:24px;text-overflow:ellipsis;text-wrap:nowrap;padding-top:2px;overflow:hidden;color:var(--second-gray-color)}.lib-select .select-list-wrapper .select-data.key-down-active,.lib-select .select-list-wrapper .select-data:hover,.lib-select .select-list-wrapper .select-data.s-item-active{background:var(--select-act-hov-bgc)}.lib-select .select-list-wrapper .select-data.s-item-active .checked{position:absolute;right:16px;top:10px}.lib-select .select-list-wrapper .select-data.s-item-disabled{cursor:auto;background:var(--disabled-bgc);color:var(--disabled-color)}.lib-select .select-list-wrapper .select-loader{padding:24px}.search-block{position:absolute;height:12px;top:17px;z-index:1;left:16px;display:flex;gap:4px;align-items:center}.search-block__input{border:none;background:transparent;width:100%}.data-loader{position:absolute;right:0;left:0;bottom:12px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: SafePipe, name: "safe" }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibLoaderComponent, selector: "dd-lib-loader", inputs: ["color", "size"] }, { kind: "pipe", type: FilterByKeyPipe, name: "filterByKey" }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: TooltipDirective, selector: "[ddTooltip]", inputs: ["ddTooltip", "withClick", "position"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ListKeyboardNavigationDirective, selector: "[ddListKeyboardNavigation]" }, { kind: "directive", type: SelectableItemDirective, selector: "[ddSelectableItem]", outputs: ["itemSelected"] }, { kind: "directive", type: FixedPositionDirective, selector: "[ddFixedPosition]", inputs: ["childName1", "childName2"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSelectComponent, decorators: [{
             type: Component,
@@ -3111,7 +3506,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                         LibSvgIconComponent,
                         ScrollingModule,
                         JsonPipe,
-                        TooltipDirective
+                        TooltipDirective,
+                        NgStyle,
+                        DropDownPositionDirective,
+                        NgTemplateOutlet,
+                        ListKeyboardNavigationDirective,
+                        SelectableItemDirective,
+                        FixedPositionDirective
                     ], providers: [
                         DestroyService,
                         {
@@ -3119,14 +3520,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             useExisting: forwardRef(() => LibSelectComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-select\" id=\"lib-select-{{ selectId }}\">\r\n  <label [for]=\"id\" class=\"lib-select__title\">\r\n    {{ label }}\r\n    @if (required) {\r\n      <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n    }\r\n  </label>\r\n\r\n  <div class=\"pos-relative\">\r\n    <input\r\n      #select\r\n      (change)=\"handleChange()\"\r\n      (click)=\"notifyFocusEvent($event)\"\r\n      (input)=\"handleInput($event)\"\r\n      (blur)=\"handleBlur()\"\r\n      (focus)=\"handleFocus()\"\r\n      [(ngModel)]=\"inputValue\"\r\n      [attr.id]=\"selectId\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"multiCountValue ? '' : placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [attr.type]=\"'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.invalid]=\"showError\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      [title]=\"inputValue || ''\"\r\n      class=\"text-select\" />\r\n    @if (multiCountValue && showMultiCountValue) {\r\n      <span class=\"multi-count text-plain small\">{{multiCountValue}}</span>\r\n    }\r\n    <!--    (blur)=\"notifyFocusEvent($event)\"-->\r\n    @if (!checkedItem) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"notifyFocusEvent($event)\"\r\n        [class.black-svg]=\"isShownList\"\r\n        [class.disabled]=\"disabled\"\r\n        [class.gray-svg]=\"!isShownList\"\r\n        [class.up]=\"isShownList\"\r\n        id=\"chevron-{{ selectId }}\" class=\"chevron\" icon=\"down_chevron\"></dd-lib-svg-icon>\r\n\r\n    } @else if (clearable) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"onClear(checkedItem)\"\r\n        class=\"clear\"\r\n        id=\"chevron-{{ selectId }}\" icon=\"clear\"></dd-lib-svg-icon>\r\n    }\r\n  </div>\r\n\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-select__error\">{{ error }}</div>\r\n    }\r\n  }\r\n  @if (errorText && showSelfError && showError) {\r\n    <div class=\"lib-select__error\">{{ errorText }}</div>\r\n  }\r\n  @if (isShownList) {\r\n  <div\r\n    (ddClickOutside)=\"notifyFocusEvent($event);fullBlur.emit($event)\"\r\n    [elements]=\"['lib-select-' + selectId, 'chevron' + selectId]\"\r\n    [class.top]=\"side === 'top'\"\r\n    class=\"select-list-wrapper\">\r\n    @if (_data()?.length) {\r\n      <cdk-virtual-scroll-viewport [itemSize]=\"itemSize\" [style.height]=\"_data().length * itemSize + 'px'\">\r\n        <div *cdkVirtualFor=\"let item of _data() | filterByKey: filterList.bind(this)\">\r\n          <div [ddTooltip]=\"item.tooltip ? item.tooltip : ''\" [position]=\"tooltipPosition\"\r\n            (click)=\"selectItem(item)\"\r\n            [class.s-item-active]=\"checkSelected(item) && !item.disabled\"\r\n            [class.s-item-disabled]=\"item.disabled\"\r\n            class=\"select-data\">\r\n            @if (stringArray()) {\r\n              <div [innerHTML]=\"item | highlight: (highlight ? inputValue : '') | safe: 'html'\" class=\"select-data__title\"></div>\r\n            }\r\n            @if (keyTitle && !stringArray()) {\r\n              <div\r\n                [innerHTML]=\"item[keyTitle!] | highlight: (highlight ? inputValue : '') | safe: 'html'\"\r\n                class=\"select-data__title\"></div>\r\n            }\r\n            @if (keyDesc && !stringArray()) {\r\n              <div\r\n                [innerHTML]=\"item[keyDesc!] | highlight: (highlight ? inputValue : '') | safe: 'html'\"\r\n                [title]=\"item[keyDesc]\"\r\n                class=\"select-data__desc\"></div>\r\n            } @if (checkSelected(item)) {\r\n            <dd-lib-svg-icon\r\n              (click)=\"selectItem(checkedItem)\"\r\n              class=\"checked\"\r\n              id=\"chevron-{{ selectId }}\" icon=\"check_green\"></dd-lib-svg-icon>\r\n          }\r\n          </div>\r\n        </div>\r\n      </cdk-virtual-scroll-viewport>\r\n    } @else {\r\n    <div class=\"select-loader\">\r\n      <dd-lib-loader></dd-lib-loader>\r\n    </div>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".lib-select{position:relative}.lib-select input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-select input:hover{border-color:var(--input-active-border-colort)}.lib-select input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-select input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-select input:disabled::placeholder{color:var(--input-placeholder)}.lib-select input.invalid,.lib-select input.invalid:hover{border-color:var(--input-error-border-color)}.lib-select input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-select .multi-count{position:absolute;top:12px;left:16px}.lib-select .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-select .chevron{cursor:pointer;position:absolute;right:16px;top:10px}.lib-select .chevron.up{transform:rotate(180deg)}.lib-select__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-select__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-select .select-list-wrapper{position:absolute;display:block;z-index:100;width:100%;max-height:300px;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}.lib-select .select-list-wrapper cdk-virtual-scroll-viewport{max-height:300px}.lib-select .select-list-wrapper.top{bottom:50px;top:unset}.lib-select .select-list-wrapper .select-data{padding:12px 42px 12px 16px;cursor:pointer;position:relative;min-height:40px}.lib-select .select-list-wrapper .select-data__desc{font-size:14px;font-weight:400;line-height:24px;text-overflow:ellipsis;text-wrap:nowrap;padding-top:2px;overflow:hidden;color:var(--second-gray-color)}.lib-select .select-list-wrapper .select-data:hover,.lib-select .select-list-wrapper .select-data.s-item-active{background:var(--select-act-hov-bgc)}.lib-select .select-list-wrapper .select-data.s-item-active .checked{position:absolute;right:16px;top:10px}.lib-select .select-list-wrapper .select-data.s-item-disabled{cursor:auto;background:var(--disabled-bgc);color:var(--disabled-color)}.lib-select .select-list-wrapper .select-loader{padding:24px}\n"] }]
-        }], ctorParameters: () => [{ type: DestroyService }, { type: i0.ChangeDetectorRef }, { type: i1$5.ControlContainer, decorators: [{
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-select\" id=\"lib-select-{{ selectId }}\" ddFixedPosition>\r\n  @if (label) {\r\n    <label [for]=\"id\" class=\"lib-select__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n\r\n  <div class=\"pos-relative\" data-child=\"input\">\r\n    <div class=\"search-block\"\r\n         [style.right]=\"multiCountValue ? '125px' : multi ? '40px' : '30px'\"\r\n         [style.display]=\"(isShownList) ? 'flex' : 'none'\">\r\n      <input class=\"search-block__input\"  #searchInputEl [attr.name]=\"name\"\r\n             [readOnly]=\"readOnly\"\r\n             (input)=\"searchInput($event)\"\r\n             (blur)=\"handleBlur()\"\r\n             (focus)=\"handleFocus()\"\r\n             [(ngModel)]=\"searchValue\" type=\"text\" >\r\n        <dd-lib-svg-icon\r\n          [style.display]=\"searchValue ? 'block' : 'none'\"\r\n          class=\"cup\"\r\n          (click)=\"searchValue=''\"\r\n          id=\"chevron-{{ selectId }}\" icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    </div>\r\n    @if (!this._data()?.length || !this._data()) {\r\n      <div class=\"data-loader\">\r\n        <dd-lib-loader></dd-lib-loader>\r\n      </div>\r\n    }\r\n    <input\r\n      #select\r\n      (change)=\"handleChange()\"\r\n      (click)=\"notifyFocusEvent($event)\"\r\n      (input)=\"handleInput($event)\"\r\n      (blur)=\"handleBlur()\"\r\n      (focus)=\"handleFocus()\"\r\n      [attr.id]=\"selectId\"\r\n      [attr.placeholder]=\"(multiCountValue || searchValue) ? '' : placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [style.color]=\"(searchValue && isShownList) ? 'transparent' : 'inherit'\"\r\n      [attr.type]=\"'text'\"\r\n      [class.focused]=\"focused\"\r\n      [class.invalid]=\"showError\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"true\"\r\n      [(ngModel)]=\"inputValue\"\r\n      [title]=\"inputValue || ''\"\r\n      class=\"text-select select-block\" />\r\n    @if (multiCountValue) {\r\n      <span class=\"multi-count text-plain small\">{{multiCountValue}}</span>\r\n    }\r\n    <!--    (blur)=\"notifyFocusEvent($event)\"-->\r\n    @if (!checkedItem) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"notifyFocusEvent($event)\"\r\n        [class.black-svg]=\"isShownList\"\r\n        [class.disabled]=\"disabled\"\r\n        [class.gray-svg]=\"!isShownList\"\r\n        [class.up]=\"isShownList\"\r\n        id=\"chevron-{{ selectId }}\" class=\"chevron\" icon=\"down_chevron\"></dd-lib-svg-icon>\r\n\r\n    } @else if (clearable && !searchValue) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"onClear(checkedItem)\"\r\n        class=\"clear\"\r\n        id=\"chevron-{{ selectId }}\" icon=\"clear\"></dd-lib-svg-icon>\r\n    }\r\n  </div>\r\n\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-select__error\">{{ error }}</div>\r\n    }\r\n  }\r\n  @if (errorText && showSelfError && showError) {\r\n    <div class=\"lib-select__error\">{{ errorText }}</div>\r\n  }\r\n  @if (isShownList) {\r\n  <div\r\n    id=\"dropdown\"\r\n    data-child=\"list\"\r\n    [ngStyle]=\"dropdownStyle\"\r\n    (ddClickOutside)=\"notifyFocusEvent($event);fullBlur.emit($event)\"\r\n    [elements]=\"['lib-select-' + selectId, 'chevron' + selectId]\"\r\n    ddListKeyboardNavigation\r\n    class=\"select-list-wrapper\">\r\n    @if (_data()?.length) {\r\n      @if (virtualScroll) {\r\n        <cdk-virtual-scroll-viewport [itemSize]=\"itemSize\" [style.height]=\"(_data()?.length || 0) * itemSize + 'px'\">\r\n          <div *cdkVirtualFor=\"let item of _data() | filterByKey: filterList.bind(this)\">\r\n            <ng-container [ngTemplateOutlet]=\"rowItem\" [ngTemplateOutletContext]=\"{item}\"></ng-container>\r\n          </div>\r\n        </cdk-virtual-scroll-viewport>\r\n      } @else {\r\n        @for (item of _data() | filterByKey: filterList.bind(this); track item) {\r\n          <ng-container [ngTemplateOutlet]=\"rowItem\" [ngTemplateOutletContext]=\"{item}\"></ng-container>\r\n        }\r\n      }\r\n    } @else {\r\n    <div class=\"select-loader\">\r\n      <dd-lib-loader></dd-lib-loader>\r\n    </div>\r\n    }\r\n  </div>\r\n  }\r\n</div>\r\n\r\n<ng-template #rowItem let-item=item>\r\n  <div ddSelectableItem [ddTooltip]=\"item.tooltip ? item.tooltip : ''\" [position]=\"tooltipPosition\"\r\n       (click)=\"selectItem(item)\"\r\n       (itemSelected)=\"selectItem(item)\"\r\n       [class.s-item-active]=\"checkSelected(item) && !item.disabled\"\r\n       [class.s-item-disabled]=\"item.disabled\"\r\n       class=\"select-data\">\r\n    @if (stringArray()) {\r\n      <div [innerHTML]=\"item | highlight: (highlight ? searchValue : '') | safe: 'html'\"\r\n           class=\"select-data__title\"></div>\r\n    }\r\n    @if (keyTitle && !stringArray()) {\r\n      <div\r\n        [innerHTML]=\"item[keyTitle!] | highlight: (highlight ? searchValue : '') | safe: 'html'\"\r\n        class=\"select-data__title\"></div>\r\n    }\r\n    @if (keyDesc && !stringArray()) {\r\n      <div\r\n        [innerHTML]=\"item[keyDesc!] | highlight: (highlight ? searchValue : '') | safe: 'html'\"\r\n        [title]=\"item[keyDesc]\"\r\n        class=\"select-data__desc\"></div>\r\n    }\r\n    @if (checkSelected(item)) {\r\n      <dd-lib-svg-icon\r\n        (click)=\"selectItem(checkedItem)\"\r\n        class=\"checked\"\r\n        id=\"chevron-{{ selectId }}\" icon=\"check_green\"></dd-lib-svg-icon>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: [".lib-select{position:relative}.lib-select .select-block{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-select .select-block:hover{border-color:var(--input-active-border-colort)}.lib-select .select-block:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-select .select-block:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-select .select-block:disabled::placeholder{color:var(--input-placeholder)}.lib-select .select-block.invalid,.lib-select .select-block.invalid:hover{border-color:var(--input-error-border-color)}.lib-select .select-block.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-select .multi-count{position:absolute;top:10px;right:42px;white-space:nowrap}.lib-select .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-select .chevron{cursor:pointer;position:absolute;right:16px;top:10px}.lib-select .chevron.up{transform:rotate(180deg)}.lib-select__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start;color:var(--light-black-color)}.lib-select__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-select .select-list-wrapper{position:absolute;display:block;z-index:100;width:100%;max-height:300px;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}.lib-select .select-list-wrapper cdk-virtual-scroll-viewport{max-height:300px}.lib-select .select-list-wrapper.top{bottom:50px;top:unset}.lib-select .select-list-wrapper .select-data{padding:12px 42px 12px 16px;cursor:pointer;position:relative;min-height:40px}.lib-select .select-list-wrapper .select-data__desc{font-size:14px;font-weight:400;line-height:24px;text-overflow:ellipsis;text-wrap:nowrap;padding-top:2px;overflow:hidden;color:var(--second-gray-color)}.lib-select .select-list-wrapper .select-data.key-down-active,.lib-select .select-list-wrapper .select-data:hover,.lib-select .select-list-wrapper .select-data.s-item-active{background:var(--select-act-hov-bgc)}.lib-select .select-list-wrapper .select-data.s-item-active .checked{position:absolute;right:16px;top:10px}.lib-select .select-list-wrapper .select-data.s-item-disabled{cursor:auto;background:var(--disabled-bgc);color:var(--disabled-color)}.lib-select .select-list-wrapper .select-loader{padding:24px}.search-block{position:absolute;height:12px;top:17px;z-index:1;left:16px;display:flex;gap:4px;align-items:center}.search-block__input{border:none;background:transparent;width:100%}.data-loader{position:absolute;right:0;left:0;bottom:12px}\n"] }]
+        }], ctorParameters: () => [{ type: DestroyService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$5.ControlContainer, decorators: [{
                     type: Optional
                 }, {
                     type: Host
                 }, {
                     type: SkipSelf
-                }] }], propDecorators: { data: [{
+                }] }], propDecorators: { selectEl: [{
+                type: ViewChild,
+                args: ['select', { read: ElementRef, static: true }]
+            }], searchInputEl: [{
+                type: ViewChild,
+                args: ['searchInputEl', { read: ElementRef, static: true }]
+            }], data: [{
+                type: Input
+            }], virtualScroll: [{
                 type: Input
             }], multi: [{
                 type: Input
@@ -3148,6 +3557,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 type: Input
             }], selectedItem: [{
                 type: Output
+            }], selectedItems: [{
+                type: Output
+            }], onWindowScroll: [{
+                type: HostListener,
+                args: ['window:resize']
+            }, {
+                type: HostListener,
+                args: ['window:scroll']
             }] } });
 
 const DefaultSort = [
@@ -3254,13 +3671,13 @@ class LibSvgComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSvgComponent, deps: [{ token: i1$2.HttpClient }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSvgComponent, deps: [{ token: i1$1.HttpClient }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibSvgComponent, isStandalone: true, selector: "dd-lib-svg", inputs: { width: "width", height: "height", icon: "icon", pack: "pack", color: "color", stroke: "stroke" }, viewQueries: [{ propertyName: "svg", first: true, predicate: ["svgRef"], descendants: true, static: true }], ngImport: i0, template: "<div\r\n  #svgRef\r\n  [class.black-stroke]=\"stroke === 'black'\"\r\n  [class.black]=\"color === 'black'\"\r\n  [class.gray-stroke]=\"stroke === 'gray'\"\r\n  [class.gray]=\"color === 'gray'\"\r\n  [class.green-stroke]=\"stroke === 'green'\"\r\n  [class.green]=\"color === 'green'\"\r\n  [class.white-stroke]=\"stroke === 'white'\"\r\n  [class.white]=\"color === 'white'\"\r\n  [class.gold-stroke]=\"stroke === 'gold'\"\r\n  [class.gold]=\"color === 'gold'\"\r\n  [class.blue-stroke]=\"stroke === 'blue'\"\r\n  [class.blue]=\"color === 'blue'\"\r\n  class=\"lib-icon\"></div>\r\n", styles: [".lib-icon{display:flex;align-items:center;justify-content:center}.lib-icon.green{fill:var(--primary-green-color)}.lib-icon.white{fill:#fff}.lib-icon.white path{fill:#fff;stroke:#fff}.lib-icon.white-stroke{stroke:var(--white-color)}.lib-icon.white-stroke g>path,.lib-icon.white-stroke path{stroke:var(--white-color)}.lib-icon.black{fill:var(--black-color)}.lib-icon.gray{fill:var(--second-gray-color)}.lib-icon.gray path{fill:var(--second-gray-color);stroke:var(--second-gray-color)}.lib-icon.gray-stroke{stroke:var(--second-gray-color)}.lib-icon.gray-stroke path{stroke:var(--second-gray-color)}.lib-icon.gold-stroke{stroke:var(--gold-svg-color)}.lib-icon.gold-stroke path{stroke:var(--gold-svg-color)}.lib-icon.gold{fill:var(--gold-bgc-color)}.lib-icon.gold path{fill:var(--gold-bgc-color);stroke:var(--gold-svg-color)}.lib-icon.blue-stroke{stroke:var(--blue-color)}.lib-icon.blue-stroke path{stroke:var(--blue-color)}.lib-icon.blue{fill:var(--blue-light-bgc)}.lib-icon.blue path{fill:var(--blue-light-bgc);stroke:var(--blue-light-bgc)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibSvgComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dd-lib-svg', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  #svgRef\r\n  [class.black-stroke]=\"stroke === 'black'\"\r\n  [class.black]=\"color === 'black'\"\r\n  [class.gray-stroke]=\"stroke === 'gray'\"\r\n  [class.gray]=\"color === 'gray'\"\r\n  [class.green-stroke]=\"stroke === 'green'\"\r\n  [class.green]=\"color === 'green'\"\r\n  [class.white-stroke]=\"stroke === 'white'\"\r\n  [class.white]=\"color === 'white'\"\r\n  [class.gold-stroke]=\"stroke === 'gold'\"\r\n  [class.gold]=\"color === 'gold'\"\r\n  [class.blue-stroke]=\"stroke === 'blue'\"\r\n  [class.blue]=\"color === 'blue'\"\r\n  class=\"lib-icon\"></div>\r\n", styles: [".lib-icon{display:flex;align-items:center;justify-content:center}.lib-icon.green{fill:var(--primary-green-color)}.lib-icon.white{fill:#fff}.lib-icon.white path{fill:#fff;stroke:#fff}.lib-icon.white-stroke{stroke:var(--white-color)}.lib-icon.white-stroke g>path,.lib-icon.white-stroke path{stroke:var(--white-color)}.lib-icon.black{fill:var(--black-color)}.lib-icon.gray{fill:var(--second-gray-color)}.lib-icon.gray path{fill:var(--second-gray-color);stroke:var(--second-gray-color)}.lib-icon.gray-stroke{stroke:var(--second-gray-color)}.lib-icon.gray-stroke path{stroke:var(--second-gray-color)}.lib-icon.gold-stroke{stroke:var(--gold-svg-color)}.lib-icon.gold-stroke path{stroke:var(--gold-svg-color)}.lib-icon.gold{fill:var(--gold-bgc-color)}.lib-icon.gold path{fill:var(--gold-bgc-color);stroke:var(--gold-svg-color)}.lib-icon.blue-stroke{stroke:var(--blue-color)}.lib-icon.blue-stroke path{stroke:var(--blue-color)}.lib-icon.blue{fill:var(--blue-light-bgc)}.lib-icon.blue path{fill:var(--blue-light-bgc);stroke:var(--blue-light-bgc)}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: i0.Renderer2 }], propDecorators: { svg: [{
+        }], ctorParameters: () => [{ type: i1$1.HttpClient }, { type: i0.Renderer2 }], propDecorators: { svg: [{
                 type: ViewChild,
                 args: ['svgRef', { static: true }]
             }], width: [{
@@ -3295,11 +3712,11 @@ class ITab {
     }
 }
 class LibTabsFragmentComponent {
-    constructor(route, router, cdr) {
+    constructor(route, location, router, cdr) {
         this.route = route;
+        this.location = location;
         this.router = router;
         this.cdr = cdr;
-        this.rout = location.pathname;
         this.setActiveTab = new EventEmitter();
     }
     ngOnInit() {
@@ -3317,6 +3734,11 @@ class LibTabsFragmentComponent {
             else if (this.rout && this.noFragment && tab.path) {
                 this.router.navigate([this.rout, tab.path]);
             }
+            else if (!this.rout && !this.noFragment) {
+                const currentUrl = this.location.path(); // Получаем текущий URL без фрагмента
+                const newUrl = currentUrl.split('#')[0] + '#' + tab.fragment; // Добавляем фрагмент
+                this.location.replaceState(newUrl); // Обновляем URL без перезагрузки
+            }
             this.setActiveTab.emit(this.activeFragment);
         }
         else {
@@ -3328,7 +3750,7 @@ class LibTabsFragmentComponent {
         this.cdr.detectChanges();
     }
     getFragment() {
-        const activeFragment = this.route.snapshot.fragment;
+        const activeFragment = window.location.hash.split('#')[1];
         this.activeFragment = this.tabs?.[0]?.id || 0;
         if (this.tabsFragment?.includes(activeFragment)) {
             this.activeFragment = this.tabs?.find(f => f.fragment === activeFragment)?.id;
@@ -3340,13 +3762,13 @@ class LibTabsFragmentComponent {
             this.setActiveTab.emit(this.activeFragment);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibTabsFragmentComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibTabsFragmentComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1$3.Location }, { token: i1.Router }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibTabsFragmentComponent, isStandalone: true, selector: "dd-lib-tabs-fragment", inputs: { rout: "rout", tabs: "tabs", tabsFragment: "tabsFragment", needInitEvent: "needInitEvent", noFragment: "noFragment" }, outputs: { setActiveTab: "setActiveTab" }, ngImport: i0, template: "@if (tabs?.length) {\r\n<div class=\"tabs-fragment\">\r\n  <swiper-container speed=\"500\" slides-per-view=\"auto\">\r\n  @for (tab of tabs; track tab) {\r\n    <swiper-slide>\r\n      <div class=\"tabs-fragment__item\"\r\n           [class.active]=\"tab.id === activeFragment\"\r\n           (click)=\"checkActiveTab(tab)\">\r\n        {{ tab.title }}\r\n      </div>\r\n    </swiper-slide>\r\n  }\r\n  </swiper-container>\r\n</div>\r\n}\r\n", styles: [".tabs-fragment__item{display:inline-block;padding:0 8px 16px;font-size:16px;line-height:24px;color:var(--menu-item-color);border-bottom:1px solid var(--disabled-bgc);cursor:pointer}.tabs-fragment__item:hover,.tabs-fragment__item.active{color:var(--primary-green-color)}.tabs-fragment__item.active{padding-bottom:15px;border-width:2px;border-color:var(--primary-green-color);cursor:default}.tabs-fragment swiper-slide{width:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibTabsFragmentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dd-lib-tabs-fragment', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "@if (tabs?.length) {\r\n<div class=\"tabs-fragment\">\r\n  <swiper-container speed=\"500\" slides-per-view=\"auto\">\r\n  @for (tab of tabs; track tab) {\r\n    <swiper-slide>\r\n      <div class=\"tabs-fragment__item\"\r\n           [class.active]=\"tab.id === activeFragment\"\r\n           (click)=\"checkActiveTab(tab)\">\r\n        {{ tab.title }}\r\n      </div>\r\n    </swiper-slide>\r\n  }\r\n  </swiper-container>\r\n</div>\r\n}\r\n", styles: [".tabs-fragment__item{display:inline-block;padding:0 8px 16px;font-size:16px;line-height:24px;color:var(--menu-item-color);border-bottom:1px solid var(--disabled-bgc);cursor:pointer}.tabs-fragment__item:hover,.tabs-fragment__item.active{color:var(--primary-green-color)}.tabs-fragment__item.active{padding-bottom:15px;border-width:2px;border-color:var(--primary-green-color);cursor:default}.tabs-fragment swiper-slide{width:auto}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: i0.ChangeDetectorRef }], propDecorators: { rout: [{
+        }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i1$3.Location }, { type: i1.Router }, { type: i0.ChangeDetectorRef }], propDecorators: { rout: [{
                 type: Input
             }], tabs: [{
                 type: Input
@@ -3389,7 +3811,7 @@ class LibTextareaComponent extends LibCommonInputTextComponent {
                 useExisting: forwardRef(() => LibTextareaComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-textarea\">\r\n  <label [for]=\"id\" class=\"d-block g-text-sm mb-4\">\r\n    {{ label }}\r\n    @if (needCounter && maxlength) {\r\n      <span>(\u043E\u0441\u0442\u0430\u043B\u043E\u0441\u044C {{ +maxlength! - (value?.length || 0) }} \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432)</span>\r\n    }\r\n    @if (required) {\r\n      <span class=\"red\">*</span>\r\n    }\r\n  </label>\r\n  <div class=\"pos-relative d-flex\">\r\n    <textarea\r\n      #textarea\r\n      (blur)=\"notifyFocusEvent($event)\"\r\n      (change)=\"handleChange()\"\r\n      (focus)=\"notifyFocusEvent($event)\"\r\n      (input)=\"handleInput($event)\"\r\n      (keyup.enter)=\"forceChange()\"\r\n      [(ngModel)]=\"value\"\r\n      [attr.id]=\"id ? id : null\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [attr.minlength]=\"minlength\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [class.focused]=\"focused\"\r\n      [class.invalid]=\"invalid\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      [required]=\"required\"\r\n      [rows]=\"rows\"\r\n      class=\"textarea\"></textarea>\r\n    @if (maxlength) {\r\n      <span class=\"lib-textarea__counter\">{{ value?.length || 0 }}/{{ maxlength }}</span>\r\n    }\r\n  </div>\r\n\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-input__error\">{{ error }}</div>\r\n    }\r\n  }\r\n</div>\r\n", styles: [".lib-textarea{position:relative;display:inline;flex-direction:column}.lib-textarea textarea{width:100%;min-height:48px;padding:12px 16px;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;resize:none;font-size:16px;line-height:24px;color:var(--light-black-color)}.lib-textarea textarea:hover{border-color:var(--input-active-border-colort)}.lib-textarea textarea:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-textarea textarea:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-textarea textarea:disabled::placeholder{color:var(--input-placeholder)}.lib-textarea textarea.invalid,.lib-textarea textarea.invalid:hover{border-color:var(--input-error-border-color)}.lib-textarea textarea.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-textarea__counter{position:absolute;font-size:12px;font-weight:400;right:16px;bottom:12px;color:var(--input-placeholder)}.lib-textarea__counter textarea:disabled+.lib-text-counter{color:var(--input-disable-text)}.lib-textarea__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "textarea", first: true, predicate: ["textarea"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"lib-textarea\">\r\n  <label [for]=\"id\" class=\"d-block g-text-sm mb-4\">\r\n    {{ label }}\r\n    @if (needCounter && maxlength) {\r\n      <span>(\u043E\u0441\u0442\u0430\u043B\u043E\u0441\u044C {{ +maxlength! - (value?.length || 0) }} \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432)</span>\r\n    }\r\n    @if (required) {\r\n      <span class=\"red\">*</span>\r\n    }\r\n  </label>\r\n  <div class=\"pos-relative d-flex\">\r\n    <textarea\r\n      #textarea\r\n      (blur)=\"notifyFocusEvent($event)\"\r\n      (change)=\"handleChange()\"\r\n      (focus)=\"notifyFocusEvent($event)\"\r\n      (input)=\"handleInput($event)\"\r\n      (keyup.enter)=\"forceChange()\"\r\n      [(ngModel)]=\"value\"\r\n      [attr.id]=\"id ? id : null\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [attr.minlength]=\"minlength\"\r\n      [attr.name]=\"name\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      [attr.tabIndex]=\"tabIndex\"\r\n      [class.focused]=\"focused\"\r\n      [class.invalid]=\"invalid\"\r\n      [disabled]=\"disabled\"\r\n      [readOnly]=\"readOnly\"\r\n      [required]=\"required\"\r\n      [rows]=\"rows\"\r\n      class=\"textarea\"></textarea>\r\n    @if (maxlength) {\r\n      <span class=\"lib-textarea__counter\">{{ value?.length || 0 }}/{{ maxlength }}</span>\r\n    }\r\n  </div>\r\n\r\n  @if (errorTexts.length && showError) {\r\n    @for (error of errorTexts; track error) {\r\n      <div class=\"lib-input__error\">{{ error }}</div>\r\n    }\r\n  }\r\n</div>\r\n", styles: [".lib-textarea{position:relative;display:inline;flex-direction:column}.lib-textarea textarea{width:100%;min-height:48px;padding:12px 16px;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;resize:none;font-size:16px;line-height:24px;color:var(--light-black-color)}.lib-textarea textarea:hover{border-color:var(--input-active-border-colort)}.lib-textarea textarea:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-textarea textarea:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-textarea textarea:disabled::placeholder{color:var(--input-placeholder)}.lib-textarea textarea.invalid,.lib-textarea textarea.invalid:hover{border-color:var(--input-error-border-color)}.lib-textarea textarea.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-textarea__counter{position:absolute;font-size:12px;font-weight:400;right:16px;bottom:12px;color:var(--input-placeholder)}.lib-textarea__counter textarea:disabled+.lib-text-counter{color:var(--input-disable-text)}.lib-textarea__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$5.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: "17.2.2", ngImport: i0, type: LibTextareaComponent, decorators: [{
             type: Component,
@@ -3410,6 +3832,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 type: Input
             }], needCounter: [{
                 type: Input
+            }], textarea: [{
+                type: ViewChild,
+                args: ['textarea', { read: ElementRef, static: true }]
             }] } });
 
 class LibFileLoaderComponent {
@@ -3522,12 +3947,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
             }] } });
 
 class LibDateRangeComponent {
-    constructor() {
+    static { this.idCounter = 1; }
+    constructor(cdr) {
+        this.cdr = cdr;
         this.isShownPeriod = false;
         this.disabled = false;
         this.selectedPeriod = { start: new Date(), end: new Date() };
     }
-    static { this.idCounter = 1; }
     ngOnInit() {
         if (!this.rangeId) {
             this.rangeId = 'dd-range-' + LibDateRangeComponent.idCounter++;
@@ -3579,8 +4005,9 @@ class LibDateRangeComponent {
         if ($event?.start && $event?.end) {
             this.selectedPeriodStr = `${format($event?.start, 'dd.MM.yyyy')} - ${format($event?.end, 'dd.MM.yyyy')}`;
         }
+        this.cdr.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDateRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDateRangeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibDateRangeComponent, isStandalone: true, selector: "dd-lib-date-range", inputs: { rangeId: "rangeId", placeholder: "placeholder", label: "label", required: "required" }, providers: [
             provideNgxMask(),
             {
@@ -3588,7 +4015,7 @@ class LibDateRangeComponent {
                 useExisting: forwardRef(() => LibDateRangeComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\">\r\n  @if (label) {\r\n    <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n  <div class=\"pos-relative\">\r\n    <input\r\n      [attr.id]=\"rangeId\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      (click)=\"openCalendar()\"\r\n      [(ngModel)]=\"selectedPeriodStr\"\r\n      [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n      (ngModelChange)=\"changeStrDate($event)\"\r\n      [leadZeroDateTime]=\"true\"\r\n      class=\"text-select\"/>\r\n    @if (!selectedPeriodStr) {\r\n      <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n                       (click)=\"openCalendar()\"\r\n                       id=\"calendar-{{ rangeId }}\"\r\n                       class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n    } @else {\r\n      <dd-lib-svg-icon\r\n        (click)=\"setPeriod(undefined)\"\r\n        class=\"clear\"\r\n        icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    }\r\n  </div>\r\n  @if (isShownPeriod) {\r\n    <div\r\n      (ddClickOutside)=\"closeCalendar()\"\r\n      [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n      class=\"calendar-wrapper\">\r\n      <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".lib-range{min-width:340px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibCalendarComponent, selector: "dd-lib-calendar", inputs: ["type", "formatDate", "formatTime", "rangeMode", "maxHours", "maxMinutes", "needTime", "mode", "maxDate", "minDate"], outputs: ["emitDate", "emitPeriod"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\" ddFixedPosition>\r\n  @if (label) {\r\n    <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n  <div class=\"pos-relative\" data-child=\"input\">\r\n    <input\r\n      [attr.id]=\"rangeId\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      (click)=\"openCalendar()\"\r\n      [(ngModel)]=\"selectedPeriodStr\"\r\n      [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n      (ngModelChange)=\"changeStrDate($event)\"\r\n      [leadZeroDateTime]=\"true\"\r\n      class=\"text-select\"/>\r\n    @if (!selectedPeriodStr) {\r\n      <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n                       (click)=\"openCalendar()\"\r\n                       id=\"calendar-{{ rangeId }}\"\r\n                       class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n    } @else {\r\n      <dd-lib-svg-icon\r\n        (click)=\"setPeriod(undefined)\"\r\n        class=\"clear\"\r\n        icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    }\r\n  </div>\r\n  @if (isShownPeriod) {\r\n    <div  data-child=\"list\"\r\n      (ddClickOutside)=\"closeCalendar()\"\r\n      [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n      class=\"calendar-wrapper\">\r\n      <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".lib-range{min-width:340px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibCalendarComponent, selector: "dd-lib-calendar", inputs: ["type", "formatDate", "formatTime", "rangeMode", "maxHours", "maxMinutes", "needTime", "mode", "maxDate", "minDate"], outputs: ["emitDate", "emitPeriod"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { kind: "directive", type: FixedPositionDirective, selector: "[ddFixedPosition]", inputs: ["childName1", "childName2"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDateRangeComponent, decorators: [{
             type: Component,
@@ -3603,7 +4030,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                         LibPeriodComponent,
                         LibCalendarComponent,
                         NgxMaskDirective,
-                        JsonPipe
+                        JsonPipe,
+                        SelectableItemDirective,
+                        FixedPositionDirective
                     ], providers: [
                         provideNgxMask(),
                         {
@@ -3611,8 +4040,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             useExisting: forwardRef(() => LibDateRangeComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\">\r\n  @if (label) {\r\n    <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n  <div class=\"pos-relative\">\r\n    <input\r\n      [attr.id]=\"rangeId\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      (click)=\"openCalendar()\"\r\n      [(ngModel)]=\"selectedPeriodStr\"\r\n      [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n      (ngModelChange)=\"changeStrDate($event)\"\r\n      [leadZeroDateTime]=\"true\"\r\n      class=\"text-select\"/>\r\n    @if (!selectedPeriodStr) {\r\n      <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n                       (click)=\"openCalendar()\"\r\n                       id=\"calendar-{{ rangeId }}\"\r\n                       class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n    } @else {\r\n      <dd-lib-svg-icon\r\n        (click)=\"setPeriod(undefined)\"\r\n        class=\"clear\"\r\n        icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    }\r\n  </div>\r\n  @if (isShownPeriod) {\r\n    <div\r\n      (ddClickOutside)=\"closeCalendar()\"\r\n      [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n      class=\"calendar-wrapper\">\r\n      <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".lib-range{min-width:340px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"] }]
-        }], propDecorators: { rangeId: [{
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\" ddFixedPosition>\r\n  @if (label) {\r\n    <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n  <div class=\"pos-relative\" data-child=\"input\">\r\n    <input\r\n      [attr.id]=\"rangeId\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      (click)=\"openCalendar()\"\r\n      [(ngModel)]=\"selectedPeriodStr\"\r\n      [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n      (ngModelChange)=\"changeStrDate($event)\"\r\n      [leadZeroDateTime]=\"true\"\r\n      class=\"text-select\"/>\r\n    @if (!selectedPeriodStr) {\r\n      <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n                       (click)=\"openCalendar()\"\r\n                       id=\"calendar-{{ rangeId }}\"\r\n                       class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n    } @else {\r\n      <dd-lib-svg-icon\r\n        (click)=\"setPeriod(undefined)\"\r\n        class=\"clear\"\r\n        icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    }\r\n  </div>\r\n  @if (isShownPeriod) {\r\n    <div  data-child=\"list\"\r\n      (ddClickOutside)=\"closeCalendar()\"\r\n      [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n      class=\"calendar-wrapper\">\r\n      <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".lib-range{min-width:340px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { rangeId: [{
                 type: Input
             }], placeholder: [{
                 type: Input
@@ -3623,12 +4052,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
             }] } });
 
 class LibDateInputComponent {
-    constructor() {
+    static { this.idCounter = 1; }
+    constructor(cdr) {
+        this.cdr = cdr;
         this.isShownCalendar = false;
         this.disabled = false;
         this.selectedDate = new Date();
     }
-    static { this.idCounter = 1; }
     ngOnInit() {
         if (!this.dateId) {
             this.dateId = 'dd-date-' + LibDateInputComponent.idCounter++;
@@ -3679,8 +4109,9 @@ class LibDateInputComponent {
         if ($event) {
             this.selectedDateStr = `${format($event, 'dd.MM.yyyy')}`;
         }
+        this.cdr.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDateInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibDateInputComponent, isStandalone: true, selector: "dd-lib-date-input", inputs: { topSide: "topSide", dateId: "dateId", placeholder: "placeholder", label: "label", required: "required" }, providers: [
             provideNgxMask(),
             {
@@ -3713,7 +4144,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                             multi: true,
                         },
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-date\" id=\"lib-date-{{ dateId }}\">\r\n  @if (label) {\r\n    <label [for]=\"dateId\" class=\"lib-date__title\">\r\n      {{ label }}\r\n      @if (required) {\r\n        <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n      }\r\n    </label>\r\n  }\r\n  <div class=\"pos-relative\">\r\n    <input\r\n      [attr.id]=\"dateId\"\r\n      [attr.placeholder]=\"placeholder\"\r\n      (click)=\"openCalendar()\"\r\n      [(ngModel)]=\"selectedDateStr\"\r\n      [mask]=\"'d0.M0.0000'\"\r\n      (ngModelChange)=\"changeStrDate($event)\"\r\n      [leadZeroDateTime]=\"true\"\r\n      class=\"text-select\"/>\r\n    @if (!selectedDateStr) {\r\n      <dd-lib-svg-icon [class.gray-svg]=\"!isShownCalendar\"\r\n                       (click)=\"openCalendar()\"\r\n                       id=\"calendar-{{ dateId }}\"\r\n                       class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n    } @else {\r\n      <dd-lib-svg-icon\r\n        (click)=\"setPeriod(undefined)\"\r\n        class=\"clear\"\r\n        icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n    }\r\n  </div>\r\n  @if (isShownCalendar) {\r\n    <div\r\n      (ddClickOutside)=\"closeCalendar()\"\r\n      [elements]=\"['lib-date-' + dateId, 'calendar' + dateId]\"\r\n      class=\"calendar-wrapper\" [ngClass]=\"{top: topSide}\">\r\n      <dd-lib-calendar [(ngModel)]=\"selectedDate\" (emitDate)=\"setPeriod($event)\"></dd-lib-calendar>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".lib-date{min-width:340px;position:relative}.lib-date input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-date input:hover{border-color:var(--input-active-border-colort)}.lib-date input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-date input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-date input:disabled::placeholder{color:var(--input-placeholder)}.lib-date input.invalid,.lib-date input.invalid:hover{border-color:var(--input-error-border-color)}.lib-date input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-date .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-date .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-date .calendar.up{transform:rotate(180deg)}.lib-date__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-date__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-date .calendar-wrapper{max-width:350px;position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}.lib-date .calendar-wrapper.top{bottom:48px}\n"] }]
-        }], propDecorators: { topSide: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { topSide: [{
                 type: Input
             }], dateId: [{
                 type: Input
@@ -3737,7 +4168,7 @@ class LibFilterComponent {
         this.renderer.setStyle(this.document.body, 'overflow', this.hideFilter ? '' : 'hidden');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibFilterComponent, deps: [{ token: DOCUMENT }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibFilterComponent, isStandalone: true, selector: "dd-lib-filter", outputs: { resetEvent: "resetEvent" }, ngImport: i0, template: "<div class=\"filter\">\r\n  <div class=\"filter__block\" [ngClass]=\"{ 'hide-tablet': hideFilter }\">\r\n    <div class=\"filter__head\">\r\n      <div class=\"filter__back g-h5-title d-flex align-center cup\" (click)=\"toggleFilter()\">\r\n        <dd-lib-svg-icon icon=\"toggle_arrow_left\"></dd-lib-svg-icon>\r\n        <span class=\"ml-16\">\u0424\u0438\u043B\u044C\u0442\u0440\u044B</span>\r\n      </div>\r\n      <div class=\"g-text green cup\" (click)=\"resetEvent.emit()\">\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C</div>\r\n    </div>\r\n    <div class=\"filter__body\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n  <div class=\"show-tablet\" (click)=\"toggleFilter()\">\r\n    <div class=\"d-flex align-center cup\">\r\n      <dd-lib-svg-icon icon=\"filter\"></dd-lib-svg-icon>\r\n      <div class=\"filter__txt g-text green ml-12 m-ml-8\">\u0424\u0438\u043B\u044C\u0442\u0440\u044B</div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["@media screen and (max-width: 840px){.filter__block{position:fixed;top:0;left:0;width:100%;height:100%;z-index:300;display:block;background-color:var(--white-color)}}.filter__head{display:none}@media screen and (max-width: 840px){.filter__head{display:flex;align-items:center;justify-content:space-between;padding:24px 16px;border-bottom:1px solid var(--gray-color-200)}}@media screen and (max-width: 480px){.filter__head{padding:16px}}.filter__back ::ng-deep svg path{stroke:var(--menu-arr-color)}.filter__body{display:flex}@media screen and (max-width: 840px){.filter__body{display:block;padding-left:16px;padding-right:16px;overflow:auto}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: LibFilterComponent, isStandalone: true, selector: "dd-lib-filter", outputs: { resetEvent: "resetEvent" }, ngImport: i0, template: "<div class=\"filter\">\r\n  <div class=\"filter__block\" [ngClass]=\"{ 'hide-tablet': hideFilter }\">\r\n    <div class=\"filter__head\">\r\n      <div class=\"filter__back g-h5-title d-flex align-center cup\" (click)=\"toggleFilter()\">\r\n        <dd-lib-svg-icon icon=\"toggle_arrow_left\"></dd-lib-svg-icon>\r\n        <span class=\"ml-16\">\u0424\u0438\u043B\u044C\u0442\u0440\u044B</span>\r\n      </div>\r\n      <div class=\"g-text green cup\" (click)=\"resetEvent.emit()\">\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C</div>\r\n    </div>\r\n    <div class=\"filter__body\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n  <div class=\"show-tablet\" (click)=\"toggleFilter()\">\r\n    <div class=\"d-flex align-center cup\">\r\n      <dd-lib-svg-icon icon=\"filter\"></dd-lib-svg-icon>\r\n      <div class=\"filter__txt g-text green ml-12 m-ml-8\">\u0424\u0438\u043B\u044C\u0442\u0440\u044B</div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["@media screen and (max-width: 840px){.filter__block{position:fixed;top:0;left:0;width:100%;height:100%;z-index:300;display:block;background-color:var(--white-color)}}.filter__head{display:none}@media screen and (max-width: 840px){.filter__head{display:flex;align-items:center;justify-content:space-between;padding:24px 16px;border-bottom:1px solid var(--gray-color-200)}}@media screen and (max-width: 480px){.filter__head{padding:16px}}.filter__back ::ng-deep svg path{stroke:var(--menu-arr-color)}.filter__body{display:flex}@media screen and (max-width: 840px){.filter__body{display:block;padding-left:16px;padding-right:16px;overflow:auto}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibFilterComponent, decorators: [{
             type: Component,
@@ -3775,6 +4206,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                 type: Output
             }] } });
 
+class LibDisclaimerComponent {
+    constructor() {
+        this.type = 'info';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDisclaimerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: LibDisclaimerComponent, isStandalone: true, selector: "dd-lib-disclaimer", inputs: { type: "type", title: "title", description: "description", template: "template" }, ngImport: i0, template: "<div class=\"disclaimer  {{ type }}\" >\r\n  @if (type === 'success') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0ZM11.824 6.16L7.288 10.696C7.176 10.808 7.024 10.872 6.864 10.872C6.704 10.872 6.552 10.808 6.44 10.696L4.176 8.432C3.944 8.2 3.944 7.816 4.176 7.584C4.408 7.352 4.792 7.352 5.024 7.584L6.864 9.424L10.976 5.312C11.208 5.08 11.592 5.08 11.824 5.312C12.056 5.544 12.056 5.92 11.824 6.16Z\"\r\n        fill=\"#07B700\"/>\r\n    </svg>\r\n  }\r\n  @if (type === 'warning') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0ZM7.4 4.8C7.4 4.472 7.672 4.2 8 4.2C8.328 4.2 8.6 4.472 8.6 4.8V8.8C8.6 9.128 8.328 9.4 8 9.4C7.672 9.4 7.4 9.128 7.4 8.8V4.8ZM8.736 11.504C8.696 11.608 8.64 11.688 8.568 11.768C8.488 11.84 8.4 11.896 8.304 11.936C8.208 11.976 8.104 12 8 12C7.896 12 7.792 11.976 7.696 11.936C7.6 11.896 7.512 11.84 7.432 11.768C7.36 11.688 7.304 11.608 7.264 11.504C7.224 11.408 7.2 11.304 7.2 11.2C7.2 11.096 7.224 10.992 7.264 10.896C7.304 10.8 7.36 10.712 7.432 10.632C7.512 10.56 7.6 10.504 7.696 10.464C7.888 10.384 8.112 10.384 8.304 10.464C8.4 10.504 8.488 10.56 8.568 10.632C8.64 10.712 8.696 10.8 8.736 10.896C8.776 10.992 8.8 11.096 8.8 11.2C8.8 11.304 8.776 11.408 8.736 11.504Z\"\r\n        fill=\"#FAAD14\"/>\r\n    </svg>\r\n  }\r\n  @if (type === 'danger') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0ZM10.688 9.84C10.92 10.072 10.92 10.456 10.688 10.688C10.568 10.808 10.416 10.864 10.264 10.864C10.112 10.864 9.96 10.808 9.84 10.688L8 8.848L6.16 10.688C6.04 10.808 5.888 10.864 5.736 10.864C5.584 10.864 5.432 10.808 5.312 10.688C5.08 10.456 5.08 10.072 5.312 9.84L7.152 8L5.312 6.16C5.08 5.928 5.08 5.544 5.312 5.312C5.544 5.08 5.928 5.08 6.16 5.312L8 7.152L9.84 5.312C10.072 5.08 10.456 5.08 10.688 5.312C10.92 5.544 10.92 5.928 10.688 6.16L8.848 8L10.688 9.84Z\"\r\n        fill=\"#FF3645\"/>\r\n    </svg>\r\n  }\r\n  @if (type === 'info') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16ZM8.6 11.2C8.6 11.528 8.328 11.8 8 11.8C7.672 11.8 7.4 11.528 7.4 11.2V7.2C7.4 6.872 7.672 6.6 8 6.6C8.328 6.6 8.6 6.872 8.6 7.2L8.6 11.2ZM7.264 4.496C7.304 4.392 7.36 4.312 7.432 4.232C7.512 4.16 7.6 4.104 7.696 4.064C7.792 4.024 7.896 4 8 4C8.104 4 8.208 4.024 8.304 4.064C8.4 4.104 8.488 4.16 8.568 4.232C8.64 4.312 8.696 4.392 8.736 4.496C8.776 4.592 8.8 4.696 8.8 4.8C8.8 4.904 8.776 5.008 8.736 5.104C8.696 5.2 8.64 5.288 8.568 5.368C8.488 5.44 8.4 5.496 8.304 5.536C8.112 5.616 7.888 5.616 7.696 5.536C7.6 5.496 7.512 5.44 7.432 5.368C7.36 5.288 7.304 5.2 7.264 5.104C7.224 5.008 7.2 4.904 7.2 4.8C7.2 4.696 7.224 4.592 7.264 4.496Z\"\r\n        fill=\"#007BFB\"/>\r\n    </svg>\r\n\r\n  }\r\n  <div class=\"ml-12\">\r\n    @if (title) {\r\n      <div class=\"b5-title mb-4\" [innerHTML]=\"title\"></div>\r\n    }\r\n    @if (description) {\r\n      <div class=\"b6-title\" [innerHTML]=\"description\"></div>\r\n    }\r\n    @if (template) {\r\n      <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{display:block}.disclaimer{position:relative;display:flex;align-items:flex-start;padding:20px;background:#eefaf3;border-radius:12px;width:100%}.disclaimer svg{display:block;min-width:16px;min-height:16px;margin-top:4px}.disclaimer.success{background-color:var(--light-green-color)}.disclaimer.info{background-color:var(--light-blue-color)}.disclaimer.warning{background-color:var(--yellow-card)}.disclaimer.danger{background-color:var(--red-light-color)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: LibDisclaimerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dd-lib-disclaimer', standalone: true, imports: [
+                        AsyncPipe,
+                        NgTemplateOutlet
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"disclaimer  {{ type }}\" >\r\n  @if (type === 'success') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0ZM11.824 6.16L7.288 10.696C7.176 10.808 7.024 10.872 6.864 10.872C6.704 10.872 6.552 10.808 6.44 10.696L4.176 8.432C3.944 8.2 3.944 7.816 4.176 7.584C4.408 7.352 4.792 7.352 5.024 7.584L6.864 9.424L10.976 5.312C11.208 5.08 11.592 5.08 11.824 5.312C12.056 5.544 12.056 5.92 11.824 6.16Z\"\r\n        fill=\"#07B700\"/>\r\n    </svg>\r\n  }\r\n  @if (type === 'warning') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0ZM7.4 4.8C7.4 4.472 7.672 4.2 8 4.2C8.328 4.2 8.6 4.472 8.6 4.8V8.8C8.6 9.128 8.328 9.4 8 9.4C7.672 9.4 7.4 9.128 7.4 8.8V4.8ZM8.736 11.504C8.696 11.608 8.64 11.688 8.568 11.768C8.488 11.84 8.4 11.896 8.304 11.936C8.208 11.976 8.104 12 8 12C7.896 12 7.792 11.976 7.696 11.936C7.6 11.896 7.512 11.84 7.432 11.768C7.36 11.688 7.304 11.608 7.264 11.504C7.224 11.408 7.2 11.304 7.2 11.2C7.2 11.096 7.224 10.992 7.264 10.896C7.304 10.8 7.36 10.712 7.432 10.632C7.512 10.56 7.6 10.504 7.696 10.464C7.888 10.384 8.112 10.384 8.304 10.464C8.4 10.504 8.488 10.56 8.568 10.632C8.64 10.712 8.696 10.8 8.736 10.896C8.776 10.992 8.8 11.096 8.8 11.2C8.8 11.304 8.776 11.408 8.736 11.504Z\"\r\n        fill=\"#FAAD14\"/>\r\n    </svg>\r\n  }\r\n  @if (type === 'danger') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0ZM10.688 9.84C10.92 10.072 10.92 10.456 10.688 10.688C10.568 10.808 10.416 10.864 10.264 10.864C10.112 10.864 9.96 10.808 9.84 10.688L8 8.848L6.16 10.688C6.04 10.808 5.888 10.864 5.736 10.864C5.584 10.864 5.432 10.808 5.312 10.688C5.08 10.456 5.08 10.072 5.312 9.84L7.152 8L5.312 6.16C5.08 5.928 5.08 5.544 5.312 5.312C5.544 5.08 5.928 5.08 6.16 5.312L8 7.152L9.84 5.312C10.072 5.08 10.456 5.08 10.688 5.312C10.92 5.544 10.92 5.928 10.688 6.16L8.848 8L10.688 9.84Z\"\r\n        fill=\"#FF3645\"/>\r\n    </svg>\r\n  }\r\n  @if (type === 'info') {\r\n    <svg fill=\"none\" height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <path\r\n        d=\"M8 16C12.408 16 16 12.408 16 8C16 3.592 12.408 0 8 0C3.592 0 0 3.592 0 8C0 12.408 3.592 16 8 16ZM8.6 11.2C8.6 11.528 8.328 11.8 8 11.8C7.672 11.8 7.4 11.528 7.4 11.2V7.2C7.4 6.872 7.672 6.6 8 6.6C8.328 6.6 8.6 6.872 8.6 7.2L8.6 11.2ZM7.264 4.496C7.304 4.392 7.36 4.312 7.432 4.232C7.512 4.16 7.6 4.104 7.696 4.064C7.792 4.024 7.896 4 8 4C8.104 4 8.208 4.024 8.304 4.064C8.4 4.104 8.488 4.16 8.568 4.232C8.64 4.312 8.696 4.392 8.736 4.496C8.776 4.592 8.8 4.696 8.8 4.8C8.8 4.904 8.776 5.008 8.736 5.104C8.696 5.2 8.64 5.288 8.568 5.368C8.488 5.44 8.4 5.496 8.304 5.536C8.112 5.616 7.888 5.616 7.696 5.536C7.6 5.496 7.512 5.44 7.432 5.368C7.36 5.288 7.304 5.2 7.264 5.104C7.224 5.008 7.2 4.904 7.2 4.8C7.2 4.696 7.224 4.592 7.264 4.496Z\"\r\n        fill=\"#007BFB\"/>\r\n    </svg>\r\n\r\n  }\r\n  <div class=\"ml-12\">\r\n    @if (title) {\r\n      <div class=\"b5-title mb-4\" [innerHTML]=\"title\"></div>\r\n    }\r\n    @if (description) {\r\n      <div class=\"b6-title\" [innerHTML]=\"description\"></div>\r\n    }\r\n    @if (template) {\r\n      <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{display:block}.disclaimer{position:relative;display:flex;align-items:flex-start;padding:20px;background:#eefaf3;border-radius:12px;width:100%}.disclaimer svg{display:block;min-width:16px;min-height:16px;margin-top:4px}.disclaimer.success{background-color:var(--light-green-color)}.disclaimer.info{background-color:var(--light-blue-color)}.disclaimer.warning{background-color:var(--yellow-card)}.disclaimer.danger{background-color:var(--red-light-color)}\n"] }]
+        }], propDecorators: { type: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], description: [{
+                type: Input
+            }], template: [{
+                type: Input
+            }] } });
+
 // export function Debounce(delay: number = 1000): MethodDecorator {
 //   return function (_target: any, _propertyKey: string | symbol, descriptor: PropertyDescriptor) {
 //     let timeout: any = null;
@@ -4436,13 +4890,13 @@ class NotFoundComponent {
             this.router.navigate(['/']);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NotFoundComponent, deps: [{ token: i1.Location }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NotFoundComponent, deps: [{ token: i1$3.Location }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: NotFoundComponent, isStandalone: true, selector: "dd-not-found", ngImport: i0, template: "<div class=\"not-found\">\r\n  <div class=\"not-found__container\">\r\n    <div class=\"not-found__img page-404-bg\"></div>\r\n    <div>\r\n      <div class=\"g-h1-title mb-8 m-mb-12\">\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u0430</div>\r\n      <div class=\"g-text mb-40\">\u041F\u043E\u0445\u043E\u0436\u0435 \u0432\u044B \u043F\u043E\u0442\u0435\u0440\u044F\u043B\u0438\u0441\u044C, \u0441\u043A\u043E\u0440\u0435\u0435 \u0432\u043E\u0437\u0432\u0440\u0430\u0449\u0430\u0439\u0442\u0435\u0441\u044C \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E</div>\r\n      <div class=\"not-found__foot\">\r\n        <dd-lib-button routerLink=\"/\">\u041D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E</dd-lib-button>\r\n        <dd-lib-button (click)=\"goBack()\" btnColor=\"white\">\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434</dd-lib-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".not-found{display:flex;align-items:center;justify-content:center;padding:100px 0}@media screen and (max-width: 480px){.not-found{padding:24px 0}}.not-found__container{display:flex;align-items:center;gap:80px}@media screen and (max-width: 1320px){.not-found__container{flex-direction:column;gap:32px}}@media screen and (max-width: 840px){.not-found__container{text-align:center}}.not-found__img{width:500px;height:500px;background-size:cover}@media screen and (max-width: 840px){.not-found__img{width:400px;height:400px}}@media screen and (max-width: 480px){.not-found__img{width:280px;height:280px}}.not-found__foot{display:flex;align-items:center;gap:24px}@media screen and (max-width: 840px){.not-found__foot{flex-direction:column;gap:16px}}\n"], dependencies: [{ kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NotFoundComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dd-not-found', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [LibButtonComponent, RouterLink, NgOptimizedImage, LibSvgIconComponent], template: "<div class=\"not-found\">\r\n  <div class=\"not-found__container\">\r\n    <div class=\"not-found__img page-404-bg\"></div>\r\n    <div>\r\n      <div class=\"g-h1-title mb-8 m-mb-12\">\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u0430</div>\r\n      <div class=\"g-text mb-40\">\u041F\u043E\u0445\u043E\u0436\u0435 \u0432\u044B \u043F\u043E\u0442\u0435\u0440\u044F\u043B\u0438\u0441\u044C, \u0441\u043A\u043E\u0440\u0435\u0435 \u0432\u043E\u0437\u0432\u0440\u0430\u0449\u0430\u0439\u0442\u0435\u0441\u044C \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E</div>\r\n      <div class=\"not-found__foot\">\r\n        <dd-lib-button routerLink=\"/\">\u041D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E</dd-lib-button>\r\n        <dd-lib-button (click)=\"goBack()\" btnColor=\"white\">\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434</dd-lib-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".not-found{display:flex;align-items:center;justify-content:center;padding:100px 0}@media screen and (max-width: 480px){.not-found{padding:24px 0}}.not-found__container{display:flex;align-items:center;gap:80px}@media screen and (max-width: 1320px){.not-found__container{flex-direction:column;gap:32px}}@media screen and (max-width: 840px){.not-found__container{text-align:center}}.not-found__img{width:500px;height:500px;background-size:cover}@media screen and (max-width: 840px){.not-found__img{width:400px;height:400px}}@media screen and (max-width: 480px){.not-found__img{width:280px;height:280px}}.not-found__foot{display:flex;align-items:center;gap:24px}@media screen and (max-width: 840px){.not-found__foot{flex-direction:column;gap:16px}}\n"] }]
-        }], ctorParameters: () => [{ type: i1.Location }, { type: i1$1.Router }] });
+        }], ctorParameters: () => [{ type: i1$3.Location }, { type: i1.Router }] });
 
 class ErrorPageComponent {
     constructor(location, router) {
@@ -4457,7 +4911,7 @@ class ErrorPageComponent {
             this.router.navigate(['/']);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ErrorPageComponent, deps: [{ token: i1.Location }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ErrorPageComponent, deps: [{ token: i1$3.Location }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: ErrorPageComponent, isStandalone: true, selector: "dd-error-page", ngImport: i0, template: "<div class=\"error-page\">\r\n  <div class=\"error-page__container\">\r\n    <div class=\"error-page__img error-page-bg\"></div>\r\n    <div>\r\n      <div class=\"g-h1-title mb-8 m-mb-12\">\u041F\u0440\u043E\u0438\u0437\u043E\u0448\u043B\u0430 \u043E\u0448\u0438\u0431\u043A\u0430</div>\r\n      <div class=\"g-text mb-40\">\u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443 \u0438\u043B\u0438 \u0432\u0435\u0440\u043D\u0438\u0442\u0435\u0441\u044C \u043D\u0430\u0437\u0430\u0434</div>\r\n      <div class=\"error-page__foot\">\r\n        <dd-lib-button (click)=\"goBack()\">\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434</dd-lib-button>\r\n        <dd-lib-button (click)=\"goBack()\" btnColor=\"white\">\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443</dd-lib-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".error-page{display:flex;align-items:center;justify-content:center;padding:100px 0}@media screen and (max-width: 480px){.error-page{padding:24px 0}}.error-page__container{display:flex;align-items:center;gap:80px}@media screen and (max-width: 1320px){.error-page__container{flex-direction:column;gap:32px}}@media screen and (max-width: 840px){.error-page__container{text-align:center}}.error-page__img{width:500px;height:500px;background-size:cover}@media screen and (max-width: 840px){.error-page__img{width:400px;height:400px}}@media screen and (max-width: 480px){.error-page__img{width:280px;height:280px}}.error-page__foot{display:flex;align-items:center;gap:24px}@media screen and (max-width: 840px){.error-page__foot{flex-direction:column;gap:16px}}\n"], dependencies: [{ kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ErrorPageComponent, decorators: [{
@@ -4467,7 +4921,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
                         LibSvgIconComponent,
                         RouterLink
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"error-page\">\r\n  <div class=\"error-page__container\">\r\n    <div class=\"error-page__img error-page-bg\"></div>\r\n    <div>\r\n      <div class=\"g-h1-title mb-8 m-mb-12\">\u041F\u0440\u043E\u0438\u0437\u043E\u0448\u043B\u0430 \u043E\u0448\u0438\u0431\u043A\u0430</div>\r\n      <div class=\"g-text mb-40\">\u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443 \u0438\u043B\u0438 \u0432\u0435\u0440\u043D\u0438\u0442\u0435\u0441\u044C \u043D\u0430\u0437\u0430\u0434</div>\r\n      <div class=\"error-page__foot\">\r\n        <dd-lib-button (click)=\"goBack()\">\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434</dd-lib-button>\r\n        <dd-lib-button (click)=\"goBack()\" btnColor=\"white\">\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443</dd-lib-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".error-page{display:flex;align-items:center;justify-content:center;padding:100px 0}@media screen and (max-width: 480px){.error-page{padding:24px 0}}.error-page__container{display:flex;align-items:center;gap:80px}@media screen and (max-width: 1320px){.error-page__container{flex-direction:column;gap:32px}}@media screen and (max-width: 840px){.error-page__container{text-align:center}}.error-page__img{width:500px;height:500px;background-size:cover}@media screen and (max-width: 840px){.error-page__img{width:400px;height:400px}}@media screen and (max-width: 480px){.error-page__img{width:280px;height:280px}}.error-page__foot{display:flex;align-items:center;gap:24px}@media screen and (max-width: 840px){.error-page__foot{flex-direction:column;gap:16px}}\n"] }]
-        }], ctorParameters: () => [{ type: i1.Location }, { type: i1$1.Router }] });
+        }], ctorParameters: () => [{ type: i1$3.Location }, { type: i1.Router }] });
 
 class TechWorksComponent {
     constructor(location, router) {
@@ -4482,13 +4936,13 @@ class TechWorksComponent {
             this.router.navigate(['/']);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TechWorksComponent, deps: [{ token: i1.Location }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TechWorksComponent, deps: [{ token: i1$3.Location }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: TechWorksComponent, isStandalone: true, selector: "dd-tech-works", ngImport: i0, template: "<div class=\"tech-works\">\r\n  <div class=\"tech-works__img tech-works-bg mb-64 m-mb-32\"></div>\r\n  <div>\r\n    <div class=\"g-h1-title mb-8 m-mb-12\">\u0422\u0435\u0445\u043D\u0438\u0447\u0435\u0441\u043A\u0438\u0435 \u0440\u0430\u0431\u043E\u0442\u044B</div>\r\n    <div class=\"g-text mb-40\">\u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043F\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443 \u0438\u043B\u0438 \u0437\u0430\u0439\u0442\u0438 \u043F\u043E\u0437\u0436\u0435</div>\r\n    <div class=\"tech-works__foot\">\r\n      <dd-lib-button (click)=\"goBack()\">\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434</dd-lib-button>\r\n      <dd-lib-button routerLink=\"/\" btnColor=\"white\">\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443</dd-lib-button>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".tech-works{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:100px 0}@media screen and (max-width: 840px){.tech-works{text-align:center}}@media screen and (max-width: 480px){.tech-works{padding:24px 0}}.tech-works__img{width:500px;height:500px;background-size:cover}@media screen and (max-width: 840px){.tech-works__img{width:400px;height:400px}}@media screen and (max-width: 480px){.tech-works__img{width:280px;height:280px}}.tech-works__foot{display:flex;align-items:center;gap:24px}@media screen and (max-width: 840px){.tech-works__foot{flex-direction:column;gap:16px}}\n"], dependencies: [{ kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TechWorksComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dd-tech-works', standalone: true, imports: [LibButtonComponent, NgOptimizedImage, RouterLink, LibSvgIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tech-works\">\r\n  <div class=\"tech-works__img tech-works-bg mb-64 m-mb-32\"></div>\r\n  <div>\r\n    <div class=\"g-h1-title mb-8 m-mb-12\">\u0422\u0435\u0445\u043D\u0438\u0447\u0435\u0441\u043A\u0438\u0435 \u0440\u0430\u0431\u043E\u0442\u044B</div>\r\n    <div class=\"g-text mb-40\">\u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043F\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443 \u0438\u043B\u0438 \u0437\u0430\u0439\u0442\u0438 \u043F\u043E\u0437\u0436\u0435</div>\r\n    <div class=\"tech-works__foot\">\r\n      <dd-lib-button (click)=\"goBack()\">\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430\u0437\u0430\u0434</dd-lib-button>\r\n      <dd-lib-button routerLink=\"/\" btnColor=\"white\">\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443</dd-lib-button>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".tech-works{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:100px 0}@media screen and (max-width: 840px){.tech-works{text-align:center}}@media screen and (max-width: 480px){.tech-works{padding:24px 0}}.tech-works__img{width:500px;height:500px;background-size:cover}@media screen and (max-width: 840px){.tech-works__img{width:400px;height:400px}}@media screen and (max-width: 480px){.tech-works__img{width:280px;height:280px}}.tech-works__foot{display:flex;align-items:center;gap:24px}@media screen and (max-width: 840px){.tech-works__foot{flex-direction:column;gap:16px}}\n"] }]
-        }], ctorParameters: () => [{ type: i1.Location }, { type: i1$1.Router }] });
+        }], ctorParameters: () => [{ type: i1$3.Location }, { type: i1.Router }] });
 
 /*
  * Public API Surface of dd-lib
@@ -4499,5 +4953,5 @@ const t = true;
  * Generated bundle index. Do not edit.
  */
 
-export { AutoHeightDirective, ClickOutsideDirective, CounterDirective, DDDialogRef, DEFAULT_FORMAT, DIALOG_CONFIG, DataEmptyComponent, DateService, Debounce, DeclensionDirective, DestroyService, DialogConfig, DialogService, DisableAfterNCall, Disabled, ErrorPageComponent, FetcherService, FilterByKeyPipe, FilterPipe, FilterTabsPipe, FooterComponent, HighlightPipe, ITab, InterceptorsService, LibAccordionComponent, LibBackButtonComponent, LibButtonComponent, LibCalendarComponent, LibCardComponent, LibCheckboxComponent, LibCommentInputComponent, LibCommonButtonComponent, LibCommonInputTextComponent, LibDateInputComponent, LibDateRangeComponent, LibFileLoaderComponent, LibFileUploadComponent, LibFilterButtonComponent, LibFilterComponent, LibImageLoaderComponent, LibInfoCardComponent, LibInputComponent, LibLoaderComponent, LibPeriodComponent, LibRadioComponent, LibSearchInputComponent, LibSelectComponent, LibSkeletonComponent, LibSortComponent, LibStepComponent, LibSvgComponent, LibSvgIconComponent, LibTabsFragmentComponent, LibTextareaComponent, MainSharedComponent, ModalBaseComponent, ModalCommonComponent, NotFoundComponent, ResizeTextareaDirective, ReversePipe, SafePipe, SvgIconsService, TOAST_CONFIG_TOKEN, TOOLTIP_DATA, TechWorksComponent, ThemeConfigurator, ThemeConstructorService, Throttle, ToastComponent, ToastConfig, ToastData, ToastRef, ToastService, ToastTypeData, TooltipComponent, TooltipDirective, TriangleDirective, ValidatorsService, completeIconSet, defaultToastConfig, provideToast, svgIconActogoneAccept, svgIconAll, svgIconAppgalery, svgIconAppstore, svgIconArrowDownRed, svgIconArrowUpGreen, svgIconBackArrow, svgIconBurger, svgIconCalendar, svgIconCheckGreen, svgIconCheckWhite, svgIconCircleNo, svgIconClear, svgIconClose, svgIconDangerT, svgIconDd, svgIconDdM, svgIconDobrodel, svgIconDownChevron, svgIconDownload, svgIconEds, svgIconEdsM, svgIconEntry, svgIconErrorHint, svgIconEsia, svgIconEye, svgIconEyeOff, svgIconFile, svgIconFilter, svgIconGoogleapp, svgIconGrid, svgIconHealth, svgIconHealthM, svgIconInfoCircle, svgIconInfoT, svgIconLeftChevron, svgIconListSearch, svgIconLogout, svgIconMailExclamation, svgIconMaxFilter, svgIconMoon, svgIconMy, svgIconMyM, svgIconNews, svgIconNext, svgIconPaperclip, svgIconPenEdit, svgIconPguMo, svgIconPguMoM, svgIconPlug, svgIconPlugD, svgIconPlus, svgIconPreset, svgIconPrev, svgIconPrint, svgIconPrinter, svgIconQuestion, svgIconQuestionWhiteG, svgIconRedClose, svgIconReload, svgIconRightChevron, svgIconRustore, svgIconSearch, svgIconSend, svgIconSetAvatar, svgIconSharedLogo, svgIconSmallRoundLoader, svgIconSort, svgIconStar, svgIconSuccessT, svgIconSun, svgIconTg, svgIconToggleArrowLeft, svgIconToggleArrowRight, svgIconTrash, svgIconTrophy, svgIconUser, svgIconUserEmpty, svgIconUserEmptyD, svgIconVk, svgIconWarningT, t };
+export { AutoHeightDirective, ClickOutsideDirective, CounterDirective, DDDialogRef, DEFAULT_FORMAT, DIALOG_CONFIG, DataEmptyComponent, DateService, Debounce, DeclensionDirective, DestroyService, DialogConfig, DialogService, DisableAfterNCall, Disabled, DropDownPositionDirective, ErrorPageComponent, FetcherService, FilterByKeyPipe, FilterPipe, FilterTabsPipe, FixedPositionDirective, FooterComponent, HighlightPipe, ITab, InterceptorsService, LibAccordionComponent, LibBackButtonComponent, LibButtonComponent, LibCalendarComponent, LibCardComponent, LibCheckboxComponent, LibCommentInputComponent, LibCommonButtonComponent, LibCommonInputTextComponent, LibDateInputComponent, LibDateRangeComponent, LibDisclaimerComponent, LibFileLoaderComponent, LibFileUploadComponent, LibFilterButtonComponent, LibFilterComponent, LibImageLoaderComponent, LibInfoCardComponent, LibInputComponent, LibLoaderComponent, LibPeriodComponent, LibRadioComponent, LibSearchInputComponent, LibSelectComponent, LibSkeletonComponent, LibSortComponent, LibStepComponent, LibSvgComponent, LibSvgIconComponent, LibTabsFragmentComponent, LibTextareaComponent, ListKeyboardNavigationDirective, MainSharedComponent, ModalBaseComponent, ModalCommonComponent, NotFoundComponent, PhoneMaskDirective, ResizeTextareaDirective, ReversePipe, SafePipe, SelectableItemDirective, SvgIconsService, TOAST_CONFIG_TOKEN, TOOLTIP_DATA, TechWorksComponent, ThemeConfigurator, ThemeConstructorService, Throttle, ToastComponent, ToastConfig, ToastData, ToastRef, ToastService, ToastTypeData, TooltipComponent, TooltipDirective, TriangleDirective, ValidatorsService, completeIconSet, defaultToastConfig, provideToast, svgIconActogoneAccept, svgIconAll, svgIconAppgalery, svgIconAppstore, svgIconArrowDownRed, svgIconArrowUpGreen, svgIconBackArrow, svgIconBurger, svgIconCalendar, svgIconCheckGreen, svgIconCheckWhite, svgIconCircleNo, svgIconClear, svgIconClose, svgIconDangerT, svgIconDd, svgIconDdM, svgIconDobrodel, svgIconDownChevron, svgIconDownload, svgIconEds, svgIconEdsM, svgIconEntry, svgIconErrorHint, svgIconEsia, svgIconEye, svgIconEyeOff, svgIconFile, svgIconFilter, svgIconGoogleapp, svgIconGrid, svgIconHealth, svgIconHealthM, svgIconInfoCircle, svgIconInfoT, svgIconLeftChevron, svgIconListSearch, svgIconLogout, svgIconMailExclamation, svgIconMaxFilter, svgIconMoon, svgIconMy, svgIconMyM, svgIconNews, svgIconNext, svgIconPaperclip, svgIconPenEdit, svgIconPguMo, svgIconPguMoM, svgIconPlug, svgIconPlugD, svgIconPlus, svgIconPreset, svgIconPrev, svgIconPrint, svgIconPrinter, svgIconQuestion, svgIconQuestionWhiteG, svgIconRedClose, svgIconReload, svgIconRightChevron, svgIconRustore, svgIconSearch, svgIconSend, svgIconSetAvatar, svgIconSharedLogo, svgIconSmallRoundLoader, svgIconSort, svgIconStar, svgIconSuccessT, svgIconSun, svgIconTg, svgIconToggleArrowLeft, svgIconToggleArrowRight, svgIconTrash, svgIconTrophy, svgIconUser, svgIconUserEmpty, svgIconUserEmptyD, svgIconVk, svgIconWarningT, t };
 //# sourceMappingURL=morozeckiy-dd-lib.mjs.map