@cuby-ui/core 0.0.558 → 0.0.561

package/fesm2022/cuby-ui-core.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, inject, Renderer2, input, model, effect, Directive, InjectionToken, Input, HostBinding, ChangeDetectorRef, ViewChild, EventEmitter, Output, NgModule, Injector, Injectable, SkipSelf, Optional, DestroyRef, NgZone, signal, Self, INJECTOR, TemplateRef, forwardRef, ViewEncapsulation, computed, ContentChildren, ElementRef, HostListener, ViewContainerRef, booleanAttribute, untracked, Pipe, makeEnvironmentProviders, APP_INITIALIZER, ErrorHandler, viewChild, output } from '@angular/core';
+import { Component, ChangeDetectionStrategy, inject, Renderer2, input, model, effect, Directive, InjectionToken, Input, HostBinding, ChangeDetectorRef, ViewChild, EventEmitter, Output, NgModule, Injector, Injectable, SkipSelf, Optional, DestroyRef, NgZone, signal, Self, INJECTOR, TemplateRef, forwardRef, ViewEncapsulation, computed, ContentChildren, output, ElementRef, HostListener, ViewContainerRef, booleanAttribute, untracked, Pipe, makeEnvironmentProviders, APP_INITIALIZER, ErrorHandler, viewChild } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DOCUMENT, NgForOf, NgIf, NgComponentOutlet, NgTemplateOutlet, NgFor, NgClass, Location, UpperCasePipe, AsyncPipe, KeyValuePipe, LowerCasePipe, TitleCasePipe } from '@angular/common';
 import { DomSanitizer } from '@angular/platform-browser';
@@ -15,7 +15,7 @@ import { CuiExchangeContextApiService, CuiJTextApiService, CuiTreeStructNavigato
 import { HttpErrorResponse } from '@angular/common/http';
 import * as i4 from '@jsverse/transloco';
 import { TranslocoService, TranslocoModule, TranslocoDirective, TranslocoPipe } from '@jsverse/transloco';
-import * as i2$1 from '@angular/forms';
+import * as i5 from '@angular/forms';
 import { Validators, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule, FormControl, NonNullableFormBuilder } from '@angular/forms';
 import * as i2 from '@taiga-ui/polymorpheus';
 import { PolymorpheusComponent, injectContext, PolymorpheusOutlet, PolymorpheusTemplate } from '@taiga-ui/polymorpheus';
@@ -2536,6 +2536,219 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
             args: [{ selector: 'header[cuiContentHeader]', imports: [CuiSvgModule, CuiTooltipDirective], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"wrapper\">\n    <span class=\"heading\">\n        {{ heading() }}\n\n        @if (tooltip(); as tooltip) {\n            <cui-svg\n                icon=\"cuiIconQuestionCircleBold\"\n                [cuiTooltip]=\"tooltip\"\n            />\n        }\n    </span>\n\n    @if (subheading(); as subheading) {\n        <h2 class=\"subheading\">{{ subheading }}</h2>\n    }\n</div>\n\n<ng-content />\n", styles: [":host{display:flex;justify-content:space-between;align-items:center;gap:12px}.wrapper{display:flex;flex-direction:column;gap:4px}.heading{display:flex;flex-direction:row;gap:4px;align-items:center;justify-content:flex-start;font-weight:500;font-size:16px;line-height:24px}.subheading{font-weight:400;font-size:14px;line-height:20px;color:var(--cui-base-500)}\n"] }]
         }] });
 
+class CuiDateRangeCalendarComponent {
+    constructor() {
+        /** Selection mode: 'range' for date range, 'single' for single date */
+        this.mode = input('range');
+        /** Start date of the range */
+        this.startDate = input(null);
+        /** End date of the range */
+        this.endDate = input(null);
+        /** Selected date (for single mode) */
+        this.selectedDate = input(null);
+        /** Emitted when a date range is applied */
+        this.rangeSelected = output();
+        /** Emitted when a single date is applied */
+        this.dateSelected = output();
+        /** Emitted when the user cancels */
+        this.cancelled = output();
+        /** Currently displayed month */
+        this.currentMonth = signal(new Date());
+        /** Temporary start date (during range selection) */
+        this.tmpStartDate = signal(null);
+        /** Temporary end date (during range selection) */
+        this.tmpEndDate = signal(null);
+        /** Temporary selected date (for single mode) */
+        this.tmpSelectedDate = signal(null);
+        /** Week day labels */
+        this.weekDays = ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'];
+        /** Current month display name */
+        this.currentMonthName = computed(() => {
+            const date = this.currentMonth();
+            return date.toLocaleDateString('en-US', { month: 'long', year: 'numeric' });
+        });
+        /** Calendar days grid */
+        this.calendarDays = computed(() => {
+            const date = this.currentMonth();
+            const year = date.getFullYear();
+            const month = date.getMonth();
+            const firstDay = new Date(year, month, 1);
+            const lastDay = new Date(year, month + 1, 0);
+            // Get the day of the week for the first day (0 = Sunday, convert so Monday = 0)
+            let startDayOfWeek = firstDay.getDay() - 1;
+            if (startDayOfWeek < 0) {
+                startDayOfWeek = 6;
+            }
+            const days = [];
+            // Add previous month's trailing days
+            const prevMonthLastDay = new Date(year, month, 0).getDate();
+            for (let i = startDayOfWeek - 1; i >= 0; i--) {
+                days.push({
+                    date: new Date(year, month - 1, prevMonthLastDay - i),
+                    isCurrentMonth: false
+                });
+            }
+            // Add current month's days
+            for (let i = 1; i <= lastDay.getDate(); i++) {
+                days.push({
+                    date: new Date(year, month, i),
+                    isCurrentMonth: true
+                });
+            }
+            // Add next month's leading days to fill the grid (6 rows x 7 days = 42)
+            const remainingDays = 42 - days.length;
+            for (let i = 1; i <= remainingDays; i++) {
+                days.push({
+                    date: new Date(year, month + 1, i),
+                    isCurrentMonth: false
+                });
+            }
+            return days;
+        });
+        // Initialize temporary values from inputs via effect (signal inputs are not resolved in constructor)
+        effect(() => {
+            if (this.mode() === 'range') {
+                const start = this.startDate();
+                const end = this.endDate();
+                if (start) {
+                    this.tmpStartDate.set(start);
+                    this.currentMonth.set(new Date(start.getFullYear(), start.getMonth(), 1));
+                }
+                if (end) {
+                    this.tmpEndDate.set(end);
+                }
+            }
+            else {
+                const selected = this.selectedDate();
+                if (selected) {
+                    this.tmpSelectedDate.set(selected);
+                    this.currentMonth.set(new Date(selected.getFullYear(), selected.getMonth(), 1));
+                }
+            }
+        });
+    }
+    goToPrevMonth() {
+        const current = this.currentMonth();
+        this.currentMonth.set(new Date(current.getFullYear(), current.getMonth() - 1, 1));
+    }
+    goToNextMonth() {
+        const current = this.currentMonth();
+        this.currentMonth.set(new Date(current.getFullYear(), current.getMonth() + 1, 1));
+    }
+    selectDate(date) {
+        if (this.mode() !== 'range') {
+            // Single date mode - just select the date
+            this.tmpSelectedDate.set(date);
+            return;
+        }
+        // Range mode
+        const start = this.tmpStartDate();
+        const end = this.tmpEndDate();
+        if (!start || (start && end)) {
+            // Start a new selection
+            this.tmpStartDate.set(date);
+            this.tmpEndDate.set(null);
+        }
+        else {
+            // Complete the selection
+            if (date < start) {
+                // If selected date is before start, swap them
+                this.tmpEndDate.set(start);
+                this.tmpStartDate.set(date);
+            }
+            else {
+                this.tmpEndDate.set(date);
+            }
+        }
+    }
+    isSelected(date) {
+        if (this.mode() !== 'range') {
+            // Single date mode
+            const selected = this.tmpSelectedDate();
+            return selected !== null && this.isSameDay(date, selected);
+        }
+        // Range mode
+        const start = this.tmpStartDate();
+        const end = this.tmpEndDate();
+        if (start && this.isSameDay(date, start)) {
+            return true;
+        }
+        if (end && this.isSameDay(date, end)) {
+            return true;
+        }
+        return false;
+    }
+    isInRange(date) {
+        const start = this.tmpStartDate();
+        const end = this.tmpEndDate();
+        if (!start || !end) {
+            return false;
+        }
+        return date > start && date < end;
+    }
+    isRangeStart(date) {
+        const start = this.tmpStartDate();
+        return start !== null && this.isSameDay(date, start);
+    }
+    isRangeEnd(date) {
+        const end = this.tmpEndDate();
+        return end !== null && this.isSameDay(date, end);
+    }
+    isToday(date) {
+        return this.isSameDay(date, new Date());
+    }
+    apply() {
+        if (this.mode() !== 'range') {
+            // Single date mode
+            const selected = this.tmpSelectedDate();
+            if (selected) {
+                this.dateSelected.emit(selected);
+            }
+        }
+        else {
+            // Range mode
+            const start = this.tmpStartDate();
+            const end = this.tmpEndDate();
+            if (start && end) {
+                this.rangeSelected.emit({ start, end });
+            }
+        }
+    }
+    cancel() {
+        this.cancelled.emit();
+    }
+    hasSelection() {
+        if (this.mode() !== 'range') {
+            return this.tmpSelectedDate() !== null;
+        }
+        return this.tmpStartDate() !== null;
+    }
+    isSameDay(date1, date2) {
+        return (date1.getFullYear() === date2.getFullYear() &&
+            date1.getMonth() === date2.getMonth() &&
+            date1.getDate() === date2.getDate());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiDateRangeCalendarComponent, isStandalone: true, selector: "cui-date-range-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, startDate: { classPropertyName: "startDate", publicName: "startDate", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeSelected: "rangeSelected", dateSelected: "dateSelected", cancelled: "cancelled" }, ngImport: i0, template: "<div class=\"cui-calendar\">\n    <div class=\"cui-calendar__header\">\n        <button\n            type=\"button\"\n            class=\"cui-calendar__nav-btn\"\n            (click)=\"goToPrevMonth()\"\n        >\n            <cui-svg icon=\"cuiIconChevronLeft\" />\n        </button>\n        <span class=\"cui-calendar__month-name\">{{ currentMonthName() }}</span>\n        <button\n            type=\"button\"\n            class=\"cui-calendar__nav-btn\"\n            (click)=\"goToNextMonth()\"\n        >\n            <cui-svg icon=\"cuiIconChevronRight\" />\n        </button>\n    </div>\n\n    <div class=\"cui-calendar__weekdays\">\n        @for (day of weekDays; track day) {\n            <div class=\"cui-calendar__weekday\">{{ day }}</div>\n        }\n    </div>\n\n    <div class=\"cui-calendar__days\">\n        @for (day of calendarDays(); track day.date.getTime()) {\n            <button\n                type=\"button\"\n                class=\"cui-calendar__day\"\n                [class.cui-calendar__day--other-month]=\"!day.isCurrentMonth\"\n                [class.cui-calendar__day--selected]=\"isSelected(day.date)\"\n                [class.cui-calendar__day--in-range]=\"isInRange(day.date)\"\n                [class.cui-calendar__day--range-start]=\"isRangeStart(day.date)\"\n                [class.cui-calendar__day--range-end]=\"isRangeEnd(day.date)\"\n                [class.cui-calendar__day--today]=\"isToday(day.date)\"\n                (click)=\"selectDate(day.date)\"\n            >\n                {{ day.date.getDate() }}\n            </button>\n        }\n    </div>\n\n    <div class=\"cui-calendar__footer\">\n        <button\n            type=\"button\"\n            cuiButton\n            appearance=\"secondary\"\n            (click)=\"cancel()\"\n        >\n            Cancel\n        </button>\n        <button\n            type=\"button\"\n            cuiButton\n            appearance=\"action\"\n            [disabled]=\"!hasSelection()\"\n            (click)=\"apply()\"\n        >\n            Apply\n        </button>\n    </div>\n</div>\n", styles: [".cui-calendar{display:flex;flex-direction:column;padding:12px;min-width:280px}.cui-calendar__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cui-calendar__nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:6px;cursor:pointer;transition:background .2s}.cui-calendar__nav-btn:hover{background:var(--cui-base-100)}.cui-calendar__month-name{font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-900)}.cui-calendar__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}.cui-calendar__weekday{font-weight:500;font-size:12px;line-height:14px;display:flex;align-items:center;justify-content:center;height:32px;color:var(--cui-base-500)}.cui-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.cui-calendar__day{font-weight:400;font-size:13px;line-height:16px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:6px;cursor:pointer;transition:background .2s;color:var(--cui-base-900)}.cui-calendar__day:hover{background:var(--cui-base-100)}.cui-calendar__day--other-month{color:var(--cui-base-400)}.cui-calendar__day--today{font-weight:600;border:1px solid var(--cui-base-300)}.cui-calendar__day--selected{background:var(--cui-light-blue-600);color:var(--cui-base-0)}.cui-calendar__day--selected:hover{background:var(--cui-light-blue-700)}.cui-calendar__day--in-range{background:var(--cui-lavender-bg);border-radius:0}.cui-calendar__day--in-range:hover{background:var(--cui-base-200)}.cui-calendar__day--range-start{border-radius:6px 0 0 6px}.cui-calendar__day--range-end{border-radius:0 6px 6px 0}.cui-calendar__day--range-start.cui-calendar__day--range-end{border-radius:6px}.cui-calendar__footer{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--cui-base-200)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-date-range-calendar', standalone: true, imports: [CuiButtonModule, CuiSvgModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cui-calendar\">\n    <div class=\"cui-calendar__header\">\n        <button\n            type=\"button\"\n            class=\"cui-calendar__nav-btn\"\n            (click)=\"goToPrevMonth()\"\n        >\n            <cui-svg icon=\"cuiIconChevronLeft\" />\n        </button>\n        <span class=\"cui-calendar__month-name\">{{ currentMonthName() }}</span>\n        <button\n            type=\"button\"\n            class=\"cui-calendar__nav-btn\"\n            (click)=\"goToNextMonth()\"\n        >\n            <cui-svg icon=\"cuiIconChevronRight\" />\n        </button>\n    </div>\n\n    <div class=\"cui-calendar__weekdays\">\n        @for (day of weekDays; track day) {\n            <div class=\"cui-calendar__weekday\">{{ day }}</div>\n        }\n    </div>\n\n    <div class=\"cui-calendar__days\">\n        @for (day of calendarDays(); track day.date.getTime()) {\n            <button\n                type=\"button\"\n                class=\"cui-calendar__day\"\n                [class.cui-calendar__day--other-month]=\"!day.isCurrentMonth\"\n                [class.cui-calendar__day--selected]=\"isSelected(day.date)\"\n                [class.cui-calendar__day--in-range]=\"isInRange(day.date)\"\n                [class.cui-calendar__day--range-start]=\"isRangeStart(day.date)\"\n                [class.cui-calendar__day--range-end]=\"isRangeEnd(day.date)\"\n                [class.cui-calendar__day--today]=\"isToday(day.date)\"\n                (click)=\"selectDate(day.date)\"\n            >\n                {{ day.date.getDate() }}\n            </button>\n        }\n    </div>\n\n    <div class=\"cui-calendar__footer\">\n        <button\n            type=\"button\"\n            cuiButton\n            appearance=\"secondary\"\n            (click)=\"cancel()\"\n        >\n            Cancel\n        </button>\n        <button\n            type=\"button\"\n            cuiButton\n            appearance=\"action\"\n            [disabled]=\"!hasSelection()\"\n            (click)=\"apply()\"\n        >\n            Apply\n        </button>\n    </div>\n</div>\n", styles: [".cui-calendar{display:flex;flex-direction:column;padding:12px;min-width:280px}.cui-calendar__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cui-calendar__nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:6px;cursor:pointer;transition:background .2s}.cui-calendar__nav-btn:hover{background:var(--cui-base-100)}.cui-calendar__month-name{font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-900)}.cui-calendar__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}.cui-calendar__weekday{font-weight:500;font-size:12px;line-height:14px;display:flex;align-items:center;justify-content:center;height:32px;color:var(--cui-base-500)}.cui-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.cui-calendar__day{font-weight:400;font-size:13px;line-height:16px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:6px;cursor:pointer;transition:background .2s;color:var(--cui-base-900)}.cui-calendar__day:hover{background:var(--cui-base-100)}.cui-calendar__day--other-month{color:var(--cui-base-400)}.cui-calendar__day--today{font-weight:600;border:1px solid var(--cui-base-300)}.cui-calendar__day--selected{background:var(--cui-light-blue-600);color:var(--cui-base-0)}.cui-calendar__day--selected:hover{background:var(--cui-light-blue-700)}.cui-calendar__day--in-range{background:var(--cui-lavender-bg);border-radius:0}.cui-calendar__day--in-range:hover{background:var(--cui-base-200)}.cui-calendar__day--range-start{border-radius:6px 0 0 6px}.cui-calendar__day--range-end{border-radius:0 6px 6px 0}.cui-calendar__day--range-start.cui-calendar__day--range-end{border-radius:6px}.cui-calendar__footer{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--cui-base-200)}\n"] }]
+        }], ctorParameters: () => [] });
+
+class CuiDateRangeCalendarModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarModule, imports: [CuiDateRangeCalendarComponent], exports: [CuiDateRangeCalendarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarModule, imports: [CuiDateRangeCalendarComponent] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CuiDateRangeCalendarComponent],
+                    exports: [CuiDateRangeCalendarComponent]
+                }]
+        }] });
+
 const CUI_ROOT_SELECTOR = 'cui-root';
 
 const CUI_DIALOGS = cuiCreateToken(new BehaviorSubject([]));
@@ -3249,7 +3462,7 @@ class CuiInputNumberComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n    *ngIf=\"iconLeft\"\n    [icon]=\"iconLeft\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    #input\n    [ngModel]=\"value\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    type=\"text\"\n    [maskito]=\"maskOptions\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n    *ngIf=\"iconLeft\"\n    [icon]=\"iconLeft\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    #input\n    [ngModel]=\"value\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    type=\"text\"\n    [maskito]=\"maskOptions\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
             type: Component,
@@ -3391,7 +3604,7 @@ class CuiInputPasswordComponent {
         this.isPasswordHidden = !this.isPasswordHidden;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputPasswordComponent, selector: "cui-input-password", host: { properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)], ngImport: i0, template: "<cui-svg\n    *ngIf=\"iconLeft\"\n    [icon]=\"iconLeft\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    [ngModel]=\"value\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    [type]=\"type\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n<button\n    *ngIf=\"isToggleButtonShown\"\n    [title]=\"buttonTitle\"\n    class=\"c-button\"\n    (click)=\"onTogglePasswordVisibility()\"\n>\n    <cui-svg\n        [icon]=\"icon\"\n        [width]=\"16\"\n        [height]=\"16\"\n        color=\"var(--cui-base-500)\"\n    ></cui-svg>\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputPasswordComponent, selector: "cui-input-password", host: { properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)], ngImport: i0, template: "<cui-svg\n    *ngIf=\"iconLeft\"\n    [icon]=\"iconLeft\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    [ngModel]=\"value\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    [type]=\"type\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n<button\n    *ngIf=\"isToggleButtonShown\"\n    [title]=\"buttonTitle\"\n    class=\"c-button\"\n    (click)=\"onTogglePasswordVisibility()\"\n>\n    <cui-svg\n        [icon]=\"icon\"\n        [width]=\"16\"\n        [height]=\"16\"\n        color=\"var(--cui-base-500)\"\n    ></cui-svg>\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputPasswordComponent, decorators: [{
             type: Component,
@@ -3474,7 +3687,7 @@ class CuiInputTextComponent {
         this.onChange(value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTextComponent, selector: "cui-input-text", host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n    *ngIf=\"iconLeft\"\n    [icon]=\"iconLeft\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    #input\n    [ngModel]=\"value\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    type=\"text\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n<button\n    type=\"button\"\n    class=\"c-button\"\n    [class.c-button_hidden]=\"isClearButtonHidden\"\n    (click)=\"onClear()\"\n>\n    <cui-svg\n        icon=\"cuiIconClear\"\n        color=\"var(--cui-base-300)\"\n        class=\"c-close-icon\"\n    />\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTextComponent, selector: "cui-input-text", host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n    *ngIf=\"iconLeft\"\n    [icon]=\"iconLeft\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    #input\n    [ngModel]=\"value\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    type=\"text\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n<button\n    type=\"button\"\n    class=\"c-button\"\n    [class.c-button_hidden]=\"isClearButtonHidden\"\n    (click)=\"onClear()\"\n>\n    <cui-svg\n        icon=\"cuiIconClear\"\n        color=\"var(--cui-base-300)\"\n        class=\"c-close-icon\"\n    />\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTextComponent, decorators: [{
             type: Component,
@@ -3576,7 +3789,7 @@ class CuiInputTimeComponent {
         return maskitoTimeOptionsGenerator({ mode });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n    icon=\"cuiIconClock\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    #input\n    [ngModel]=\"computedValue\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    type=\"text\"\n    [maskito]=\"maskOptions\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n    icon=\"cuiIconClock\"\n    color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n    #input\n    [ngModel]=\"computedValue\"\n    [attr.id]=\"id\"\n    [attr.placeholder]=\"placeholder\"\n    type=\"text\"\n    [maskito]=\"maskOptions\"\n    [disabled]=\"isDisabled\"\n    class=\"c-input\"\n    (input)=\"onInput($event)\"\n    (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTimeComponent, decorators: [{
             type: Component,
@@ -4450,6 +4663,603 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
             args: [{ selector: 'cui-file-icon', imports: [CuiSvgModule], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (extensionColor(); as color) {\n    <cui-svg\n        icon=\"cuiIconBoldFileDefaultSm\"\n        [color]=\"color\"\n        class=\"icon\"\n    ></cui-svg>\n\n    <span class=\"extension\">{{ extension() }}</span>\n}\n", styles: [":host{--c-text-color: var(--cui-base-0);position:relative;display:inline-block}:host .extension{font-size:10px;line-height:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:absolute;bottom:4px;left:5px;display:inline-block;font-family:var(--cui-nunito-italic-font);font-weight:800;font-style:italic;max-width:30px;color:var(--c-text-color);text-transform:uppercase;transform:scale(.5);transform-origin:left bottom}\n"] }]
         }] });
 
+class CuiFilterRemoveButtonComponent {
+    constructor() {
+        this.label = input.required();
+        this.removed = output();
+    }
+    onRemove() {
+        this.removed.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterRemoveButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiFilterRemoveButtonComponent, isStandalone: true, selector: "cui-filter-remove-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { removed: "removed" }, ngImport: i0, template: "<button\n    type=\"button\"\n    class=\"filter-remove-button\"\n>\n    <cui-svg\n        icon=\"cuiIconVector\"\n        (click)=\"onRemove(); $event.stopPropagation()\"\n    />\n    <span class=\"filter-remove-button__label\">{{ label() }}:</span>\n</button>\n", styles: [":host{display:contents}.filter-remove-button{display:flex;flex-direction:row;gap:4px;align-items:center;justify-content:flex-start;padding-right:6px;padding-left:6px;font-weight:500;font-size:12px;line-height:14px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-left-radius:8px;border-bottom-left-radius:8px;cursor:pointer}.filter-remove-button:hover,.filter-remove-button:focus{outline:none}.filter-remove-button__label{font-weight:500;font-size:12px;line-height:14px}\n"], dependencies: [{ kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterRemoveButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-filter-remove-button', standalone: true, imports: [CuiSvgModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n    type=\"button\"\n    class=\"filter-remove-button\"\n>\n    <cui-svg\n        icon=\"cuiIconVector\"\n        (click)=\"onRemove(); $event.stopPropagation()\"\n    />\n    <span class=\"filter-remove-button__label\">{{ label() }}:</span>\n</button>\n", styles: [":host{display:contents}.filter-remove-button{display:flex;flex-direction:row;gap:4px;align-items:center;justify-content:flex-start;padding-right:6px;padding-left:6px;font-weight:500;font-size:12px;line-height:14px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-left-radius:8px;border-bottom-left-radius:8px;cursor:pointer}.filter-remove-button:hover,.filter-remove-button:focus{outline:none}.filter-remove-button__label{font-weight:500;font-size:12px;line-height:14px}\n"] }]
+        }] });
+
+class CuiStringFilterComponent {
+    constructor() {
+        this.filter = input.required();
+        this.removed = output();
+        this.changed = output();
+        this.tmpValue = signal('');
+        this.currentValue = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'string' ? f.value.value : '';
+        });
+        this.hasValue = computed(() => !!this.currentValue());
+    }
+    onRemove() {
+        this.removed.emit(this.filter().id);
+    }
+    onDropdownOpened(opened) {
+        if (opened) {
+            this.tmpValue.set(this.currentValue());
+        }
+    }
+    onTmpValueChange(value) {
+        this.tmpValue.set(value);
+    }
+    applyValue(dropdown) {
+        const f = this.filter();
+        if (f.value.type !== 'string') {
+            return;
+        }
+        this.changed.emit({
+            ...f,
+            value: { ...f.value, value: this.tmpValue() }
+        });
+        dropdown.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiStringFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiStringFilterComponent, isStandalone: true, selector: "cui-string-filter", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { removed: "removed", changed: "changed" }, ngImport: i0, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"string-filter__trigger\"\n    [class.string-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n    #dropdown=\"cuiDropdown\"\n    (isOpened)=\"onDropdownOpened($event)\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"string-filter__value\"\n            [cuiTooltip]=\"currentValue()\"\n        >\n            {{ currentValue() }}\n        </span>\n    } @else {\n        <span class=\"string-filter__placeholder\">{{ 'ENTER_VALUE' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"string-filter__dropdown\">\n        <div class=\"string-filter__label\">\n            {{ 'FILTER_BY' | transloco: { field: filter().field.label | transloco } }}\n        </div>\n        <cui-input-text\n            [ngModel]=\"tmpValue()\"\n            (ngModelChange)=\"onTmpValueChange($event)\"\n            maxlength=\"25\"\n            [cuiTextFieldPlaceholder]=\"'ENTER_VALUE' | transloco\"\n        />\n        <div class=\"string-filter__footer\">\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"secondary\"\n                (click)=\"dropdown.close()\"\n            >\n                {{ 'CANCEL' | transloco }}\n            </button>\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"action-cyan\"\n                (click)=\"applyValue(dropdown)\"\n            >\n                {{ 'APPLY' | transloco }}\n            </button>\n        </div>\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.string-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.string-filter__trigger:hover{background:var(--cui-base-200)}.string-filter__trigger:focus{outline:none}.string-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.string-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.string-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.string-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.string-filter__dropdown{display:flex;flex-direction:column;gap:12px;padding:8px;width:300px;max-width:calc(100vw - 16px);background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.string-filter__label{font-weight:500;font-size:13px;line-height:16px;color:var(--cui-base-900)}.string-filter__footer{display:flex;flex-direction:row;gap:8px;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiDropdownDirective, selector: "[cuiDropdown]", inputs: ["cuiDropdown", "orientation"], outputs: ["isOpened"], exportAs: ["cuiDropdown"] }, { kind: "component", type: CuiFilterRemoveButtonComponent, selector: "cui-filter-remove-button", inputs: ["label"], outputs: ["removed"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: CuiTooltipDirective, selector: "[cuiTooltip]:not(ng-container):not(ng-template)", inputs: ["cuiTooltipContext", "cuiTooltipAppearance", "cuiTooltip"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiStringFilterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-string-filter', standalone: true, imports: [
+                        CuiButtonModule,
+                        CuiDropdownDirective,
+                        CuiFilterRemoveButtonComponent,
+                        CuiInputModule,
+                        CuiSvgModule,
+                        CuiTooltipDirective,
+                        FormsModule,
+                        TranslocoPipe
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"string-filter__trigger\"\n    [class.string-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n    #dropdown=\"cuiDropdown\"\n    (isOpened)=\"onDropdownOpened($event)\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"string-filter__value\"\n            [cuiTooltip]=\"currentValue()\"\n        >\n            {{ currentValue() }}\n        </span>\n    } @else {\n        <span class=\"string-filter__placeholder\">{{ 'ENTER_VALUE' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"string-filter__dropdown\">\n        <div class=\"string-filter__label\">\n            {{ 'FILTER_BY' | transloco: { field: filter().field.label | transloco } }}\n        </div>\n        <cui-input-text\n            [ngModel]=\"tmpValue()\"\n            (ngModelChange)=\"onTmpValueChange($event)\"\n            maxlength=\"25\"\n            [cuiTextFieldPlaceholder]=\"'ENTER_VALUE' | transloco\"\n        />\n        <div class=\"string-filter__footer\">\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"secondary\"\n                (click)=\"dropdown.close()\"\n            >\n                {{ 'CANCEL' | transloco }}\n            </button>\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"action-cyan\"\n                (click)=\"applyValue(dropdown)\"\n            >\n                {{ 'APPLY' | transloco }}\n            </button>\n        </div>\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.string-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.string-filter__trigger:hover{background:var(--cui-base-200)}.string-filter__trigger:focus{outline:none}.string-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.string-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.string-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.string-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.string-filter__dropdown{display:flex;flex-direction:column;gap:12px;padding:8px;width:300px;max-width:calc(100vw - 16px);background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.string-filter__label{font-weight:500;font-size:13px;line-height:16px;color:var(--cui-base-900)}.string-filter__footer{display:flex;flex-direction:row;gap:8px;justify-content:flex-end}\n"] }]
+        }] });
+
+class CuiRangeFilterComponent {
+    constructor() {
+        this.filter = input.required();
+        this.removed = output();
+        this.changed = output();
+        this.tmpMin = signal(null);
+        this.tmpMax = signal(null);
+        this.currentMin = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'range' ? f.value.min : null;
+        });
+        this.currentMax = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'range' ? f.value.max : null;
+        });
+        this.hasValue = computed(() => this.currentMin() !== null || this.currentMax() !== null);
+        this.displayValue = computed(() => {
+            const min = this.currentMin();
+            const max = this.currentMax();
+            if (min !== null && max !== null) {
+                return `${min} – ${max}`;
+            }
+            if (min !== null) {
+                return `≥ ${min}`;
+            }
+            if (max !== null) {
+                return `≤ ${max}`;
+            }
+            return '';
+        });
+        this.minPlaceholder = computed(() => {
+            const field = this.filter().field;
+            return field.rangeConfig?.minPlaceholder ?? 'MIN';
+        });
+        this.maxPlaceholder = computed(() => {
+            const field = this.filter().field;
+            return field.rangeConfig?.maxPlaceholder ?? 'MAX';
+        });
+    }
+    onRemove() {
+        this.removed.emit(this.filter().id);
+    }
+    onDropdownOpened(isOpened) {
+        if (isOpened) {
+            this.tmpMin.set(this.currentMin());
+            this.tmpMax.set(this.currentMax());
+        }
+    }
+    onTmpMinChange(value) {
+        this.tmpMin.set(value);
+    }
+    onTmpMaxChange(value) {
+        this.tmpMax.set(value);
+    }
+    applyValue(dropdown) {
+        const f = this.filter();
+        if (f.value.type !== 'range') {
+            return;
+        }
+        const newValue = {
+            type: 'range',
+            min: this.tmpMin(),
+            max: this.tmpMax()
+        };
+        this.changed.emit({ ...f, value: newValue });
+        dropdown.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiRangeFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiRangeFilterComponent, isStandalone: true, selector: "cui-range-filter", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { removed: "removed", changed: "changed" }, ngImport: i0, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"range-filter__trigger\"\n    [class.range-filter__trigger_active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n    #dropdown=\"cuiDropdown\"\n    (isOpened)=\"onDropdownOpened($event)\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"range-filter__value\"\n            [cuiTooltip]=\"displayValue()\"\n        >\n            {{ displayValue() }}\n        </span>\n    } @else {\n        <span class=\"range-filter__placeholder\">{{ 'ENTER_VALUE' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"range-filter__dropdown\">\n        <div class=\"range-filter__label\">\n            {{ 'FILTER_BY' | transloco: { field: filter().field.label | transloco } }}\n        </div>\n        <div class=\"range-filter__inputs\">\n            <cui-input-number\n                [ngModel]=\"tmpMin()\"\n                (ngModelChange)=\"onTmpMinChange($event)\"\n                [cuiTextFieldPlaceholder]=\"minPlaceholder() | transloco\"\n            />\n            <span class=\"range-filter__separator\">\u2013</span>\n            <cui-input-number\n                [ngModel]=\"tmpMax()\"\n                (ngModelChange)=\"onTmpMaxChange($event)\"\n                [cuiTextFieldPlaceholder]=\"maxPlaceholder() | transloco\"\n            />\n        </div>\n        <div class=\"range-filter__footer\">\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"secondary\"\n                (click)=\"dropdown.close()\"\n            >\n                {{ 'CANCEL' | transloco }}\n            </button>\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"action-cyan\"\n                (click)=\"applyValue(dropdown)\"\n            >\n                {{ 'APPLY' | transloco }}\n            </button>\n        </div>\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.range-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.range-filter__trigger:hover{background:var(--cui-base-200)}.range-filter__trigger:focus{outline:none}.range-filter__trigger_active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.range-filter__trigger_active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.range-filter__value{font-weight:500;font-size:12px;line-height:14px;max-width:200px;overflow:hidden;color:var(--cui-base-900);text-overflow:ellipsis;white-space:nowrap}.range-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.range-filter__dropdown{display:flex;flex-direction:column;gap:12px;padding:8px;width:300px;max-width:calc(100vw - 16px);overflow:hidden;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026}.range-filter__label{font-weight:500;font-size:13px;line-height:16px;color:var(--cui-base-900)}.range-filter__inputs{display:flex;flex-direction:row;gap:8px;align-items:center}.range-filter__separator{font-weight:500;font-size:13px;line-height:16px;color:var(--cui-base-500)}.range-filter__footer{display:flex;flex-direction:row;gap:8px;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiDropdownDirective, selector: "[cuiDropdown]", inputs: ["cuiDropdown", "orientation"], outputs: ["isOpened"], exportAs: ["cuiDropdown"] }, { kind: "component", type: CuiFilterRemoveButtonComponent, selector: "cui-filter-remove-button", inputs: ["label"], outputs: ["removed"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: CuiTooltipDirective, selector: "[cuiTooltip]:not(ng-container):not(ng-template)", inputs: ["cuiTooltipContext", "cuiTooltipAppearance", "cuiTooltip"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiRangeFilterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-range-filter', standalone: true, imports: [
+                        CuiButtonModule,
+                        CuiDropdownDirective,
+                        CuiFilterRemoveButtonComponent,
+                        CuiInputNumberModule,
+                        CuiSvgModule,
+                        CuiTooltipDirective,
+                        FormsModule,
+                        TranslocoPipe
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"range-filter__trigger\"\n    [class.range-filter__trigger_active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n    #dropdown=\"cuiDropdown\"\n    (isOpened)=\"onDropdownOpened($event)\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"range-filter__value\"\n            [cuiTooltip]=\"displayValue()\"\n        >\n            {{ displayValue() }}\n        </span>\n    } @else {\n        <span class=\"range-filter__placeholder\">{{ 'ENTER_VALUE' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"range-filter__dropdown\">\n        <div class=\"range-filter__label\">\n            {{ 'FILTER_BY' | transloco: { field: filter().field.label | transloco } }}\n        </div>\n        <div class=\"range-filter__inputs\">\n            <cui-input-number\n                [ngModel]=\"tmpMin()\"\n                (ngModelChange)=\"onTmpMinChange($event)\"\n                [cuiTextFieldPlaceholder]=\"minPlaceholder() | transloco\"\n            />\n            <span class=\"range-filter__separator\">\u2013</span>\n            <cui-input-number\n                [ngModel]=\"tmpMax()\"\n                (ngModelChange)=\"onTmpMaxChange($event)\"\n                [cuiTextFieldPlaceholder]=\"maxPlaceholder() | transloco\"\n            />\n        </div>\n        <div class=\"range-filter__footer\">\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"secondary\"\n                (click)=\"dropdown.close()\"\n            >\n                {{ 'CANCEL' | transloco }}\n            </button>\n            <button\n                type=\"button\"\n                cuiButton\n                size=\"xs\"\n                appearance=\"action-cyan\"\n                (click)=\"applyValue(dropdown)\"\n            >\n                {{ 'APPLY' | transloco }}\n            </button>\n        </div>\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.range-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.range-filter__trigger:hover{background:var(--cui-base-200)}.range-filter__trigger:focus{outline:none}.range-filter__trigger_active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.range-filter__trigger_active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.range-filter__value{font-weight:500;font-size:12px;line-height:14px;max-width:200px;overflow:hidden;color:var(--cui-base-900);text-overflow:ellipsis;white-space:nowrap}.range-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.range-filter__dropdown{display:flex;flex-direction:column;gap:12px;padding:8px;width:300px;max-width:calc(100vw - 16px);overflow:hidden;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026}.range-filter__label{font-weight:500;font-size:13px;line-height:16px;color:var(--cui-base-900)}.range-filter__inputs{display:flex;flex-direction:row;gap:8px;align-items:center}.range-filter__separator{font-weight:500;font-size:13px;line-height:16px;color:var(--cui-base-500)}.range-filter__footer{display:flex;flex-direction:row;gap:8px;justify-content:flex-end}\n"] }]
+        }] });
+
+class CuiSelectFilterComponent {
+    constructor() {
+        this.filter = input.required();
+        this.removed = output();
+        this.changed = output();
+        this.currentValue = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'select' ? f.value.value : null;
+        });
+        this.currentLabel = computed(() => {
+            const f = this.filter();
+            if (f.value.type !== 'select' || !f.value.value) {
+                return '';
+            }
+            const selectedValue = f.value.value;
+            const field = f.field;
+            return field.selectOptions?.find((opt) => opt.value === selectedValue)?.label ?? selectedValue;
+        });
+        this.hasValue = computed(() => !!this.currentValue());
+        this.options = computed(() => {
+            const field = this.filter().field;
+            return field.selectOptions ?? [];
+        });
+    }
+    onRemove() {
+        this.removed.emit(this.filter().id);
+    }
+    isOptionSelected(value) {
+        return this.currentValue() === value;
+    }
+    selectOption(value, dropdown) {
+        const f = this.filter();
+        if (f.value.type !== 'select') {
+            return;
+        }
+        this.changed.emit({
+            ...f,
+            value: { ...f.value, value: f.value.value === value ? null : value }
+        });
+        dropdown.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiSelectFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiSelectFilterComponent, isStandalone: true, selector: "cui-select-filter", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { removed: "removed", changed: "changed" }, ngImport: i0, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"select-filter__trigger\"\n    [class.select-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n    #dropdown=\"cuiDropdown\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"select-filter__value\"\n            [cuiTooltip]=\"currentLabel()\"\n        >\n            {{ currentLabel() }}\n        </span>\n    } @else {\n        <span class=\"select-filter__placeholder\">{{ 'SELECT_VALUE' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"select-filter__dropdown\">\n        @for (opt of options(); track opt.value) {\n            <button\n                type=\"button\"\n                class=\"select-filter__option\"\n                [class.select-filter__option--selected]=\"isOptionSelected(opt.value)\"\n                (click)=\"selectOption(opt.value, dropdown)\"\n            >\n                {{ opt.label }}\n            </button>\n        }\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.select-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.select-filter__trigger:hover{background:var(--cui-base-200)}.select-filter__trigger:focus{outline:none}.select-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.select-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.select-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.select-filter__dropdown{display:flex;flex-direction:column;gap:0;padding-top:4px;padding-bottom:4px;min-width:165px;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.select-filter__option{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:flex-start;border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:400;font-size:13px;line-height:16px;padding:8px 12px;width:100%;text-align:left;color:var(--cui-base-900);cursor:pointer;-webkit-user-select:none;user-select:none}.select-filter__option:hover{background:var(--cui-base-50)}.select-filter__option--selected{background:var(--cui-lavender-bg);font-weight:500}\n"], dependencies: [{ kind: "directive", type: CuiDropdownDirective, selector: "[cuiDropdown]", inputs: ["cuiDropdown", "orientation"], outputs: ["isOpened"], exportAs: ["cuiDropdown"] }, { kind: "component", type: CuiFilterRemoveButtonComponent, selector: "cui-filter-remove-button", inputs: ["label"], outputs: ["removed"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: CuiTooltipDirective, selector: "[cuiTooltip]:not(ng-container):not(ng-template)", inputs: ["cuiTooltipContext", "cuiTooltipAppearance", "cuiTooltip"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiSelectFilterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-select-filter', standalone: true, imports: [
+                        CuiDropdownDirective,
+                        CuiFilterRemoveButtonComponent,
+                        CuiSvgModule,
+                        CuiTooltipDirective,
+                        TranslocoPipe
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"select-filter__trigger\"\n    [class.select-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n    #dropdown=\"cuiDropdown\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"select-filter__value\"\n            [cuiTooltip]=\"currentLabel()\"\n        >\n            {{ currentLabel() }}\n        </span>\n    } @else {\n        <span class=\"select-filter__placeholder\">{{ 'SELECT_VALUE' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"select-filter__dropdown\">\n        @for (opt of options(); track opt.value) {\n            <button\n                type=\"button\"\n                class=\"select-filter__option\"\n                [class.select-filter__option--selected]=\"isOptionSelected(opt.value)\"\n                (click)=\"selectOption(opt.value, dropdown)\"\n            >\n                {{ opt.label }}\n            </button>\n        }\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.select-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.select-filter__trigger:hover{background:var(--cui-base-200)}.select-filter__trigger:focus{outline:none}.select-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.select-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.select-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.select-filter__dropdown{display:flex;flex-direction:column;gap:0;padding-top:4px;padding-bottom:4px;min-width:165px;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.select-filter__option{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:flex-start;border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:400;font-size:13px;line-height:16px;padding:8px 12px;width:100%;text-align:left;color:var(--cui-base-900);cursor:pointer;-webkit-user-select:none;user-select:none}.select-filter__option:hover{background:var(--cui-base-50)}.select-filter__option--selected{background:var(--cui-lavender-bg);font-weight:500}\n"] }]
+        }] });
+
+class CuiMultiSelectFilterComponent {
+    constructor() {
+        this.filter = input.required();
+        this.removed = output();
+        this.changed = output();
+        this.currentValues = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'multiselect' ? f.value.values : [];
+        });
+        this.currentLabels = computed(() => {
+            const f = this.filter();
+            if (f.value.type !== 'multiselect') {
+                return '';
+            }
+            const field = f.field;
+            return f.value.values
+                .map((val) => field.multiSelectOptions?.find((opt) => opt.value === val)?.label ?? val)
+                .join(', ');
+        });
+        this.hasValue = computed(() => this.currentValues().length > 0);
+        this.options = computed(() => {
+            const field = this.filter().field;
+            return field.multiSelectOptions ?? [];
+        });
+    }
+    onRemove() {
+        this.removed.emit(this.filter().id);
+    }
+    isOptionSelected(value) {
+        return this.currentValues().includes(value);
+    }
+    toggleOption(value) {
+        const f = this.filter();
+        if (f.value.type !== 'multiselect') {
+            return;
+        }
+        const currentValues = f.value.values;
+        const newValues = currentValues.includes(value)
+            ? currentValues.filter((v) => v !== value)
+            : [...currentValues, value];
+        this.changed.emit({
+            ...f,
+            value: { ...f.value, values: newValues }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiMultiSelectFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiMultiSelectFilterComponent, isStandalone: true, selector: "cui-multiselect-filter", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { removed: "removed", changed: "changed" }, ngImport: i0, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"multiselect-filter__trigger\"\n    [class.multiselect-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"multiselect-filter__value\"\n            [cuiTooltip]=\"currentLabels()\"\n        >\n            {{ currentLabels() }}\n        </span>\n    } @else {\n        <span class=\"multiselect-filter__placeholder\">{{ 'SELECT_VALUES' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"multiselect-filter__dropdown\">\n        @for (opt of options(); track opt.value) {\n            <label class=\"multiselect-filter__option\">\n                <input\n                    type=\"checkbox\"\n                    cuiCheckbox\n                    [checked]=\"isOptionSelected(opt.value)\"\n                    (change)=\"toggleOption(opt.value)\"\n                />\n                <span>{{ opt.label }}</span>\n            </label>\n        }\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.multiselect-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.multiselect-filter__trigger:hover{background:var(--cui-base-200)}.multiselect-filter__trigger:focus{outline:none}.multiselect-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.multiselect-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.multiselect-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.multiselect-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.multiselect-filter__dropdown{display:flex;flex-direction:column;gap:0;padding-top:4px;padding-bottom:4px;min-width:165px;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.multiselect-filter__option{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;padding:8px 12px;cursor:pointer;-webkit-user-select:none;user-select:none}.multiselect-filter__option:hover{background:var(--cui-base-50)}.multiselect-filter__option span{font-weight:400;font-size:13px;line-height:16px;color:var(--cui-base-900)}\n"], dependencies: [{ kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "directive", type: CuiDropdownDirective, selector: "[cuiDropdown]", inputs: ["cuiDropdown", "orientation"], outputs: ["isOpened"], exportAs: ["cuiDropdown"] }, { kind: "component", type: CuiFilterRemoveButtonComponent, selector: "cui-filter-remove-button", inputs: ["label"], outputs: ["removed"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: CuiTooltipDirective, selector: "[cuiTooltip]:not(ng-container):not(ng-template)", inputs: ["cuiTooltipContext", "cuiTooltipAppearance", "cuiTooltip"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiMultiSelectFilterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-multiselect-filter', standalone: true, imports: [
+                        CuiCheckboxModule,
+                        CuiDropdownDirective,
+                        CuiFilterRemoveButtonComponent,
+                        CuiSvgModule,
+                        CuiTooltipDirective,
+                        TranslocoPipe
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label | transloco\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"multiselect-filter__trigger\"\n    [class.multiselect-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"dropdownTpl\"\n>\n    @if (hasValue()) {\n        <span\n            class=\"multiselect-filter__value\"\n            [cuiTooltip]=\"currentLabels()\"\n        >\n            {{ currentLabels() }}\n        </span>\n    } @else {\n        <span class=\"multiselect-filter__placeholder\">{{ 'SELECT_VALUES' | transloco }}</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #dropdownTpl>\n    <div class=\"multiselect-filter__dropdown\">\n        @for (opt of options(); track opt.value) {\n            <label class=\"multiselect-filter__option\">\n                <input\n                    type=\"checkbox\"\n                    cuiCheckbox\n                    [checked]=\"isOptionSelected(opt.value)\"\n                    (change)=\"toggleOption(opt.value)\"\n                />\n                <span>{{ opt.label }}</span>\n            </label>\n        }\n    </div>\n</ng-template>", styles: [":host{display:inline-flex}.multiselect-filter__trigger{padding:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.multiselect-filter__trigger:hover{background:var(--cui-base-200)}.multiselect-filter__trigger:focus{outline:none}.multiselect-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.multiselect-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.multiselect-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.multiselect-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.multiselect-filter__dropdown{display:flex;flex-direction:column;gap:0;padding-top:4px;padding-bottom:4px;min-width:165px;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.multiselect-filter__option{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;padding:8px 12px;cursor:pointer;-webkit-user-select:none;user-select:none}.multiselect-filter__option:hover{background:var(--cui-base-50)}.multiselect-filter__option span{font-weight:400;font-size:13px;line-height:16px;color:var(--cui-base-900)}\n"] }]
+        }] });
+
+class CuiAddFilterButtonComponent {
+    constructor() {
+        this.availableFields = input.required();
+        this.fieldSelected = output();
+    }
+    selectField(field, dropdown) {
+        this.fieldSelected.emit(field);
+        dropdown.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiAddFilterButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiAddFilterButtonComponent, isStandalone: true, selector: "cui-add-filter-button", inputs: { availableFields: { classPropertyName: "availableFields", publicName: "availableFields", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { fieldSelected: "fieldSelected" }, ngImport: i0, template: "<div class=\"cui-add-filter\">\n    <button\n        type=\"button\"\n        class=\"cui-add-filter__btn\"\n        cuiButton\n        size=\"xxs\"\n        appearance=\"outlined\"\n        [cuiDropdown]=\"dropdownTpl\"\n        #dropdown=\"cuiDropdown\"\n    >\n        <cui-svg\n            icon=\"cuiIconPlusSm\"\n            [width]=\"16\"\n            color=\"var(--cui-info)\"\n        />\n        {{ 'ADD_FILTER' | transloco }}\n    </button>\n    <ng-template #dropdownTpl>\n        <div class=\"cui-add-filter__dropdown\">\n            @for (field of availableFields(); track field.id) {\n                <button\n                    type=\"button\"\n                    class=\"cui-add-filter__dropdown-item\"\n                    (click)=\"selectField(field, dropdown)\"\n                >\n                    {{ field.label | transloco }}\n                </button>\n            }\n        </div>\n    </ng-template>\n</div>", styles: [".cui-add-filter{position:relative;align-self:flex-start}.cui-add-filter__btn{color:var(--cui-light-blue-600)}.cui-add-filter__dropdown{padding-top:4px;padding-bottom:4px;display:flex;flex-direction:column;gap:0;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;min-width:200px;overflow:hidden}.cui-add-filter__dropdown-item{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-size:14px;line-height:20px;padding:8px 12px;display:block;width:100%;text-align:left;color:var(--cui-base-900);cursor:pointer}.cui-add-filter__dropdown-item:hover{background:var(--cui-base-50)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiDropdownDirective, selector: "[cuiDropdown]", inputs: ["cuiDropdown", "orientation"], outputs: ["isOpened"], exportAs: ["cuiDropdown"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiAddFilterButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-add-filter-button', standalone: true, imports: [CuiButtonModule, CuiDropdownDirective, CuiSvgModule, TranslocoPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cui-add-filter\">\n    <button\n        type=\"button\"\n        class=\"cui-add-filter__btn\"\n        cuiButton\n        size=\"xxs\"\n        appearance=\"outlined\"\n        [cuiDropdown]=\"dropdownTpl\"\n        #dropdown=\"cuiDropdown\"\n    >\n        <cui-svg\n            icon=\"cuiIconPlusSm\"\n            [width]=\"16\"\n            color=\"var(--cui-info)\"\n        />\n        {{ 'ADD_FILTER' | transloco }}\n    </button>\n    <ng-template #dropdownTpl>\n        <div class=\"cui-add-filter__dropdown\">\n            @for (field of availableFields(); track field.id) {\n                <button\n                    type=\"button\"\n                    class=\"cui-add-filter__dropdown-item\"\n                    (click)=\"selectField(field, dropdown)\"\n                >\n                    {{ field.label | transloco }}\n                </button>\n            }\n        </div>\n    </ng-template>\n</div>", styles: [".cui-add-filter{position:relative;align-self:flex-start}.cui-add-filter__btn{color:var(--cui-light-blue-600)}.cui-add-filter__dropdown{padding-top:4px;padding-bottom:4px;display:flex;flex-direction:column;gap:0;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;min-width:200px;overflow:hidden}.cui-add-filter__dropdown-item{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-size:14px;line-height:20px;padding:8px 12px;display:block;width:100%;text-align:left;color:var(--cui-base-900);cursor:pointer}.cui-add-filter__dropdown-item:hover{background:var(--cui-base-50)}\n"] }]
+        }] });
+
+const DEFAULT_OPERATOR_LABELS = {
+    on: 'On',
+    before: 'Before',
+    after: 'After',
+    between: 'Between'
+};
+class CuiDateFilterComponent {
+    constructor() {
+        this.filter = input.required();
+        this.removed = output();
+        this.changed = output();
+        this.operatorOptions = computed(() => {
+            const field = this.filter().field;
+            const operators = field.dateOperators ?? ['on', 'before', 'after', 'between'];
+            return operators.map((op) => ({
+                value: op,
+                label: field.operatorLabels?.[op] ?? DEFAULT_OPERATOR_LABELS[op]
+            }));
+        });
+        this.currentOperator = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'date' ? f.value.operator : 'on';
+        });
+        this.operatorLabel = computed(() => {
+            const options = this.operatorOptions();
+            const op = options.find((o) => o.value === this.currentOperator());
+            return op?.label ?? '';
+        });
+        this.dateLabel = computed(() => {
+            const f = this.filter();
+            if (f.value.type !== 'date') {
+                return '';
+            }
+            const dateValue = f.value;
+            if (dateValue.operator === 'between') {
+                if (dateValue.rangeStart && dateValue.rangeEnd) {
+                    return `${this.formatDate(dateValue.rangeStart)} - ${this.formatDate(dateValue.rangeEnd)}`;
+                }
+                return '';
+            }
+            return dateValue.value ? this.formatDate(dateValue.value) : '';
+        });
+        this.hasValue = computed(() => {
+            const f = this.filter();
+            if (f.value.type !== 'date') {
+                return false;
+            }
+            if (f.value.operator === 'between') {
+                return !!f.value.rangeStart && !!f.value.rangeEnd;
+            }
+            return !!f.value.value;
+        });
+        this.rangeStart = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'date' && f.value.rangeStart ? new Date(f.value.rangeStart) : null;
+        });
+        this.rangeEnd = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'date' && f.value.rangeEnd ? new Date(f.value.rangeEnd) : null;
+        });
+        this.selectedDate = computed(() => {
+            const f = this.filter();
+            return f.value.type === 'date' && f.value.value ? new Date(f.value.value) : null;
+        });
+        this.calendarMode = computed(() => (this.currentOperator() === 'between' ? 'range' : 'single'));
+    }
+    onRemove() {
+        this.removed.emit(this.filter().id);
+    }
+    selectOperator(operator, dropdown) {
+        const f = this.filter();
+        if (f.value.type !== 'date') {
+            return;
+        }
+        const isBetween = operator === 'between';
+        const updated = {
+            ...f,
+            value: {
+                type: 'date',
+                operator,
+                value: isBetween ? null : f.value.value,
+                rangeStart: isBetween ? f.value.rangeStart : null,
+                rangeEnd: isBetween ? f.value.rangeEnd : null
+            }
+        };
+        this.changed.emit(updated);
+        dropdown.close();
+    }
+    onRangeSelected(range, dropdown) {
+        const f = this.filter();
+        if (f.value.type !== 'date') {
+            return;
+        }
+        this.changed.emit({
+            ...f,
+            value: {
+                type: 'date',
+                operator: 'between',
+                value: null,
+                rangeStart: range.start,
+                rangeEnd: range.end
+            }
+        });
+        dropdown.close();
+    }
+    onSingleDateSelected(date, dropdown) {
+        const f = this.filter();
+        if (f.value.type !== 'date') {
+            return;
+        }
+        this.changed.emit({
+            ...f,
+            value: {
+                type: 'date',
+                operator: f.value.operator,
+                value: date,
+                rangeStart: null,
+                rangeEnd: null
+            }
+        });
+        dropdown.close();
+    }
+    formatDate(date) {
+        return date.toLocaleDateString();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiDateFilterComponent, isStandalone: true, selector: "cui-date-filter", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { removed: "removed", changed: "changed" }, ngImport: i0, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"date-filter__operator\"\n    [cuiDropdown]=\"operatorDropdownTpl\"\n    #operatorDropdown=\"cuiDropdown\"\n>\n    <span class=\"date-filter__operator-label\">{{ operatorLabel() }}</span>\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<button\n    type=\"button\"\n    class=\"date-filter__trigger\"\n    [class.date-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"calendarDropdownTpl\"\n    #calendarDropdown=\"cuiDropdown\"\n>\n    @if (dateLabel()) {\n        <span class=\"date-filter__value\">\n            {{ dateLabel() }}\n        </span>\n    } @else {\n        <span class=\"date-filter__placeholder\">Select date</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #operatorDropdownTpl>\n    <div class=\"date-filter__dropdown\">\n        @for (op of operatorOptions(); track op.value) {\n            <button\n                type=\"button\"\n                class=\"date-filter__option\"\n                [class.date-filter__option--selected]=\"currentOperator() === op.value\"\n                (click)=\"selectOperator(op.value, operatorDropdown)\"\n            >\n                {{ op.label }}\n            </button>\n        }\n    </div>\n</ng-template>\n\n<ng-template #calendarDropdownTpl>\n    <div class=\"date-filter__calendar-dropdown\">\n        <cui-date-range-calendar\n            [mode]=\"calendarMode()\"\n            [startDate]=\"rangeStart()\"\n            [endDate]=\"rangeEnd()\"\n            [selectedDate]=\"selectedDate()\"\n            (rangeSelected)=\"onRangeSelected($event, calendarDropdown)\"\n            (dateSelected)=\"onSingleDateSelected($event, calendarDropdown)\"\n            (cancelled)=\"calendarDropdown.close()\"\n        />\n    </div>\n</ng-template>\n", styles: [":host{display:inline-flex}.date-filter__operator{padding-right:6px;padding-left:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:4px;height:28px;background:transparent;border:1px solid var(--cui-base-200);cursor:pointer}.date-filter__operator:hover{background:var(--cui-base-200)}.date-filter__operator:focus{outline:none}.date-filter__operator-label{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900)}.date-filter__trigger{padding-right:6px;padding-left:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.date-filter__trigger:hover{background:var(--cui-base-200)}.date-filter__trigger:focus{outline:none}.date-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.date-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.date-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.date-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.date-filter__dropdown{display:flex;flex-direction:column;gap:0;padding-top:4px;padding-bottom:4px;min-width:165px;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.date-filter__option{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:flex-start;border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:400;font-size:13px;line-height:16px;padding:8px 12px;width:100%;text-align:left;color:var(--cui-base-900);cursor:pointer;-webkit-user-select:none;user-select:none}.date-filter__option:hover{background:var(--cui-base-50)}.date-filter__option--selected{background:var(--cui-lavender-bg)}.date-filter__calendar-dropdown{background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiDateRangeCalendarComponent, selector: "cui-date-range-calendar", inputs: ["mode", "startDate", "endDate", "selectedDate"], outputs: ["rangeSelected", "dateSelected", "cancelled"] }, { kind: "directive", type: CuiDropdownDirective, selector: "[cuiDropdown]", inputs: ["cuiDropdown", "orientation"], outputs: ["isOpened"], exportAs: ["cuiDropdown"] }, { kind: "component", type: CuiFilterRemoveButtonComponent, selector: "cui-filter-remove-button", inputs: ["label"], outputs: ["removed"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateFilterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-date-filter', standalone: true, imports: [
+                        CuiButtonModule,
+                        CuiDateRangeCalendarComponent,
+                        CuiDropdownDirective,
+                        CuiFilterRemoveButtonComponent,
+                        CuiSvgModule
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-filter-remove-button\n    [label]=\"filter().field.label\"\n    (removed)=\"onRemove()\"\n/>\n\n<button\n    type=\"button\"\n    class=\"date-filter__operator\"\n    [cuiDropdown]=\"operatorDropdownTpl\"\n    #operatorDropdown=\"cuiDropdown\"\n>\n    <span class=\"date-filter__operator-label\">{{ operatorLabel() }}</span>\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<button\n    type=\"button\"\n    class=\"date-filter__trigger\"\n    [class.date-filter__trigger--active]=\"hasValue()\"\n    [cuiDropdown]=\"calendarDropdownTpl\"\n    #calendarDropdown=\"cuiDropdown\"\n>\n    @if (dateLabel()) {\n        <span class=\"date-filter__value\">\n            {{ dateLabel() }}\n        </span>\n    } @else {\n        <span class=\"date-filter__placeholder\">Select date</span>\n    }\n    <cui-svg icon=\"cuiIconChevronDown\" />\n</button>\n\n<ng-template #operatorDropdownTpl>\n    <div class=\"date-filter__dropdown\">\n        @for (op of operatorOptions(); track op.value) {\n            <button\n                type=\"button\"\n                class=\"date-filter__option\"\n                [class.date-filter__option--selected]=\"currentOperator() === op.value\"\n                (click)=\"selectOperator(op.value, operatorDropdown)\"\n            >\n                {{ op.label }}\n            </button>\n        }\n    </div>\n</ng-template>\n\n<ng-template #calendarDropdownTpl>\n    <div class=\"date-filter__calendar-dropdown\">\n        <cui-date-range-calendar\n            [mode]=\"calendarMode()\"\n            [startDate]=\"rangeStart()\"\n            [endDate]=\"rangeEnd()\"\n            [selectedDate]=\"selectedDate()\"\n            (rangeSelected)=\"onRangeSelected($event, calendarDropdown)\"\n            (dateSelected)=\"onSingleDateSelected($event, calendarDropdown)\"\n            (cancelled)=\"calendarDropdown.close()\"\n        />\n    </div>\n</ng-template>\n", styles: [":host{display:inline-flex}.date-filter__operator{padding-right:6px;padding-left:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:4px;height:28px;background:transparent;border:1px solid var(--cui-base-200);cursor:pointer}.date-filter__operator:hover{background:var(--cui-base-200)}.date-filter__operator:focus{outline:none}.date-filter__operator-label{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900)}.date-filter__trigger{padding-right:6px;padding-left:6px;font-weight:500;font-size:12px;line-height:14px;display:inline-flex;align-items:center;gap:8px;height:28px;background:transparent;border:1px solid var(--cui-base-200);border-top-right-radius:8px;border-bottom-right-radius:8px;cursor:pointer}.date-filter__trigger:hover{background:var(--cui-base-200)}.date-filter__trigger:focus{outline:none}.date-filter__trigger--active{background:var(--cui-lavender-bg);border-color:var(--cui-badge-lavender-label)}.date-filter__trigger--active:hover{background:var(--cui-base-200);border-color:var(--cui-base-200)}.date-filter__value{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-900);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.date-filter__placeholder{font-weight:500;font-size:12px;line-height:14px;color:var(--cui-base-500)}.date-filter__dropdown{display:flex;flex-direction:column;gap:0;padding-top:4px;padding-bottom:4px;min-width:165px;background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}.date-filter__option{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:flex-start;border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:400;font-size:13px;line-height:16px;padding:8px 12px;width:100%;text-align:left;color:var(--cui-base-900);cursor:pointer;-webkit-user-select:none;user-select:none}.date-filter__option:hover{background:var(--cui-base-50)}.date-filter__option--selected{background:var(--cui-lavender-bg)}.date-filter__calendar-dropdown{background:var(--cui-base-0);border:1px solid var(--cui-base-200);border-radius:8px;box-shadow:0 4px 12px #00000026;overflow:hidden}\n"] }]
+        }] });
+
+function buildOutputObject(filters) {
+    const result = {};
+    for (const filter of filters) {
+        const entries = extractEntries(filter.field, filter.value);
+        for (const [path, val] of entries) {
+            setByPath(result, path, val);
+        }
+    }
+    return result;
+}
+function extractEntries(field, value) {
+    switch (field.type) {
+        case 'string': {
+            const v = value;
+            if (!v.value)
+                return [];
+            return [[field.outputMapping.value, v.value]];
+        }
+        case 'select': {
+            const v = value;
+            if (v.value == null)
+                return [];
+            return [[field.outputMapping.value, v.value]];
+        }
+        case 'multiselect': {
+            const v = value;
+            if (!v.values.length)
+                return [];
+            return [[field.outputMapping.values, v.values]];
+        }
+        case 'date': {
+            const v = value;
+            const mapping = field.outputMapping;
+            return buildDateEntries(v.operator, v.value, v.rangeStart, v.rangeEnd, mapping.start, mapping.end);
+        }
+        case 'range': {
+            const v = value;
+            const mapping = field.outputMapping;
+            const entries = [];
+            if (v.min != null)
+                entries.push([mapping.min, v.min]);
+            if (v.max != null)
+                entries.push([mapping.max, v.max]);
+            return entries;
+        }
+    }
+}
+function buildDateEntries(operator, value, rangeStart, rangeEnd, startPath, endPath) {
+    const entries = [];
+    switch (operator) {
+        case 'on':
+            if (value) {
+                entries.push([startPath, formatDateStart(value)]);
+                entries.push([endPath, formatDateEnd(value)]);
+            }
+            break;
+        case 'before':
+            if (value) {
+                entries.push([endPath, formatDateEnd(value)]);
+            }
+            break;
+        case 'after':
+            if (value) {
+                entries.push([startPath, formatDateStart(value)]);
+            }
+            break;
+        case 'between':
+            if (rangeStart)
+                entries.push([startPath, formatDateStart(rangeStart)]);
+            if (rangeEnd)
+                entries.push([endPath, formatDateEnd(rangeEnd)]);
+            break;
+    }
+    return entries;
+}
+function formatDateStart(date) {
+    return formatDate(date) + 'T00:00:00';
+}
+function formatDateEnd(date) {
+    return formatDate(date) + 'T23:59:59';
+}
+function formatDate(date) {
+    const y = date.getFullYear();
+    const m = String(date.getMonth() + 1).padStart(2, '0');
+    const d = String(date.getDate()).padStart(2, '0');
+    return `${y}-${m}-${d}`;
+}
+function setByPath(obj, path, value) {
+    const keys = path.split('.');
+    let current = obj;
+    for (let i = 0; i < keys.length - 1; i++) {
+        const key = keys[i];
+        if (!(key in current) || typeof current[key] !== 'object' || current[key] === null) {
+            current[key] = {};
+        }
+        current = current[key];
+    }
+    current[keys[keys.length - 1]] = value;
+}
+function buildDefaultValue(field) {
+    switch (field.type) {
+        case 'string':
+            return { type: 'string', operator: field.stringOperators?.[0] ?? 'contains', value: '' };
+        case 'select':
+            return { type: 'select', operator: field.selectOperators?.[0] ?? 'equals', value: null };
+        case 'multiselect':
+            return { type: 'multiselect', operator: field.multiSelectOperators?.[0] ?? 'in', values: [] };
+        case 'date':
+            return { type: 'date', operator: field.dateOperators?.[0] ?? 'on', value: null, rangeStart: null, rangeEnd: null };
+        case 'range':
+            return { type: 'range', min: null, max: null };
+    }
+}
+
+class CuiFilterBarComponent {
+    constructor() {
+        this.fields = input.required();
+        this.filterChange = output();
+        this._filters = signal([]);
+        this.availableFields = computed(() => {
+            const usedFieldIds = new Set(this._filters().map(f => f.field.id));
+            return this.fields().filter(f => !usedFieldIds.has(f.id));
+        });
+    }
+    selectField(field) {
+        const newFilter = {
+            id: crypto.randomUUID(),
+            field,
+            value: buildDefaultValue(field)
+        };
+        this._filters.set([...this._filters(), newFilter]);
+        this.emitFilterChange();
+    }
+    onFilterChanged(updated) {
+        const next = this._filters().map(f => (f.id === updated.id ? updated : f));
+        this._filters.set(next);
+        this.emitFilterChange();
+    }
+    onFilterRemoved(id) {
+        const next = this._filters().filter(f => f.id !== id);
+        this._filters.set(next);
+        this.emitFilterChange();
+    }
+    emitFilterChange() {
+        this.filterChange.emit(buildOutputObject(this._filters()));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiFilterBarComponent, isStandalone: true, selector: "cui-filter-bar", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filterChange: "filterChange" }, ngImport: i0, template: "<div class=\"cui-filter-bar\">\n    <div class=\"cui-filter-bar__list\">\n        @for (filter of _filters(); track filter.id) {\n            @switch (filter.field.type) {\n                @case ('string') {\n                    <cui-string-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('date') {\n                    <cui-date-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('range') {\n                    <cui-range-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('select') {\n                    <cui-select-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('multiselect') {\n                    <cui-multiselect-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n            }\n        }\n\n        @if (availableFields().length > 0) {\n            <cui-add-filter-button\n                [availableFields]=\"availableFields()\"\n                (fieldSelected)=\"selectField($event)\"\n            />\n        }\n    </div>\n</div>\n", styles: [".cui-filter-bar{display:flex;flex-direction:row;gap:12px}.cui-filter-bar__list{display:flex;flex-direction:row;gap:8px;flex-wrap:wrap}\n"], dependencies: [{ kind: "component", type: CuiAddFilterButtonComponent, selector: "cui-add-filter-button", inputs: ["availableFields"], outputs: ["fieldSelected"] }, { kind: "component", type: CuiDateFilterComponent, selector: "cui-date-filter", inputs: ["filter"], outputs: ["removed", "changed"] }, { kind: "component", type: CuiMultiSelectFilterComponent, selector: "cui-multiselect-filter", inputs: ["filter"], outputs: ["removed", "changed"] }, { kind: "component", type: CuiRangeFilterComponent, selector: "cui-range-filter", inputs: ["filter"], outputs: ["removed", "changed"] }, { kind: "component", type: CuiSelectFilterComponent, selector: "cui-select-filter", inputs: ["filter"], outputs: ["removed", "changed"] }, { kind: "component", type: CuiStringFilterComponent, selector: "cui-string-filter", inputs: ["filter"], outputs: ["removed", "changed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cui-filter-bar', standalone: true, imports: [
+                        CuiAddFilterButtonComponent,
+                        CuiDateFilterComponent,
+                        CuiFilterRemoveButtonComponent,
+                        CuiMultiSelectFilterComponent,
+                        CuiRangeFilterComponent,
+                        CuiSelectFilterComponent,
+                        CuiStringFilterComponent
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cui-filter-bar\">\n    <div class=\"cui-filter-bar__list\">\n        @for (filter of _filters(); track filter.id) {\n            @switch (filter.field.type) {\n                @case ('string') {\n                    <cui-string-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('date') {\n                    <cui-date-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('range') {\n                    <cui-range-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('select') {\n                    <cui-select-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n                @case ('multiselect') {\n                    <cui-multiselect-filter\n                        [filter]=\"filter\"\n                        (changed)=\"onFilterChanged($event)\"\n                        (removed)=\"onFilterRemoved($event)\"\n                    />\n                }\n            }\n        }\n\n        @if (availableFields().length > 0) {\n            <cui-add-filter-button\n                [availableFields]=\"availableFields()\"\n                (fieldSelected)=\"selectField($event)\"\n            />\n        }\n    </div>\n</div>\n", styles: [".cui-filter-bar{display:flex;flex-direction:row;gap:12px}.cui-filter-bar__list{display:flex;flex-direction:row;gap:8px;flex-wrap:wrap}\n"] }]
+        }] });
+
+class CuiFilterBarModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterBarModule, imports: [CuiFilterBarComponent], exports: [CuiFilterBarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterBarModule, imports: [CuiFilterBarComponent] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CuiFilterBarComponent],
+                    exports: [CuiFilterBarComponent]
+                }]
+        }] });
+
 const COMBINED_TEXT_BLOCK_PART = 'combined-text-block-part';
 const COMBINED_TEXT_BLOCK = 'combined-text-block';
 const COMBINED_TEXT_BLOCK_NAME = 'paragraph';
@@ -5229,7 +6039,7 @@ class MarkerModalComponent {
         this.element.style.top = bottom + this.spaceBetweenTargetAndList + 'px';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MarkerModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: MarkerModalComponent, isStandalone: true, selector: "ng-component", inputs: { title: "title", url: "url", tool: "tool", isGlobal: "isGlobal", isTool: "isTool", target: "target", space: "space" }, outputs: { saveClicked: "saveClicked", cancelClicked: "cancelClicked" }, host: { properties: { "class._hidden": "this.hide", "class._fixed": "this.fixed" } }, hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <ng-container *ngIf=\"isVisible()\">\n        <form\n            autocomplete=\"off\"\n            class=\"wrapper\"\n        >\n            <cui-form-field>\n                <!-- eslint-disable-next-line -->\n                <label\n                    [for]=\"titleId\"\n                    cuiLabel\n                    [isRequired]=\"true\"\n                    (click)=\"onTitleLabelClick(titleElement)\"\n                >\n                    {{ t('TITLE') }}\n                </label>\n                <!-- TODO: \u0435\u0441\u043B\u0438 \u043D\u0430\u0439\u0434\u0435\u0442\u0441\u044F \u0432\u0430\u0440\u0438\u043A \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0444\u043E\u0440\u043C\u0443 -->\n                <div\n                    class=\"title\"\n                    [class.title_invalid]=\"isTitleInvalid()\"\n                >\n                    <div\n                        #titleElement\n                        class=\"title__text\"\n                        contenteditable\n                        attr.data-placeholder=\"{{ t('TITLE') }}...\"\n                        (paste)=\"onTitlePaste($event)\"\n                        (keyup)=\"onTitleChange($event)\"\n                        [innerHTML]=\"startTitle\"\n                    ></div>\n                    <button\n                        type=\"button\"\n                        class=\"title__clear\"\n                        (click)=\"onClearTitle(titleElement)\"\n                    >\n                        <cui-svg\n                            icon=\"cuiIconClear\"\n                            color=\"var(--cui-base-300)\"\n                            class=\"title__icon\"\n                        />\n                    </button>\n                </div>\n\n                <cui-hint\n                    *ngIf=\"isTitleInvalid()\"\n                    hintType=\"error\"\n                >\n                    <ng-container *ngIf=\"isTitleEmpty()\">\n                        {{ t('FIELD_IS_REQUIRED') }}\n                    </ng-container>\n                    <ng-container *ngIf=\"isTitleMoreThanMaxLength()\">\n                        {{ t('PLEASE_KEEP_FIELD_UNDER_CHARACTERS', { value: TITLE_MAX_LENGTH }) }}\n                    </ng-container>\n                </cui-hint>\n            </cui-form-field>\n            <cui-form-field>\n                <label\n                    [for]=\"dataId\"\n                    cuiLabel\n                    [isRequired]=\"true\"\n                >\n                    {{ isTool ? t('TOOL') : t('URL') }}\n                </label>\n                <ng-container *ngIf=\"dynamicDataControl\">\n                    <ng-container *ngIf=\"isTool; else input\">\n                        <div>\n                            <button\n                                #target=\"elementRef\"\n                                class=\"button tool-button\"\n                                cuiButton\n                                type=\"button\"\n                                cuiElement\n                                appearance=\"outlined-gray\"\n                                size=\"sm\"\n                            >\n                                {{ $any(dynamicDataControl.value)?.title || t('SELECT_TOOL') }}\n                            </button>\n                        </div>\n                        <cc-marker-select\n                            [formControl]=\"dynamicDataControl\"\n                            [target]=\"target.nativeElement\"\n                        />\n                    </ng-container>\n                    <ng-template #input>\n                        <cui-input-text\n                            [cuiTextFieldId]=\"dataId\"\n                            [formControl]=\"dynamicDataControl\"\n                            autocomplete=\"off\"\n                            [cuiTextFieldIsError]=\"isDynamicDataErrorShown\"\n                            cuiTextFieldPlaceholder=\"{{ t('LINK') }}...\"\n                        />\n                        <cui-hint\n                            *ngIf=\"isDynamicDataErrorShown\"\n                            hintType=\"error\"\n                        >\n                            <ng-container *ngIf=\"dynamicDataControl.errors?.['required']\">\n                                {{ t('FIELD_IS_REQUIRED') }}\n                            </ng-container>\n                            <ng-container *ngIf=\"dynamicDataControl.errors?.['url']\">\n                                {{ t('INVALID_URL') }}\n                            </ng-container>\n                        </cui-hint>\n                    </ng-template>\n                </ng-container>\n            </cui-form-field>\n            <div class=\"buttons\">\n                <button\n                    cuiButton\n                    type=\"button\"\n                    appearance=\"outlined-gray\"\n                    size=\"sm\"\n                    (click)=\"onCancel()\"\n                >\n                    {{ t('CANCEL') }}\n                </button>\n                <button\n                    cuiButton\n                    type=\"submit\"\n                    appearance=\"action\"\n                    size=\"sm\"\n                    [disabled]=\"isFormInvalid\"\n                    (click)=\"onSave()\"\n                >\n                    {{ t('SAVE') }}\n                </button>\n            </div>\n        </form>\n    </ng-container>\n</ng-container>\n", styles: [":host{position:absolute;z-index:1;left:0}:host._fixed{position:fixed}:host._hidden{position:fixed;visibility:hidden}:host ::ng-deep .tool-button{width:100%}:host ::ng-deep .tool-button>span{justify-content:flex-start!important}.wrapper{padding:11px;box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;display:flex;flex-direction:column;gap:16px;border-radius:8px;border:1px solid var(--cui-base-200);max-width:450px;background-color:var(--cui-base-0)}.buttons{padding-top:12px;display:flex;justify-content:flex-end;gap:12px}.title{padding:7px 13px;cursor:text;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;width:426px;background:var(--cui-input);color:var(--cui-base-900)}.title:hover{border-color:var(--cui-base-300)}.title:focus-within{outline:none;box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.title_invalid,.title_invalid:focus-within{box-shadow:none;border-color:var(--cui-danger)}.title__text{flex-grow:1;text-wrap:nowrap;overflow:hidden}.title__text[data-placeholder]:empty:before{content:attr(data-placeholder);position:absolute;color:var(--cui-base-400)}.title__text:focus{outline:none}.title__clear{padding:0;visibility:hidden}.title__icon{width:16px}.title__icon ::ng-deep [stroke]{stroke:var(--cui-base-0)}.title__text:not(:empty)+.title__clear{visibility:visible}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiElementDirective, selector: "[cuiElement]", exportAs: ["elementRef"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "ngmodule", type: CuiHintModule }, { kind: "component", type: CuiHintComponent, selector: "cui-hint", inputs: ["hintType"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MarkerSelectComponent, selector: "cc-marker-select", inputs: ["target", "space"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: MarkerModalComponent, isStandalone: true, selector: "ng-component", inputs: { title: "title", url: "url", tool: "tool", isGlobal: "isGlobal", isTool: "isTool", target: "target", space: "space" }, outputs: { saveClicked: "saveClicked", cancelClicked: "cancelClicked" }, host: { properties: { "class._hidden": "this.hide", "class._fixed": "this.fixed" } }, hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <ng-container *ngIf=\"isVisible()\">\n        <form\n            autocomplete=\"off\"\n            class=\"wrapper\"\n        >\n            <cui-form-field>\n                <!-- eslint-disable-next-line -->\n                <label\n                    [for]=\"titleId\"\n                    cuiLabel\n                    [isRequired]=\"true\"\n                    (click)=\"onTitleLabelClick(titleElement)\"\n                >\n                    {{ t('TITLE') }}\n                </label>\n                <!-- TODO: \u0435\u0441\u043B\u0438 \u043D\u0430\u0439\u0434\u0435\u0442\u0441\u044F \u0432\u0430\u0440\u0438\u043A \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0444\u043E\u0440\u043C\u0443 -->\n                <div\n                    class=\"title\"\n                    [class.title_invalid]=\"isTitleInvalid()\"\n                >\n                    <div\n                        #titleElement\n                        class=\"title__text\"\n                        contenteditable\n                        attr.data-placeholder=\"{{ t('TITLE') }}...\"\n                        (paste)=\"onTitlePaste($event)\"\n                        (keyup)=\"onTitleChange($event)\"\n                        [innerHTML]=\"startTitle\"\n                    ></div>\n                    <button\n                        type=\"button\"\n                        class=\"title__clear\"\n                        (click)=\"onClearTitle(titleElement)\"\n                    >\n                        <cui-svg\n                            icon=\"cuiIconClear\"\n                            color=\"var(--cui-base-300)\"\n                            class=\"title__icon\"\n                        />\n                    </button>\n                </div>\n\n                <cui-hint\n                    *ngIf=\"isTitleInvalid()\"\n                    hintType=\"error\"\n                >\n                    <ng-container *ngIf=\"isTitleEmpty()\">\n                        {{ t('FIELD_IS_REQUIRED') }}\n                    </ng-container>\n                    <ng-container *ngIf=\"isTitleMoreThanMaxLength()\">\n                        {{ t('PLEASE_KEEP_FIELD_UNDER_CHARACTERS', { value: TITLE_MAX_LENGTH }) }}\n                    </ng-container>\n                </cui-hint>\n            </cui-form-field>\n            <cui-form-field>\n                <label\n                    [for]=\"dataId\"\n                    cuiLabel\n                    [isRequired]=\"true\"\n                >\n                    {{ isTool ? t('TOOL') : t('URL') }}\n                </label>\n                <ng-container *ngIf=\"dynamicDataControl\">\n                    <ng-container *ngIf=\"isTool; else input\">\n                        <div>\n                            <button\n                                #target=\"elementRef\"\n                                class=\"button tool-button\"\n                                cuiButton\n                                type=\"button\"\n                                cuiElement\n                                appearance=\"outlined-gray\"\n                                size=\"sm\"\n                            >\n                                {{ $any(dynamicDataControl.value)?.title || t('SELECT_TOOL') }}\n                            </button>\n                        </div>\n                        <cc-marker-select\n                            [formControl]=\"dynamicDataControl\"\n                            [target]=\"target.nativeElement\"\n                        />\n                    </ng-container>\n                    <ng-template #input>\n                        <cui-input-text\n                            [cuiTextFieldId]=\"dataId\"\n                            [formControl]=\"dynamicDataControl\"\n                            autocomplete=\"off\"\n                            [cuiTextFieldIsError]=\"isDynamicDataErrorShown\"\n                            cuiTextFieldPlaceholder=\"{{ t('LINK') }}...\"\n                        />\n                        <cui-hint\n                            *ngIf=\"isDynamicDataErrorShown\"\n                            hintType=\"error\"\n                        >\n                            <ng-container *ngIf=\"dynamicDataControl.errors?.['required']\">\n                                {{ t('FIELD_IS_REQUIRED') }}\n                            </ng-container>\n                            <ng-container *ngIf=\"dynamicDataControl.errors?.['url']\">\n                                {{ t('INVALID_URL') }}\n                            </ng-container>\n                        </cui-hint>\n                    </ng-template>\n                </ng-container>\n            </cui-form-field>\n            <div class=\"buttons\">\n                <button\n                    cuiButton\n                    type=\"button\"\n                    appearance=\"outlined-gray\"\n                    size=\"sm\"\n                    (click)=\"onCancel()\"\n                >\n                    {{ t('CANCEL') }}\n                </button>\n                <button\n                    cuiButton\n                    type=\"submit\"\n                    appearance=\"action\"\n                    size=\"sm\"\n                    [disabled]=\"isFormInvalid\"\n                    (click)=\"onSave()\"\n                >\n                    {{ t('SAVE') }}\n                </button>\n            </div>\n        </form>\n    </ng-container>\n</ng-container>\n", styles: [":host{position:absolute;z-index:1;left:0}:host._fixed{position:fixed}:host._hidden{position:fixed;visibility:hidden}:host ::ng-deep .tool-button{width:100%}:host ::ng-deep .tool-button>span{justify-content:flex-start!important}.wrapper{padding:11px;box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;display:flex;flex-direction:column;gap:16px;border-radius:8px;border:1px solid var(--cui-base-200);max-width:450px;background-color:var(--cui-base-0)}.buttons{padding-top:12px;display:flex;justify-content:flex-end;gap:12px}.title{padding:7px 13px;cursor:text;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;width:426px;background:var(--cui-input);color:var(--cui-base-900)}.title:hover{border-color:var(--cui-base-300)}.title:focus-within{outline:none;box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.title_invalid,.title_invalid:focus-within{box-shadow:none;border-color:var(--cui-danger)}.title__text{flex-grow:1;text-wrap:nowrap;overflow:hidden}.title__text[data-placeholder]:empty:before{content:attr(data-placeholder);position:absolute;color:var(--cui-base-400)}.title__text:focus{outline:none}.title__clear{padding:0;visibility:hidden}.title__icon{width:16px}.title__icon ::ng-deep [stroke]{stroke:var(--cui-base-0)}.title__text:not(:empty)+.title__clear{visibility:visible}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiElementDirective, selector: "[cuiElement]", exportAs: ["elementRef"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "ngmodule", type: CuiHintModule }, { kind: "component", type: CuiHintComponent, selector: "cui-hint", inputs: ["hintType"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MarkerSelectComponent, selector: "cc-marker-select", inputs: ["target", "space"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MarkerModalComponent, decorators: [{
             type: Component,
@@ -8526,7 +9336,7 @@ class CuiCategoryFormComponent {
         Promise.resolve().then(() => this.input().nativeElement.focus());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCategoryFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.14", type: CuiCategoryFormComponent, isStandalone: true, selector: "cui-category-form", inputs: { isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, defaultTitle: { classPropertyName: "defaultTitle", publicName: "defaultTitle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { created: "created", canceled: "canceled" }, host: { listeners: { "click": "onHostClick($event)" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <form\n        [formGroup]=\"form\"\n        class=\"form\"\n        (ngSubmit)=\"onSubmit()\"\n    >\n        <div class=\"input\">\n            <input\n                #input\n                cuiGhostInput\n                formControlName=\"title\"\n                type=\"text\"\n                placeholder=\"{{ t('ADD_CATEGORY_NAME') }}...\"\n                [isError]=\"isTitleInvalid\"\n                (keyup)=\"$event.preventDefault()\"\n            />\n            <cui-general-control-error-hint [control]=\"titleControl\" />\n        </div>\n        <button\n            cuiIconButton\n            type=\"submit\"\n            icon=\"cuiIconCheck\"\n            color=\"var(--cui-success)\"\n            [disabled]=\"isSubmitButtonDisabled\"\n            class=\"button\"\n        ></button>\n    </form>\n    <button\n        cuiIconButton\n        type=\"button\"\n        icon=\"cuiIconXCircle\"\n        color=\"var(--cui-danger)\"\n        (click)=\"onCancel($event)\"\n        [disabled]=\"isDisabled()\"\n        class=\"button\"\n    ></button>\n</ng-container>\n", styles: [":host{padding-top:2px;padding-bottom:2px;display:flex;gap:4px;flex-grow:1}.form,.input{flex-grow:1}.form{display:flex;flex-direction:row;gap:4px}.input{display:flex;flex-direction:column;gap:4px;align-items:flex-start;justify-content:flex-start}.button{width:28px}.button:disabled{opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "component", type: CuiGhostInputComponent, selector: "input [cuiGhostInput]", inputs: ["isError"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.14", type: CuiCategoryFormComponent, isStandalone: true, selector: "cui-category-form", inputs: { isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, defaultTitle: { classPropertyName: "defaultTitle", publicName: "defaultTitle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { created: "created", canceled: "canceled" }, host: { listeners: { "click": "onHostClick($event)" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <form\n        [formGroup]=\"form\"\n        class=\"form\"\n        (ngSubmit)=\"onSubmit()\"\n    >\n        <div class=\"input\">\n            <input\n                #input\n                cuiGhostInput\n                formControlName=\"title\"\n                type=\"text\"\n                placeholder=\"{{ t('ADD_CATEGORY_NAME') }}...\"\n                [isError]=\"isTitleInvalid\"\n                (keyup)=\"$event.preventDefault()\"\n            />\n            <cui-general-control-error-hint [control]=\"titleControl\" />\n        </div>\n        <button\n            cuiIconButton\n            type=\"submit\"\n            icon=\"cuiIconCheck\"\n            color=\"var(--cui-success)\"\n            [disabled]=\"isSubmitButtonDisabled\"\n            class=\"button\"\n        ></button>\n    </form>\n    <button\n        cuiIconButton\n        type=\"button\"\n        icon=\"cuiIconXCircle\"\n        color=\"var(--cui-danger)\"\n        (click)=\"onCancel($event)\"\n        [disabled]=\"isDisabled()\"\n        class=\"button\"\n    ></button>\n</ng-container>\n", styles: [":host{padding-top:2px;padding-bottom:2px;display:flex;gap:4px;flex-grow:1}.form,.input{flex-grow:1}.form{display:flex;flex-direction:row;gap:4px}.input{display:flex;flex-direction:column;gap:4px;align-items:flex-start;justify-content:flex-start}.button{width:28px}.button:disabled{opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "component", type: CuiGhostInputComponent, selector: "input [cuiGhostInput]", inputs: ["isError"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCategoryFormComponent, decorators: [{
             type: Component,
@@ -8909,7 +9719,7 @@ class CuiCheckListBlockListItemActionCardComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCheckListBlockListItemActionCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCheckListBlockListItemActionCardComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-card", inputs: { purposeType: { classPropertyName: "purposeType", publicName: "purposeType", isSignal: true, isRequired: false, transformFunction: null }, isConsiderationNeeded: { classPropertyName: "isConsiderationNeeded", publicName: "isConsiderationNeeded", isSignal: true, isRequired: false, transformFunction: null }, actionInfo: { classPropertyName: "actionInfo", publicName: "actionInfo", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { consideredCorrectChanged: "consideredCorrectChanged", checkListActionChanged: "checkListActionChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <div\n        class=\"card\"\n        [formGroup]=\"actionForm\"\n    >\n        <div class=\"title-container\">\n            <span class=\"title\">{{ actionInfo().title }}</span>\n            @if (isConsiderationNeeded()) {\n                <label\n                    cuiLabel\n                    class=\"title__input\"\n                >\n                    <input\n                        cuiRadio\n                        type=\"radio\"\n                        [checked]=\"actionInfo().considerCorrect\"\n                        [formControl]=\"isConsideredCorrectControl\"\n                        [value]=\"true\"\n                    />\n                    {{ t('CONSIDER_CORRECT') }}\n                </label>\n            }\n        </div>\n        <div class=\"blocks\">\n            <div\n                class=\"block-card\"\n                [formGroup]=\"photoGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('PHOTO') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n            <div\n                class=\"block-card\"\n                [formGroup]=\"commentGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('COMMENT') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n        </div>\n    </div>\n</ng-container>\n", styles: [":host{flex:1 1 240px;min-width:240px}.card{padding:11px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--cui-base-200);border-radius:8px}.title-container{display:flex;flex-direction:row;gap:8px;justify-content:space-between;align-items:center}.title{font-weight:500;font-size:14px;line-height:20px}.title__input{font-weight:400;font-size:14px;line-height:20px}.blocks{display:flex;flex-direction:column;gap:8px}.block-card{padding:13px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px}.block-card_multiple-lines{flex-direction:column;align-items:unset}.block-card__checkboxes-container{padding:13px 8px;display:flex;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiRadioModule }, { kind: "component", type: CuiRadioComponent, selector: "input[type=\"radio\"][cuiRadio]" }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "ngmodule", type: CuiToggleModule }, { kind: "component", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCheckListBlockListItemActionCardComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-card", inputs: { purposeType: { classPropertyName: "purposeType", publicName: "purposeType", isSignal: true, isRequired: false, transformFunction: null }, isConsiderationNeeded: { classPropertyName: "isConsiderationNeeded", publicName: "isConsiderationNeeded", isSignal: true, isRequired: false, transformFunction: null }, actionInfo: { classPropertyName: "actionInfo", publicName: "actionInfo", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { consideredCorrectChanged: "consideredCorrectChanged", checkListActionChanged: "checkListActionChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <div\n        class=\"card\"\n        [formGroup]=\"actionForm\"\n    >\n        <div class=\"title-container\">\n            <span class=\"title\">{{ actionInfo().title }}</span>\n            @if (isConsiderationNeeded()) {\n                <label\n                    cuiLabel\n                    class=\"title__input\"\n                >\n                    <input\n                        cuiRadio\n                        type=\"radio\"\n                        [checked]=\"actionInfo().considerCorrect\"\n                        [formControl]=\"isConsideredCorrectControl\"\n                        [value]=\"true\"\n                    />\n                    {{ t('CONSIDER_CORRECT') }}\n                </label>\n            }\n        </div>\n        <div class=\"blocks\">\n            <div\n                class=\"block-card\"\n                [formGroup]=\"photoGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('PHOTO') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n            <div\n                class=\"block-card\"\n                [formGroup]=\"commentGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('COMMENT') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n        </div>\n    </div>\n</ng-container>\n", styles: [":host{flex:1 1 240px;min-width:240px}.card{padding:11px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--cui-base-200);border-radius:8px}.title-container{display:flex;flex-direction:row;gap:8px;justify-content:space-between;align-items:center}.title{font-weight:500;font-size:14px;line-height:20px}.title__input{font-weight:400;font-size:14px;line-height:20px}.blocks{display:flex;flex-direction:column;gap:8px}.block-card{padding:13px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px}.block-card_multiple-lines{flex-direction:column;align-items:unset}.block-card__checkboxes-container{padding:13px 8px;display:flex;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiRadioModule }, { kind: "component", type: CuiRadioComponent, selector: "input[type=\"radio\"][cuiRadio]" }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "ngmodule", type: CuiToggleModule }, { kind: "component", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.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: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i5.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCheckListBlockListItemActionCardComponent, decorators: [{
             type: Component,
@@ -8999,7 +9809,7 @@ class CuiChecklistBlockTitleControlComponent {
         return this.control().invalid && this.control().dirty;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiChecklistBlockTitleControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiChecklistBlockTitleControlComponent, isStandalone: true, selector: "cui-checklist-block-title-control", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <cui-form-field>\n        <label\n            cuiLabel\n            [isRequired]=\"true\"\n            for=\"title\"\n        >\n            {{ t('TITLE') }}\n        </label>\n        <cui-input-text\n            [formControl]=\"control()\"\n            cuiTextFieldId=\"title\"\n            [cuiTextFieldIsError]=\"isTitleError\"\n            cuiTextFieldPlaceholder=\"{{ t('ADD_A_TITLE') }}...\"\n        />\n        <cui-general-control-error-hint [control]=\"control()\" />\n    </cui-form-field>\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiChecklistBlockTitleControlComponent, isStandalone: true, selector: "cui-checklist-block-title-control", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <cui-form-field>\n        <label\n            cuiLabel\n            [isRequired]=\"true\"\n            for=\"title\"\n        >\n            {{ t('TITLE') }}\n        </label>\n        <cui-input-text\n            [formControl]=\"control()\"\n            cuiTextFieldId=\"title\"\n            [cuiTextFieldIsError]=\"isTitleError\"\n            cuiTextFieldPlaceholder=\"{{ t('ADD_A_TITLE') }}...\"\n        />\n        <cui-general-control-error-hint [control]=\"control()\" />\n    </cui-form-field>\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiChecklistBlockTitleControlComponent, decorators: [{
             type: Component,
@@ -9230,7 +10040,7 @@ class CuiCheckListBlockListItemEvaluationCriteriaComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCheckListBlockListItemEvaluationCriteriaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCheckListBlockListItemEvaluationCriteriaComponent, isStandalone: true, selector: "li[cuiChecklistBlockListItemEvaluationCriteria]", inputs: { loadingIds: { classPropertyName: "loadingIds", publicName: "loadingIds", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, criteriaGroup: { classPropertyName: "criteriaGroup", publicName: "criteriaGroup", isSignal: true, isRequired: true, transformFunction: null }, evaluationCriteriaFormArray: { classPropertyName: "evaluationCriteriaFormArray", publicName: "evaluationCriteriaFormArray", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { saveClicked: "saveClicked", deleteClicked: "deleteClicked", cancelClicked: "cancelClicked" }, ngImport: i0, template: "<div *transloco=\"let t\">\n    <form\n        *cuiLet=\"criteriaGroup() as form\"\n        [formGroup]=\"form\"\n        [class.form_edit]=\"isEditMode()\"\n        clas=\"form\"\n    >\n        <div class=\"content\">\n            <span class=\"index\">{{ index() }}.</span>\n            @if (!isEditMode()) {\n                <cui-svg\n                    cuiDragPointer\n                    icon=\"cuiIconDragHandleDots\"\n                    color=\"var(--cui-base-500)\"\n                    class=\"icon\"\n                />\n            }\n            <div\n                style.gap=\"{{ gap() }}px\"\n                class=\"wrapper\"\n            >\n                <cui-input-number\n                    formControlName=\"evaluation\"\n                    cuiTextFieldPlaceholder=\"0\"\n                    [cuiTextFieldIsError]=\"isEvaluationInvalid\"\n                    [min]=\"1\"\n                    [max]=\"99\"\n                    class=\"input-number\"\n                />\n                <textarea\n                    cuiTextarea\n                    formControlName=\"criteria\"\n                    [rows]=\"1\"\n                    [cuiTextFieldIsError]=\"isCriteriaInvalid\"\n                    placeholder=\"{{ t('ADD_A_DESCRIPTION') }}...\"\n                    class=\"textarea\"\n                ></textarea>\n            </div>\n            @if (isEditMode()) {\n                <button\n                    type=\"submit\"\n                    cuiIconButton\n                    icon=\"cuiIconCheck\"\n                    color=\"var(--cui-success)\"\n                    [disabled]=\"form.invalid\"\n                    class=\"button\"\n                    (click)=\"onSave()\"\n                ></button>\n                <button\n                    type=\"button\"\n                    cuiIconButton\n                    icon=\"cuiIconXCircle\"\n                    color=\"var(--cui-danger)\"\n                    class=\"button\"\n                    (click)=\"onCancel()\"\n                ></button>\n            } @else {\n                <button\n                    cuiButton\n                    type=\"button\"\n                    appearance=\"ghost\"\n                    size=\"xxs\"\n                    icon=\"cuiIconEdit\"\n                    [disabled]=\"isLoading()\"\n                    (click)=\"onToggleEditMode()\"\n                ></button>\n                <button\n                    cuiButton\n                    type=\"button\"\n                    appearance=\"ghost\"\n                    size=\"xxs\"\n                    icon=\"cuiIconTrash\"\n                    [isLoaderShown]=\"isLoading()\"\n                    (click)=\"onDelete()\"\n                ></button>\n            }\n        </div>\n        <cui-general-control-error-hint\n            [control]=\"form.controls.criteria\"\n            class=\"error-hint\"\n        />\n    </form>\n</div>\n", styles: [".form{display:flex;flex-direction:column;gap:8px}.form_edit{padding:12px;border-radius:8px;border:1px solid var(--cui-base-200);background-color:var(--cui-base-0)}.content{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.index{font-weight:500;font-size:14px;line-height:20px;width:22px}.icon{cursor:grab}.icon:active{cursor:grabbing}.wrapper{display:flex;flex-direction:row;gap:0;flex-grow:1}.input-number{padding-right:9px;padding-left:9px;flex-shrink:0;width:44px;background:inherit}.input-number._disabled{cursor:initial;opacity:1;border-right-width:0;border-radius:8px 0 0 8px}.input-number ::ng-deep .c-input{text-align:center}.input-number ::ng-deep .c-input:disabled{cursor:text}.textarea{background:var(--cui-base-0)}.textarea:disabled{cursor:initial;opacity:1;background:var(--cui-base-0);border-left-width:0;border-radius:0 8px 8px 0}.button:disabled{cursor:not-allowed;opacity:.5}.error-hint{margin-left:82px}.cui-drag-drop-placeholder{height:44px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "component", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: ["rows", "noBordersAndPaddings"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiDragPointerDirective, selector: "[cuiDragPointer]" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCheckListBlockListItemEvaluationCriteriaComponent, isStandalone: true, selector: "li[cuiChecklistBlockListItemEvaluationCriteria]", inputs: { loadingIds: { classPropertyName: "loadingIds", publicName: "loadingIds", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, criteriaGroup: { classPropertyName: "criteriaGroup", publicName: "criteriaGroup", isSignal: true, isRequired: true, transformFunction: null }, evaluationCriteriaFormArray: { classPropertyName: "evaluationCriteriaFormArray", publicName: "evaluationCriteriaFormArray", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { saveClicked: "saveClicked", deleteClicked: "deleteClicked", cancelClicked: "cancelClicked" }, ngImport: i0, template: "<div *transloco=\"let t\">\n    <form\n        *cuiLet=\"criteriaGroup() as form\"\n        [formGroup]=\"form\"\n        [class.form_edit]=\"isEditMode()\"\n        clas=\"form\"\n    >\n        <div class=\"content\">\n            <span class=\"index\">{{ index() }}.</span>\n            @if (!isEditMode()) {\n                <cui-svg\n                    cuiDragPointer\n                    icon=\"cuiIconDragHandleDots\"\n                    color=\"var(--cui-base-500)\"\n                    class=\"icon\"\n                />\n            }\n            <div\n                style.gap=\"{{ gap() }}px\"\n                class=\"wrapper\"\n            >\n                <cui-input-number\n                    formControlName=\"evaluation\"\n                    cuiTextFieldPlaceholder=\"0\"\n                    [cuiTextFieldIsError]=\"isEvaluationInvalid\"\n                    [min]=\"1\"\n                    [max]=\"99\"\n                    class=\"input-number\"\n                />\n                <textarea\n                    cuiTextarea\n                    formControlName=\"criteria\"\n                    [rows]=\"1\"\n                    [cuiTextFieldIsError]=\"isCriteriaInvalid\"\n                    placeholder=\"{{ t('ADD_A_DESCRIPTION') }}...\"\n                    class=\"textarea\"\n                ></textarea>\n            </div>\n            @if (isEditMode()) {\n                <button\n                    type=\"submit\"\n                    cuiIconButton\n                    icon=\"cuiIconCheck\"\n                    color=\"var(--cui-success)\"\n                    [disabled]=\"form.invalid\"\n                    class=\"button\"\n                    (click)=\"onSave()\"\n                ></button>\n                <button\n                    type=\"button\"\n                    cuiIconButton\n                    icon=\"cuiIconXCircle\"\n                    color=\"var(--cui-danger)\"\n                    class=\"button\"\n                    (click)=\"onCancel()\"\n                ></button>\n            } @else {\n                <button\n                    cuiButton\n                    type=\"button\"\n                    appearance=\"ghost\"\n                    size=\"xxs\"\n                    icon=\"cuiIconEdit\"\n                    [disabled]=\"isLoading()\"\n                    (click)=\"onToggleEditMode()\"\n                ></button>\n                <button\n                    cuiButton\n                    type=\"button\"\n                    appearance=\"ghost\"\n                    size=\"xxs\"\n                    icon=\"cuiIconTrash\"\n                    [isLoaderShown]=\"isLoading()\"\n                    (click)=\"onDelete()\"\n                ></button>\n            }\n        </div>\n        <cui-general-control-error-hint\n            [control]=\"form.controls.criteria\"\n            class=\"error-hint\"\n        />\n    </form>\n</div>\n", styles: [".form{display:flex;flex-direction:column;gap:8px}.form_edit{padding:12px;border-radius:8px;border:1px solid var(--cui-base-200);background-color:var(--cui-base-0)}.content{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.index{font-weight:500;font-size:14px;line-height:20px;width:22px}.icon{cursor:grab}.icon:active{cursor:grabbing}.wrapper{display:flex;flex-direction:row;gap:0;flex-grow:1}.input-number{padding-right:9px;padding-left:9px;flex-shrink:0;width:44px;background:inherit}.input-number._disabled{cursor:initial;opacity:1;border-right-width:0;border-radius:8px 0 0 8px}.input-number ::ng-deep .c-input{text-align:center}.input-number ::ng-deep .c-input:disabled{cursor:text}.textarea{background:var(--cui-base-0)}.textarea:disabled{cursor:initial;opacity:1;background:var(--cui-base-0);border-left-width:0;border-radius:0 8px 8px 0}.button:disabled{cursor:not-allowed;opacity:.5}.error-hint{margin-left:82px}.cui-drag-drop-placeholder{height:44px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "component", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: ["rows", "noBordersAndPaddings"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiDragPointerDirective, selector: "[cuiDragPointer]" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCheckListBlockListItemEvaluationCriteriaComponent, decorators: [{
             type: Component,
@@ -9490,7 +10300,7 @@ class CuiCheckListBlockListItemEvaluationComponent {
         array.splice(toIndex, 0, item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCheckListBlockListItemEvaluationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCheckListBlockListItemEvaluationComponent, isStandalone: true, selector: "cui-checklist-block-list-item-evaluation", inputs: { checkListItem: { classPropertyName: "checkListItem", publicName: "checkListItem", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <div class=\"action\">\n        <div class=\"action__inputs-container\">\n            <div\n                class=\"action__input\"\n                [formGroup]=\"photoFormGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('PHOTO') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n            <div\n                class=\"action__input\"\n                [formGroup]=\"commentFormGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('COMMENT') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n        </div>\n        <div class=\"action__criteria-title-container\">\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                for=\"evaluationCriteria\"\n            >\n                {{ t('EVALUATION_CRITERIA') }}\n            </label>\n            <p class=\"action__criteria-subtitle\">{{ t('EACH_EVALUATION_CRITERION_SHOULD_BE') }}</p>\n        </div>\n        <ul\n            cuiDragList\n            class=\"list\"\n        >\n            @for (control of evaluationCriteriaFormArray.controls; track control.controls['id']; let index = $index) {\n                <li\n                    cuiChecklistBlockListItemEvaluationCriteria\n                    [index]=\"index + 1\"\n                    cuiDragDrop\n                    [disabled]=\"isAddButtonDisabled()\"\n                    (elementDragged)=\"onDrop($event)\"\n                    [criteriaGroup]=\"control\"\n                    [evaluationCriteriaFormArray]=\"evaluationCriteriaFormArray\"\n                    [loadingIds]=\"loadingIds()\"\n                    (saveClicked)=\"onSaveEvaluationCriteria($event)\"\n                    (cancelClicked)=\"onCancelNewEvaluationCriteria()\"\n                    (deleteClicked)=\"openModalDeleteEvaluationCriteria($event)\"\n                ></li>\n            } @empty {\n                <li\n                    cuiEmptyState\n                    [subtitle]=\"t('NO_EVALUATION_CRITERIA_TO_VIEW')\"\n                ></li>\n            }\n        </ul>\n        <div class=\"action__footer\">\n            <button\n                cuiButton\n                size=\"xxs\"\n                appearance=\"flat\"\n                icon=\"cuiIconPlus\"\n                type=\"button\"\n                [disabled]=\"isAddButtonDisabled()\"\n                (click)=\"onAddEvaluationCriteriaItem()\"\n            >\n                {{ t('NEW_OPTION') }}\n            </button>\n        </div>\n    </div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;border-radius:inherit}.action{padding:15px;display:flex;flex-direction:column;border-radius:0 0 8px 8px;gap:16px;background:var(--cui-base-10)}.action__criteria-title-container{display:flex;flex-direction:column;gap:4px}.action__criteria-subtitle{font-weight:400;font-size:14px;line-height:20px;color:var(--cui-base-500)}.action__inputs-container{display:flex;flex-direction:column;gap:8px;background:var(--cui-base-0)}.action__input{padding-right:11px;padding-left:11px;display:flex;height:48px;flex-direction:row;justify-content:space-between;border:1px solid var(--cui-base-200);border-radius:8px}.action__criteria{display:flex;flex-direction:row;align-items:center;gap:12px}.action__criteria-index{padding:8px;font-weight:500;font-size:14px;line-height:20px;display:flex;width:44px;flex-direction:row;justify-content:center;align-items:center;border-radius:8px;background-color:var(--cui-base-0)}.action__criteria-input{flex:1;background:var(--cui-base-0)}.list{display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "component", type: CuiCheckListBlockListItemEvaluationCriteriaComponent, selector: "li[cuiChecklistBlockListItemEvaluationCriteria]", inputs: ["loadingIds", "index", "criteriaGroup", "evaluationCriteriaFormArray"], outputs: ["saveClicked", "deleteClicked", "cancelClicked"] }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "ngmodule", type: CuiToggleModule }, { kind: "component", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]" }, { kind: "component", type: CuiEmptyStateComponent, selector: "cui-empty-state, [cuiEmptyState]", inputs: ["title", "subtitle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: CuiDragDropDirective, selector: "[cuiDragDrop]", inputs: ["disabled"], outputs: ["elementDragged"] }, { kind: "directive", type: CuiDragListDirective, selector: "[cuiDragList]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCheckListBlockListItemEvaluationComponent, isStandalone: true, selector: "cui-checklist-block-list-item-evaluation", inputs: { checkListItem: { classPropertyName: "checkListItem", publicName: "checkListItem", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <div class=\"action\">\n        <div class=\"action__inputs-container\">\n            <div\n                class=\"action__input\"\n                [formGroup]=\"photoFormGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('PHOTO') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n            <div\n                class=\"action__input\"\n                [formGroup]=\"commentFormGroup\"\n            >\n                <label cuiLabel>\n                    <input\n                        cuiCheckbox\n                        type=\"checkbox\"\n                        formControlName=\"isEnable\"\n                    />\n                    {{ t('COMMENT') }}\n                </label>\n                <label cuiLabel>\n                    <input\n                        cuiToggle\n                        type=\"checkbox\"\n                        formControlName=\"isRequired\"\n                    />\n                    {{ t('REQUIRED') }}\n                </label>\n            </div>\n        </div>\n        <div class=\"action__criteria-title-container\">\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                for=\"evaluationCriteria\"\n            >\n                {{ t('EVALUATION_CRITERIA') }}\n            </label>\n            <p class=\"action__criteria-subtitle\">{{ t('EACH_EVALUATION_CRITERION_SHOULD_BE') }}</p>\n        </div>\n        <ul\n            cuiDragList\n            class=\"list\"\n        >\n            @for (control of evaluationCriteriaFormArray.controls; track control.controls['id']; let index = $index) {\n                <li\n                    cuiChecklistBlockListItemEvaluationCriteria\n                    [index]=\"index + 1\"\n                    cuiDragDrop\n                    [disabled]=\"isAddButtonDisabled()\"\n                    (elementDragged)=\"onDrop($event)\"\n                    [criteriaGroup]=\"control\"\n                    [evaluationCriteriaFormArray]=\"evaluationCriteriaFormArray\"\n                    [loadingIds]=\"loadingIds()\"\n                    (saveClicked)=\"onSaveEvaluationCriteria($event)\"\n                    (cancelClicked)=\"onCancelNewEvaluationCriteria()\"\n                    (deleteClicked)=\"openModalDeleteEvaluationCriteria($event)\"\n                ></li>\n            } @empty {\n                <li\n                    cuiEmptyState\n                    [subtitle]=\"t('NO_EVALUATION_CRITERIA_TO_VIEW')\"\n                ></li>\n            }\n        </ul>\n        <div class=\"action__footer\">\n            <button\n                cuiButton\n                size=\"xxs\"\n                appearance=\"flat\"\n                icon=\"cuiIconPlus\"\n                type=\"button\"\n                [disabled]=\"isAddButtonDisabled()\"\n                (click)=\"onAddEvaluationCriteriaItem()\"\n            >\n                {{ t('NEW_OPTION') }}\n            </button>\n        </div>\n    </div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;border-radius:inherit}.action{padding:15px;display:flex;flex-direction:column;border-radius:0 0 8px 8px;gap:16px;background:var(--cui-base-10)}.action__criteria-title-container{display:flex;flex-direction:column;gap:4px}.action__criteria-subtitle{font-weight:400;font-size:14px;line-height:20px;color:var(--cui-base-500)}.action__inputs-container{display:flex;flex-direction:column;gap:8px;background:var(--cui-base-0)}.action__input{padding-right:11px;padding-left:11px;display:flex;height:48px;flex-direction:row;justify-content:space-between;border:1px solid var(--cui-base-200);border-radius:8px}.action__criteria{display:flex;flex-direction:row;align-items:center;gap:12px}.action__criteria-index{padding:8px;font-weight:500;font-size:14px;line-height:20px;display:flex;width:44px;flex-direction:row;justify-content:center;align-items:center;border-radius:8px;background-color:var(--cui-base-0)}.action__criteria-input{flex:1;background:var(--cui-base-0)}.list{display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "component", type: CuiCheckListBlockListItemEvaluationCriteriaComponent, selector: "li[cuiChecklistBlockListItemEvaluationCriteria]", inputs: ["loadingIds", "index", "criteriaGroup", "evaluationCriteriaFormArray"], outputs: ["saveClicked", "deleteClicked", "cancelClicked"] }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "ngmodule", type: CuiToggleModule }, { kind: "component", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]" }, { kind: "component", type: CuiEmptyStateComponent, selector: "cui-empty-state, [cuiEmptyState]", inputs: ["title", "subtitle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: CuiDragDropDirective, selector: "[cuiDragDrop]", inputs: ["disabled"], outputs: ["elementDragged"] }, { kind: "directive", type: CuiDragListDirective, selector: "[cuiDragList]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCheckListBlockListItemEvaluationComponent, decorators: [{
             type: Component,
@@ -9927,7 +10737,7 @@ class CuiCriterionInfoFormComponent {
         return !this.isDescriptionEmpty() && !this.form.invalid;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCriterionInfoFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCriterionInfoFormComponent, isStandalone: true, selector: "cui-criterion-info-form", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: true, transformFunction: null }, framerId: { classPropertyName: "framerId", publicName: "framerId", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { formChanged: "formChanged", isFormValidChanged: "isFormValidChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <section class=\"content\">\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"titleId\"\n            >\n                {{ t('TITLE') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"titleId\"\n                [cuiTextFieldPlaceholder]=\"t('ADD_A_TITLE')\"\n                [cuiTextFieldIsError]=\"isTitleError\"\n                [formControl]=\"form.controls.title\"\n            />\n\n            @if (isTitleError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.title\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"descriptionId\"\n            >\n                {{ t('SHORT_DESCRIPTION') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"descriptionId\"\n                cuiTextFieldPlaceholder=\"{{ t('SHORT_DESCRIPTION') }}...\"\n                [cuiTextFieldIsError]=\"isDescriptionError\"\n                [formControl]=\"form.controls.description\"\n            />\n\n            @if (isDescriptionError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.description\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n\n        <cui-utility-thumbnail\n            [context]=\"config().requestOptions\"\n            [framerId]=\"framerId()\"\n            [(thumbnail)]=\"thumbnail\"\n        />\n\n        @if (editorId(); as editorId) {\n            <cui-editor-block\n                [title]=\"form.controls.title.value || title()\"\n                [config]=\"config()\"\n                [editorId]=\"editorId\"\n                [required]=\"true\"\n                class=\"editor\"\n                (editorEmpty)=\"onEditorEmpty($event)\"\n            />\n        }\n    </section>\n</ng-container>\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{--editor-height: 650px;display:block}:host .editor{--max-editor-height: var(--editor-height)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}\n"], dependencies: [{ kind: "ngmodule", type: CuiAccordionModule }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiEditorBlockComponent, selector: "cui-editor-block", inputs: ["title", "editorId", "config", "required"], outputs: ["editorEmpty"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "component", type: CuiUtilityThumbnailComponent, selector: "cui-utility-thumbnail", inputs: ["context", "thumbnail", "framerId"], outputs: ["thumbnailChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCriterionInfoFormComponent, isStandalone: true, selector: "cui-criterion-info-form", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: true, transformFunction: null }, framerId: { classPropertyName: "framerId", publicName: "framerId", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { formChanged: "formChanged", isFormValidChanged: "isFormValidChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <section class=\"content\">\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"titleId\"\n            >\n                {{ t('TITLE') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"titleId\"\n                [cuiTextFieldPlaceholder]=\"t('ADD_A_TITLE')\"\n                [cuiTextFieldIsError]=\"isTitleError\"\n                [formControl]=\"form.controls.title\"\n            />\n\n            @if (isTitleError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.title\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"descriptionId\"\n            >\n                {{ t('SHORT_DESCRIPTION') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"descriptionId\"\n                cuiTextFieldPlaceholder=\"{{ t('SHORT_DESCRIPTION') }}...\"\n                [cuiTextFieldIsError]=\"isDescriptionError\"\n                [formControl]=\"form.controls.description\"\n            />\n\n            @if (isDescriptionError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.description\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n\n        <cui-utility-thumbnail\n            [context]=\"config().requestOptions\"\n            [framerId]=\"framerId()\"\n            [(thumbnail)]=\"thumbnail\"\n        />\n\n        @if (editorId(); as editorId) {\n            <cui-editor-block\n                [title]=\"form.controls.title.value || title()\"\n                [config]=\"config()\"\n                [editorId]=\"editorId\"\n                [required]=\"true\"\n                class=\"editor\"\n                (editorEmpty)=\"onEditorEmpty($event)\"\n            />\n        }\n    </section>\n</ng-container>\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{--editor-height: 650px;display:block}:host .editor{--max-editor-height: var(--editor-height)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}\n"], dependencies: [{ kind: "ngmodule", type: CuiAccordionModule }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiEditorBlockComponent, selector: "cui-editor-block", inputs: ["title", "editorId", "config", "required"], outputs: ["editorEmpty"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "component", type: CuiUtilityThumbnailComponent, selector: "cui-utility-thumbnail", inputs: ["context", "thumbnail", "framerId"], outputs: ["thumbnailChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCriterionInfoFormComponent, decorators: [{
             type: Component,
@@ -10150,7 +10960,7 @@ class CuiInstructionInfoFormComponent {
         return !this.isDescriptionEmpty() && !this.form.invalid;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInstructionInfoFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiInstructionInfoFormComponent, isStandalone: true, selector: "cui-instruction-info-form", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: true, transformFunction: null }, framerId: { classPropertyName: "framerId", publicName: "framerId", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { formChanged: "formChanged", isFormValidChanged: "isFormValidChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <section class=\"content\">\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"titleId\"\n            >\n                {{ t('TITLE') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"titleId\"\n                [cuiTextFieldPlaceholder]=\"t('ADD_A_TITLE')\"\n                [cuiTextFieldIsError]=\"isTitleError\"\n                [formControl]=\"form.controls.title\"\n            />\n\n            @if (isTitleError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.title\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"descriptionId\"\n            >\n                {{ t('SHORT_DESCRIPTION') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"descriptionId\"\n                cuiTextFieldPlaceholder=\"{{ t('SHORT_DESCRIPTION') }}...\"\n                [cuiTextFieldIsError]=\"isDescriptionError\"\n                [formControl]=\"form.controls.description\"\n            />\n\n            @if (isDescriptionError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.description\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n        <cui-utility-thumbnail\n            [context]=\"config().requestOptions\"\n            [framerId]=\"framerId()\"\n            [(thumbnail)]=\"thumbnail\"\n        />\n\n        @if (editorId(); as editorId) {\n            <cui-editor-block\n                [title]=\"form.controls.title.value || title()\"\n                [config]=\"config()\"\n                [editorId]=\"editorId\"\n                [required]=\"true\"\n                class=\"editor\"\n                (editorEmpty)=\"onEditorEmpty($event)\"\n            />\n        }\n    </section>\n</ng-container>\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{--editor-height: 650px;display:block}:host .editor{--max-editor-height: var(--editor-height)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}\n"], dependencies: [{ kind: "ngmodule", type: CuiAccordionModule }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiEditorBlockComponent, selector: "cui-editor-block", inputs: ["title", "editorId", "config", "required"], outputs: ["editorEmpty"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "component", type: CuiUtilityThumbnailComponent, selector: "cui-utility-thumbnail", inputs: ["context", "thumbnail", "framerId"], outputs: ["thumbnailChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiInstructionInfoFormComponent, isStandalone: true, selector: "cui-instruction-info-form", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: true, transformFunction: null }, framerId: { classPropertyName: "framerId", publicName: "framerId", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { formChanged: "formChanged", isFormValidChanged: "isFormValidChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    <section class=\"content\">\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"titleId\"\n            >\n                {{ t('TITLE') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"titleId\"\n                [cuiTextFieldPlaceholder]=\"t('ADD_A_TITLE')\"\n                [cuiTextFieldIsError]=\"isTitleError\"\n                [formControl]=\"form.controls.title\"\n            />\n\n            @if (isTitleError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.title\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n        <cui-form-field>\n            <label\n                cuiLabel\n                [isRequired]=\"true\"\n                [for]=\"descriptionId\"\n            >\n                {{ t('SHORT_DESCRIPTION') }}\n            </label>\n\n            <cui-input-text\n                [cuiTextFieldId]=\"descriptionId\"\n                cuiTextFieldPlaceholder=\"{{ t('SHORT_DESCRIPTION') }}...\"\n                [cuiTextFieldIsError]=\"isDescriptionError\"\n                [formControl]=\"form.controls.description\"\n            />\n\n            @if (isDescriptionError) {\n                <cui-general-control-error-hint\n                    [control]=\"form.controls.description\"\n                    [isVisible]=\"true\"\n                />\n            }\n        </cui-form-field>\n\n        <cui-utility-thumbnail\n            [context]=\"config().requestOptions\"\n            [framerId]=\"framerId()\"\n            [(thumbnail)]=\"thumbnail\"\n        />\n\n        @if (editorId(); as editorId) {\n            <cui-editor-block\n                [title]=\"form.controls.title.value || title()\"\n                [config]=\"config()\"\n                [editorId]=\"editorId\"\n                [required]=\"true\"\n                class=\"editor\"\n                (editorEmpty)=\"onEditorEmpty($event)\"\n            />\n        }\n    </section>\n</ng-container>\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{--editor-height: 650px;display:block}:host .editor{--max-editor-height: var(--editor-height)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}\n"], dependencies: [{ kind: "ngmodule", type: CuiAccordionModule }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiEditorBlockComponent, selector: "cui-editor-block", inputs: ["title", "editorId", "config", "required"], outputs: ["editorEmpty"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: CuiHintModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "component", type: CuiUtilityThumbnailComponent, selector: "cui-utility-thumbnail", inputs: ["context", "thumbnail", "framerId"], outputs: ["thumbnailChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInstructionInfoFormComponent, decorators: [{
             type: Component,
@@ -10771,7 +11581,7 @@ class CuiSelectModalSearchComponent {
             .subscribe((value) => this.searchStringChanged.emit(value));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiSelectModalSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiSelectModalSearchComponent, isStandalone: true, selector: "cui-select-modal-search", inputs: { searchControl: { classPropertyName: "searchControl", publicName: "searchControl", isSignal: true, isRequired: false, transformFunction: null }, controlDelay: { classPropertyName: "controlDelay", publicName: "controlDelay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchStringChanged: "searchStringChanged" }, ngImport: i0, template: "<cui-input-text\n    cuiTextFieldPlaceholder=\"Search...\"\n    cuiTextFieldIconLeft=\"cuiIconSearch\"\n    [formControl]=\"searchControl()\"\n    class=\"search\"\n/>\n<button\n    class=\"filters\"\n    type=\"button\"\n    cuiIconButton\n    icon=\"cuiIconFiltersLines\"\n></button>\n", styles: [":host{padding-right:15px;display:flex;align-items:center;gap:4px}.search{width:100%}.filters{padding:4px;width:auto;height:auto}\n"], dependencies: [{ kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIconLeftDirective, selector: "[cuiTextFieldIconLeft]", inputs: ["cuiTextFieldIconLeft"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiSelectModalSearchComponent, isStandalone: true, selector: "cui-select-modal-search", inputs: { searchControl: { classPropertyName: "searchControl", publicName: "searchControl", isSignal: true, isRequired: false, transformFunction: null }, controlDelay: { classPropertyName: "controlDelay", publicName: "controlDelay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchStringChanged: "searchStringChanged" }, ngImport: i0, template: "<cui-input-text\n    cuiTextFieldPlaceholder=\"Search...\"\n    cuiTextFieldIconLeft=\"cuiIconSearch\"\n    [formControl]=\"searchControl()\"\n    class=\"search\"\n/>\n<button\n    class=\"filters\"\n    type=\"button\"\n    cuiIconButton\n    icon=\"cuiIconFiltersLines\"\n></button>\n", styles: [":host{padding-right:15px;display:flex;align-items:center;gap:4px}.search{width:100%}.filters{padding:4px;width:auto;height:auto}\n"], dependencies: [{ kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIconLeftDirective, selector: "[cuiTextFieldIconLeft]", inputs: ["cuiTextFieldIconLeft"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiSelectModalSearchComponent, decorators: [{
             type: Component,
@@ -11488,7 +12298,7 @@ class ConsumableFormItemComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ConsumableFormItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ConsumableFormItemComponent, isStandalone: true, selector: "cc-consumable-form-item", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, consumptionOptions: { classPropertyName: "consumptionOptions", publicName: "consumptionOptions", isSignal: true, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { consumableChanged: "consumableChanged" }, ngImport: i0, template: "@let formData = form();\n\n@if (readonly()) {\n    <cui-consumable-form-item-readonly\n        [title]=\"title()\"\n        [consumable]=\"consumable()\"\n    />\n} @else {\n    <form\n        [formGroup]=\"formData\"\n        *transloco=\"let t\"\n        class=\"form\"\n    >\n        <span class=\"title\">{{ title() }}</span>\n\n        <div class=\"wrapper-input\">\n            <div class=\"form__input\">\n                @let quantity = formData.controls.quantity;\n\n                <label [for]=\"consumptionId\">{{ t('AMOUNT') }}</label>\n                <div class=\"field\">\n                    <cui-input-number\n                        [cuiTextFieldId]=\"quantityId\"\n                        cuiTextFieldPlaceholder=\"0\"\n                        formControlName=\"quantity\"\n                        [cuiTextFieldIsError]=\"!!quantity.errors && quantity.dirty\"\n                        class=\"input\"\n                    />\n\n                    <cui-select\n                        [options]=\"piecesOptions()\"\n                        [class.options--error]=\"hasFormError()\"\n                        formControlName=\"unit\"\n                        class=\"options\"\n                    />\n                </div>\n                <cui-general-control-error-hint\n                    [control]=\"quantity\"\n                    [isVisible]=\"!!quantity.errors && quantity.dirty\"\n                />\n            </div>\n\n            <div class=\"form__input\">\n                @let measureFormGroup = formData.controls.measure;\n                @let consumption = measureFormGroup.controls.value;\n\n                <label [for]=\"consumptionId\">{{ t('MEASURE') }}</label>\n                <div\n                    class=\"field\"\n                    [formGroup]=\"measureFormGroup\"\n                >\n                    <cui-input-number\n                        [cuiTextFieldId]=\"consumptionId\"\n                        cuiTextFieldPlaceholder=\"0\"\n                        formControlName=\"value\"\n                        [precision]=\"3\"\n                        [cuiTextFieldIsError]=\"!!consumption.errors && consumption.dirty\"\n                        class=\"input\"\n                    />\n\n                    <cui-select\n                        [options]=\"consumptionOptions()\"\n                        [class.options--error]=\"hasFormError()\"\n                        formControlName=\"unit\"\n                        class=\"options\"\n                    />\n                </div>\n                <cui-general-control-error-hint\n                    [control]=\"consumption\"\n                    [isVisible]=\"!!consumption.errors && consumption.dirty\"\n                />\n            </div>\n        </div>\n    </form>\n}\n", styles: [":host{padding-top:6px;padding-bottom:6px;display:block}.title{font-weight:400;font-size:14px;line-height:20px;min-width:80px;align-self:center}.input{padding-right:84px;width:240px}.options{position:absolute;inset:1px 1px 1px auto;min-width:90px}.options ::ng-deep .c-button{border:0;height:100%}.options--error{inset:1px 20px 1px auto}.wrapper-input{display:flex;flex-direction:row;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.form{display:flex;flex-direction:row;gap:8px;flex-wrap:wrap}.form__input{display:flex;flex-direction:column;gap:4px}.form__input cui-general-control-error-hint{display:block;min-height:20px}.field{display:flex;flex-direction:row;gap:4px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: CuiAccordionModule }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "component", type: CuiSelectComponent, selector: "cui-select[options]", inputs: ["options", "defaultOptionText"] }, { kind: "component", type: ConsumableFormItemReadonlyComponent, selector: "cui-consumable-form-item-readonly", inputs: ["title", "consumable"] }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ConsumableFormItemComponent, isStandalone: true, selector: "cc-consumable-form-item", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, consumptionOptions: { classPropertyName: "consumptionOptions", publicName: "consumptionOptions", isSignal: true, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { consumableChanged: "consumableChanged" }, ngImport: i0, template: "@let formData = form();\n\n@if (readonly()) {\n    <cui-consumable-form-item-readonly\n        [title]=\"title()\"\n        [consumable]=\"consumable()\"\n    />\n} @else {\n    <form\n        [formGroup]=\"formData\"\n        *transloco=\"let t\"\n        class=\"form\"\n    >\n        <span class=\"title\">{{ title() }}</span>\n\n        <div class=\"wrapper-input\">\n            <div class=\"form__input\">\n                @let quantity = formData.controls.quantity;\n\n                <label [for]=\"consumptionId\">{{ t('AMOUNT') }}</label>\n                <div class=\"field\">\n                    <cui-input-number\n                        [cuiTextFieldId]=\"quantityId\"\n                        cuiTextFieldPlaceholder=\"0\"\n                        formControlName=\"quantity\"\n                        [cuiTextFieldIsError]=\"!!quantity.errors && quantity.dirty\"\n                        class=\"input\"\n                    />\n\n                    <cui-select\n                        [options]=\"piecesOptions()\"\n                        [class.options--error]=\"hasFormError()\"\n                        formControlName=\"unit\"\n                        class=\"options\"\n                    />\n                </div>\n                <cui-general-control-error-hint\n                    [control]=\"quantity\"\n                    [isVisible]=\"!!quantity.errors && quantity.dirty\"\n                />\n            </div>\n\n            <div class=\"form__input\">\n                @let measureFormGroup = formData.controls.measure;\n                @let consumption = measureFormGroup.controls.value;\n\n                <label [for]=\"consumptionId\">{{ t('MEASURE') }}</label>\n                <div\n                    class=\"field\"\n                    [formGroup]=\"measureFormGroup\"\n                >\n                    <cui-input-number\n                        [cuiTextFieldId]=\"consumptionId\"\n                        cuiTextFieldPlaceholder=\"0\"\n                        formControlName=\"value\"\n                        [precision]=\"3\"\n                        [cuiTextFieldIsError]=\"!!consumption.errors && consumption.dirty\"\n                        class=\"input\"\n                    />\n\n                    <cui-select\n                        [options]=\"consumptionOptions()\"\n                        [class.options--error]=\"hasFormError()\"\n                        formControlName=\"unit\"\n                        class=\"options\"\n                    />\n                </div>\n                <cui-general-control-error-hint\n                    [control]=\"consumption\"\n                    [isVisible]=\"!!consumption.errors && consumption.dirty\"\n                />\n            </div>\n        </div>\n    </form>\n}\n", styles: [":host{padding-top:6px;padding-bottom:6px;display:block}.title{font-weight:400;font-size:14px;line-height:20px;min-width:80px;align-self:center}.input{padding-right:84px;width:240px}.options{position:absolute;inset:1px 1px 1px auto;min-width:90px}.options ::ng-deep .c-button{border:0;height:100%}.options--error{inset:1px 20px 1px auto}.wrapper-input{display:flex;flex-direction:row;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.form{display:flex;flex-direction:row;gap:8px;flex-wrap:wrap}.form__input{display:flex;flex-direction:column;gap:4px}.form__input cui-general-control-error-hint{display:block;min-height:20px}.field{display:flex;flex-direction:row;gap:4px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: CuiAccordionModule }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "component", type: CuiSelectComponent, selector: "cui-select[options]", inputs: ["options", "defaultOptionText"] }, { kind: "component", type: ConsumableFormItemReadonlyComponent, selector: "cui-consumable-form-item-readonly", inputs: ["title", "consumable"] }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ConsumableFormItemComponent, decorators: [{
             type: Component,
@@ -11578,7 +12388,7 @@ class ToolFormComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ToolFormComponent, isStandalone: true, selector: "cui-tool-form", inputs: { utilityId: { classPropertyName: "utilityId", publicName: "utilityId", isSignal: true, isRequired: true, transformFunction: null }, tool: { classPropertyName: "tool", publicName: "tool", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, resourceType: { classPropertyName: "resourceType", publicName: "resourceType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toolChanged: "toolChanged", toolDeleted: "toolDeleted" }, host: { properties: { "class._disabled": "isLoading() || tool().isDelete" } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    @let controlsData = controls();\n\n    @if (readonly()) {\n        <cc-tool-form-readonly [tool]=\"tool()\" />\n    } @else if (controlsData) {\n        <td class=\"cc-table__td info custom\">\n            {{ tool().name }}\n\n            @if (tool().isDelete) {\n                <cui-badge\n                    class=\"badge\"\n                    [size]=\"'sm'\"\n                    color=\"red\"\n                >\n                    {{ t('DELETED') }}\n                </cui-badge>\n            }\n        </td>\n        <td class=\"cc-table__td custom\">\n            <cui-input-number\n                type=\"text\"\n                [formControl]=\"controlsData.quantity\"\n                [cuiTextFieldIsError]=\"!!controlsData.quantity.errors && controlsData.quantity.dirty\"\n            />\n            <cui-general-control-error-hint\n                [control]=\"controlsData.quantity\"\n                [isVisible]=\"!!controlsData.quantity.errors && controlsData.quantity.dirty\"\n            />\n        </td>\n        <td class=\"cc-table__td custom\">\n            <cui-select\n                [formControl]=\"controlsData.unit\"\n                [options]=\"toolboxOptions()\"\n            />\n        </td>\n        <td class=\"cc-table__td button custom\">\n            <button\n                type=\"button\"\n                cuiButton\n                icon=\"cuiIconTrash\"\n                size=\"xxs\"\n                appearance=\"ghost\"\n                [isLoaderShown]=\"isLoading()\"\n                (click)=\"onDeleteToolbox()\"\n            ></button>\n        </td>\n    }\n</ng-container>\n", styles: [":host{display:contents}:host._disabled .custom{pointer-events:none;opacity:.7}:host._disabled .button{opacity:1;pointer-events:all}.info{display:flex;flex-direction:row;gap:0}.badge{margin-left:auto}.custom{padding-right:4px;padding-left:4px}.readonly{min-height:36px}\n"], dependencies: [{ kind: "component", type: ToolFormReadonlyComponent, selector: "cc-tool-form-readonly", inputs: ["tool"] }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "component", type: CuiSelectComponent, selector: "cui-select[options]", inputs: ["options", "defaultOptionText"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CuiBadgeModule }, { kind: "component", type: CuiBadgeComponent, selector: "cui-badge", inputs: ["color", "size", "variant"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ToolFormComponent, isStandalone: true, selector: "cui-tool-form", inputs: { utilityId: { classPropertyName: "utilityId", publicName: "utilityId", isSignal: true, isRequired: true, transformFunction: null }, tool: { classPropertyName: "tool", publicName: "tool", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, resourceType: { classPropertyName: "resourceType", publicName: "resourceType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toolChanged: "toolChanged", toolDeleted: "toolDeleted" }, host: { properties: { "class._disabled": "isLoading() || tool().isDelete" } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n    @let controlsData = controls();\n\n    @if (readonly()) {\n        <cc-tool-form-readonly [tool]=\"tool()\" />\n    } @else if (controlsData) {\n        <td class=\"cc-table__td info custom\">\n            {{ tool().name }}\n\n            @if (tool().isDelete) {\n                <cui-badge\n                    class=\"badge\"\n                    [size]=\"'sm'\"\n                    color=\"red\"\n                >\n                    {{ t('DELETED') }}\n                </cui-badge>\n            }\n        </td>\n        <td class=\"cc-table__td custom\">\n            <cui-input-number\n                type=\"text\"\n                [formControl]=\"controlsData.quantity\"\n                [cuiTextFieldIsError]=\"!!controlsData.quantity.errors && controlsData.quantity.dirty\"\n            />\n            <cui-general-control-error-hint\n                [control]=\"controlsData.quantity\"\n                [isVisible]=\"!!controlsData.quantity.errors && controlsData.quantity.dirty\"\n            />\n        </td>\n        <td class=\"cc-table__td custom\">\n            <cui-select\n                [formControl]=\"controlsData.unit\"\n                [options]=\"toolboxOptions()\"\n            />\n        </td>\n        <td class=\"cc-table__td button custom\">\n            <button\n                type=\"button\"\n                cuiButton\n                icon=\"cuiIconTrash\"\n                size=\"xxs\"\n                appearance=\"ghost\"\n                [isLoaderShown]=\"isLoading()\"\n                (click)=\"onDeleteToolbox()\"\n            ></button>\n        </td>\n    }\n</ng-container>\n", styles: [":host{display:contents}:host._disabled .custom{pointer-events:none;opacity:.7}:host._disabled .button{opacity:1;pointer-events:all}.info{display:flex;flex-direction:row;gap:0}.badge{margin-left:auto}.custom{padding-right:4px;padding-left:4px}.readonly{min-height:36px}\n"], dependencies: [{ kind: "component", type: ToolFormReadonlyComponent, selector: "cc-tool-form-readonly", inputs: ["tool"] }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "component", type: CuiSelectComponent, selector: "cui-select[options]", inputs: ["options", "defaultOptionText"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CuiBadgeModule }, { kind: "component", type: CuiBadgeComponent, selector: "cui-badge", inputs: ["color", "size", "variant"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToolFormComponent, decorators: [{
             type: Component,
@@ -12687,5 +13497,5 @@ const CuiTranslations = {
  * Generated bundle index. Do not edit.
  */
 
-export { AlertHintComponent, AngularOutsideLoaderService, AssigneeRoleItemComponent, AssigneeRolesTabsComponent, ButtonChangeThemeComponent, CUI_ACTIVITY_SERVICE_TOKEN, CUI_ALERTS, CUI_ALERT_CONTEXT, CUI_ALERT_DEFAULT_OPTIONS, CUI_ALERT_OPTIONS, CUI_ANIMATIONS_DEFAULT_DURATION, CUI_BADGE_DEFAULT_OPTIONS, CUI_BADGE_OPTIONS, CUI_BANNER_DEFAULT_OPTIONS, CUI_BANNER_OPTIONS, CUI_BUTTON_DEFAULT_OPTIONS, CUI_BUTTON_OPTIONS, CUI_DEFAULT_THEME, CUI_DIALOGS, CUI_DIALOG_CONTEXT, CUI_DIALOG_DEFAULT_OPTIONS, CUI_DIALOG_OPTIONS, CUI_INPUT_TIME_DEFAULT_OPTIONS, CUI_INPUT_TIME_OPTIONS, CUI_NOTIFICATION_DEFAULT_OPTIONS, CUI_NOTIFICATION_ICONS, CUI_NOTIFICATION_ICON_OPTIONS, CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE, CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE, CUI_NOTIFICATION_OPTIONS, CUI_RESOURCE_STATE_SERVICE_TOKEN, CUI_ROOT_SELECTOR, CUI_STORAGE_LIST_SERVICE_TOKEN, CUI_SUBJECT_MODAL_SERVICE_TOKEN, CUI_TABS_SERVICE_TOKEN, CUI_TEXT_FIELD_CONTROLLER, CUI_TEXT_FIELD_ICON_LEFT, CUI_TEXT_FIELD_ID, CUI_TEXT_FIELD_IS_ERROR, CUI_TEXT_FIELD_PLACEHOLDER, CUI_TEXT_FIELD_SIZE, CUI_TEXT_FILED_CONTROLLER_PROVIDER, CUI_THEME, CUI_THEME_STORAGE_DEFAULT_KEY, CUI_THEME_STORAGE_KEY, CUI_TOOLTIP_COMPONENT, CUI_TOOLTIP_DEFAULT_OPTIONS, CUI_TOOLTIP_DIRECTIONS, CUI_TOOLTIP_OPTIONS, CUI_TOOLTIP_PROVIDERS, CUI_USED_ELEMENTS_SERVICE_TOKEN, CUI_UTILITY_SERVICE_TOKEN, ContentHeaderComponent, CuiAbstractTabsComponent, CuiAccordionComponent, CuiAccordionDirective, CuiAccordionItemComponent, CuiAccordionModule, CuiActivityBaseService, CuiActivityImplService, CuiAlertComponent, CuiAlertModule, CuiAlertService, CuiAlertsComponent, CuiAttachesTool, CuiAuthBase, CuiAuthService, CuiBadgeComponent, CuiBadgeModule, CuiBannerComponent, CuiBannerModule, CuiBreadcrumbComponent, CuiBreadcrumbsComponent, CuiBreadcrumbsModule, CuiButtonComponent, CuiButtonGroupComponent, CuiButtonGroupModule, CuiButtonModule, CuiCardWrapperComponent, CuiCategoriesComponent, CuiCheckboxComponent, CuiCheckboxModule, CuiChecklistBlockComponent, CuiCircleLoaderComponent, CuiContentWrapperComponent, CuiContextMenuComponent, CuiContextMenuModule, CuiCriterionInfoComponent, CuiCriterionInfoFormComponent, CuiCriterionModalCreateComponent, CuiCriterionReadonlyInfoComponent, CuiDeleteModalComponent, CuiDialogActionsComponent, CuiDialogComponent, CuiDialogHeaderComponent, CuiDialogModule, CuiDialogService, CuiDialogsComponent, CuiDropdownDirective, CuiDropdownWrapperComponent, CuiEditorBlockComponent, CuiEditorComponent, CuiEditorModalComponent, CuiEditorReadonlyComponent, CuiEditorTranslations, CuiEmptyStateComponent, CuiFileIconComponent, CuiFileUploader, CuiFileUploaderStatus, CuiFormFieldComponent, CuiFormFieldModule, CuiFramerPreviewComponent, CuiGeneralControlErrorHintComponent, CuiGhostInputComponent, CuiGlobalErrorHandler, CuiHeaderTool, CuiHintComponent, CuiHintModule, CuiHybridStorageService, CuiIconButtonComponent, CuiIconButtonModule, CuiImageTool, CuiInputModule, CuiInputNumberComponent, CuiInputNumberModule, CuiInputPasswordComponent, CuiInputPasswordModule, CuiInputTextComponent, CuiInputTimeComponent, CuiInputTimeModule, CuiInstructionInfoComponent, CuiInstructionInfoFormComponent, CuiInstructionModalCreateComponent, CuiInstructionReadonlyInfoComponent, CuiLabelComponent, CuiLabelModule, CuiLayoutComponent, CuiLetterBoxComponent, CuiLibTranslations, CuiLinearLoaderComponent, CuiLinkMarker, CuiListTool, CuiLoaderComponent, CuiLoaderService, CuiLoadingState, CuiNotificationComponent, CuiNotificationModule, CuiPositionService, CuiPulseLoaderComponent, CuiRadioComponent, CuiRadioModule, CuiReadonlyCriterionModalComponent, CuiReadonlyInstructionModalComponent, CuiReadonlyUtilityModalComponent, CuiRenderDynamicComponentsComponent, CuiRenderDynamicComponentsService, CuiRoleMarker, CuiRootComponent, CuiRootModule, CuiSelectComponent, CuiSelectModalComponent, CuiSelectModalFolderComponent, CuiSelectModalSearchComponent, CuiSelectModalService, CuiSelectModule, CuiSelectedCategoryService, CuiSidebarContainerComponent, CuiSidebarHeaderComponent, CuiSidebarNavigationComponent, CuiSidebarNavigationContainerComponent, CuiSidebarNavigationItemComponent, CuiSidebarService, CuiSkeleton, CuiStatedLoaderComponent, CuiStorageListComponent, CuiSvgComponent, CuiSvgModule, CuiTabDirective, CuiTabsComponent, CuiTabsServiceImpl, CuiTextFieldController, CuiTextFieldControllerModule, CuiTextFieldIconLeftDirective, CuiTextFieldIdDirective, CuiTextFieldIsErrorDirective, CuiTextFieldPlaceholderDirective, CuiTextFieldSizeDirective, CuiTextareaComponent, CuiTextareaModule, CuiThemeService, CuiTimePipe, CuiToggleComponent, CuiToggleModule, CuiToolMarker, CuiTooltip, CuiTooltipComponent, CuiTooltipDescribe, CuiTooltipDirective, CuiTooltipDriver, CuiTooltipHost, CuiTooltipHover, CuiTooltipManual, CuiTooltipOptionsDirective, CuiTooltipOverflow, CuiTooltipPointer, CuiTooltipPosition, CuiTooltipService, CuiTooltipUnstyled, CuiTooltipUnstyledComponent, CuiTooltips, CuiTranslations, CuiUserActionContextMenuComponent, CuiUtilityModalComponent, CuiUtilityModalCreateComponent, CuiUtilityReadonlyThumbnailComponent, CuiUtilityThumbnailComponent, CuiVideoTool, CuiVisualViewportService, InsertedComponent, ModalDividedSectionComponent, ModalHeaderComponent, ModalHeaderInsertedButtonsComponent, ModalInfoTabComponent, ModalOperationPartComponent, ModalResourcesTabComponent, OptionsButtonComponent, RenderDynamicModalComponent, ResourceStateBaseService, ResourcesBlockComponent, ResourcesBlockPartComponent, ResourcesBlockTabsComponent$1 as ResourcesBlockTabsComponent, ResourcesOptionsComponent, SubjectModalBaseService, UTILITY_MODAL_SERVICE_TOKEN, UsedElementsBaseService, UtilityBaseService, UtilityInfoReadonlyComponent, createEditorTools, cuiAuthInterceptor, cuiCheckFixedPosition, cuiCreateDefaultValidators, cuiErrorHandlerInterceptor, cuiGetDuration, cuiIsObscured, cuiLoaderInterceptor, cuiOverrideOptions, cuiProvideEditor, cuiRemoveSpaces, cuiReplace, cuiToAnimationOptions, cuiTooltipOptionsProvider, cuiXNdjsonInterceptor, handleError, openFileInBrowser, presetConfigToken, provideCuiAuth, provideCuiErrorHandler, provideCuiTabs, setLoading, sseStreamReaderInterceptor };
+export { AlertHintComponent, AngularOutsideLoaderService, AssigneeRoleItemComponent, AssigneeRolesTabsComponent, ButtonChangeThemeComponent, CUI_ACTIVITY_SERVICE_TOKEN, CUI_ALERTS, CUI_ALERT_CONTEXT, CUI_ALERT_DEFAULT_OPTIONS, CUI_ALERT_OPTIONS, CUI_ANIMATIONS_DEFAULT_DURATION, CUI_BADGE_DEFAULT_OPTIONS, CUI_BADGE_OPTIONS, CUI_BANNER_DEFAULT_OPTIONS, CUI_BANNER_OPTIONS, CUI_BUTTON_DEFAULT_OPTIONS, CUI_BUTTON_OPTIONS, CUI_DEFAULT_THEME, CUI_DIALOGS, CUI_DIALOG_CONTEXT, CUI_DIALOG_DEFAULT_OPTIONS, CUI_DIALOG_OPTIONS, CUI_INPUT_TIME_DEFAULT_OPTIONS, CUI_INPUT_TIME_OPTIONS, CUI_NOTIFICATION_DEFAULT_OPTIONS, CUI_NOTIFICATION_ICONS, CUI_NOTIFICATION_ICON_OPTIONS, CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE, CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE, CUI_NOTIFICATION_OPTIONS, CUI_RESOURCE_STATE_SERVICE_TOKEN, CUI_ROOT_SELECTOR, CUI_STORAGE_LIST_SERVICE_TOKEN, CUI_SUBJECT_MODAL_SERVICE_TOKEN, CUI_TABS_SERVICE_TOKEN, CUI_TEXT_FIELD_CONTROLLER, CUI_TEXT_FIELD_ICON_LEFT, CUI_TEXT_FIELD_ID, CUI_TEXT_FIELD_IS_ERROR, CUI_TEXT_FIELD_PLACEHOLDER, CUI_TEXT_FIELD_SIZE, CUI_TEXT_FILED_CONTROLLER_PROVIDER, CUI_THEME, CUI_THEME_STORAGE_DEFAULT_KEY, CUI_THEME_STORAGE_KEY, CUI_TOOLTIP_COMPONENT, CUI_TOOLTIP_DEFAULT_OPTIONS, CUI_TOOLTIP_DIRECTIONS, CUI_TOOLTIP_OPTIONS, CUI_TOOLTIP_PROVIDERS, CUI_USED_ELEMENTS_SERVICE_TOKEN, CUI_UTILITY_SERVICE_TOKEN, ContentHeaderComponent, CuiAbstractTabsComponent, CuiAccordionComponent, CuiAccordionDirective, CuiAccordionItemComponent, CuiAccordionModule, CuiActivityBaseService, CuiActivityImplService, CuiAlertComponent, CuiAlertModule, CuiAlertService, CuiAlertsComponent, CuiAttachesTool, CuiAuthBase, CuiAuthService, CuiBadgeComponent, CuiBadgeModule, CuiBannerComponent, CuiBannerModule, CuiBreadcrumbComponent, CuiBreadcrumbsComponent, CuiBreadcrumbsModule, CuiButtonComponent, CuiButtonGroupComponent, CuiButtonGroupModule, CuiButtonModule, CuiCardWrapperComponent, CuiCategoriesComponent, CuiCheckboxComponent, CuiCheckboxModule, CuiChecklistBlockComponent, CuiCircleLoaderComponent, CuiContentWrapperComponent, CuiContextMenuComponent, CuiContextMenuModule, CuiCriterionInfoComponent, CuiCriterionInfoFormComponent, CuiCriterionModalCreateComponent, CuiCriterionReadonlyInfoComponent, CuiDateRangeCalendarComponent, CuiDateRangeCalendarModule, CuiDeleteModalComponent, CuiDialogActionsComponent, CuiDialogComponent, CuiDialogHeaderComponent, CuiDialogModule, CuiDialogService, CuiDialogsComponent, CuiDropdownDirective, CuiDropdownWrapperComponent, CuiEditorBlockComponent, CuiEditorComponent, CuiEditorModalComponent, CuiEditorReadonlyComponent, CuiEditorTranslations, CuiEmptyStateComponent, CuiFileIconComponent, CuiFileUploader, CuiFileUploaderStatus, CuiFilterBarComponent, CuiFilterBarModule, CuiFormFieldComponent, CuiFormFieldModule, CuiFramerPreviewComponent, CuiGeneralControlErrorHintComponent, CuiGhostInputComponent, CuiGlobalErrorHandler, CuiHeaderTool, CuiHintComponent, CuiHintModule, CuiHybridStorageService, CuiIconButtonComponent, CuiIconButtonModule, CuiImageTool, CuiInputModule, CuiInputNumberComponent, CuiInputNumberModule, CuiInputPasswordComponent, CuiInputPasswordModule, CuiInputTextComponent, CuiInputTimeComponent, CuiInputTimeModule, CuiInstructionInfoComponent, CuiInstructionInfoFormComponent, CuiInstructionModalCreateComponent, CuiInstructionReadonlyInfoComponent, CuiLabelComponent, CuiLabelModule, CuiLayoutComponent, CuiLetterBoxComponent, CuiLibTranslations, CuiLinearLoaderComponent, CuiLinkMarker, CuiListTool, CuiLoaderComponent, CuiLoaderService, CuiLoadingState, CuiNotificationComponent, CuiNotificationModule, CuiPositionService, CuiPulseLoaderComponent, CuiRadioComponent, CuiRadioModule, CuiReadonlyCriterionModalComponent, CuiReadonlyInstructionModalComponent, CuiReadonlyUtilityModalComponent, CuiRenderDynamicComponentsComponent, CuiRenderDynamicComponentsService, CuiRoleMarker, CuiRootComponent, CuiRootModule, CuiSelectComponent, CuiSelectModalComponent, CuiSelectModalFolderComponent, CuiSelectModalSearchComponent, CuiSelectModalService, CuiSelectModule, CuiSelectedCategoryService, CuiSidebarContainerComponent, CuiSidebarHeaderComponent, CuiSidebarNavigationComponent, CuiSidebarNavigationContainerComponent, CuiSidebarNavigationItemComponent, CuiSidebarService, CuiSkeleton, CuiStatedLoaderComponent, CuiStorageListComponent, CuiSvgComponent, CuiSvgModule, CuiTabDirective, CuiTabsComponent, CuiTabsServiceImpl, CuiTextFieldController, CuiTextFieldControllerModule, CuiTextFieldIconLeftDirective, CuiTextFieldIdDirective, CuiTextFieldIsErrorDirective, CuiTextFieldPlaceholderDirective, CuiTextFieldSizeDirective, CuiTextareaComponent, CuiTextareaModule, CuiThemeService, CuiTimePipe, CuiToggleComponent, CuiToggleModule, CuiToolMarker, CuiTooltip, CuiTooltipComponent, CuiTooltipDescribe, CuiTooltipDirective, CuiTooltipDriver, CuiTooltipHost, CuiTooltipHover, CuiTooltipManual, CuiTooltipOptionsDirective, CuiTooltipOverflow, CuiTooltipPointer, CuiTooltipPosition, CuiTooltipService, CuiTooltipUnstyled, CuiTooltipUnstyledComponent, CuiTooltips, CuiTranslations, CuiUserActionContextMenuComponent, CuiUtilityModalComponent, CuiUtilityModalCreateComponent, CuiUtilityReadonlyThumbnailComponent, CuiUtilityThumbnailComponent, CuiVideoTool, CuiVisualViewportService, InsertedComponent, ModalDividedSectionComponent, ModalHeaderComponent, ModalHeaderInsertedButtonsComponent, ModalInfoTabComponent, ModalOperationPartComponent, ModalResourcesTabComponent, OptionsButtonComponent, RenderDynamicModalComponent, ResourceStateBaseService, ResourcesBlockComponent, ResourcesBlockPartComponent, ResourcesBlockTabsComponent$1 as ResourcesBlockTabsComponent, ResourcesOptionsComponent, SubjectModalBaseService, UTILITY_MODAL_SERVICE_TOKEN, UsedElementsBaseService, UtilityBaseService, UtilityInfoReadonlyComponent, createEditorTools, cuiAuthInterceptor, cuiCheckFixedPosition, cuiCreateDefaultValidators, cuiErrorHandlerInterceptor, cuiGetDuration, cuiIsObscured, cuiLoaderInterceptor, cuiOverrideOptions, cuiProvideEditor, cuiRemoveSpaces, cuiReplace, cuiToAnimationOptions, cuiTooltipOptionsProvider, cuiXNdjsonInterceptor, handleError, openFileInBrowser, presetConfigToken, provideCuiAuth, provideCuiErrorHandler, provideCuiTabs, setLoading, sseStreamReaderInterceptor };
 //# sourceMappingURL=cuby-ui-core.mjs.map