@snabcentr/client-ui 3.47.8 → 3.48.1

package/fesm2022/snabcentr-client-ui.mjs

@@ -1,17 +1,17 @@
 import * as i0 from '@angular/core';
-import { inject, Injectable, EventEmitter, signal, ChangeDetectorRef, Directive, Input, Output, InjectionToken, Pipe, ElementRef, HostListener, Renderer2, ContentChildren, NgModule, input, Component, ChangeDetectionStrategy, Inject, HostBinding, model, output, SkipSelf, DestroyRef, effect, ContentChild, ViewChild, computed, Optional, viewChild, forwardRef } from '@angular/core';
+import { inject, Injectable, EventEmitter, signal, ChangeDetectorRef, Directive, Input, Output, computed, output, effect, Component, ChangeDetectionStrategy, input, InjectionToken, Pipe, ElementRef, HostListener, Renderer2, ContentChildren, NgModule, Inject, HostBinding, model, SkipSelf, DestroyRef, ContentChild, ViewChild, Optional, viewChild, forwardRef } from '@angular/core';
 import * as i1 from '@snabcentr/client-core';
-import { ScContactsService, ScUserService, ScAuthService, SEARCH_TERM, ScUnitsHelper, ScImageHelper, SC_PATH_IMAGE_NOT_FOUND, ScImage, ScLocationsService, ScPhoneService, ScUserMetrikaService, ScUserMetrikaGoalsEnum, IS_RUNNING_ON_TERMINAL, ScVCardService, ScVerificationService, ScISuggestionType, SC_MIN_LENGTH_SEARCH_TERM, ScConvertersService, ScOpfList, ScReferencesService, ScContragentService, ScMediaImageTransformerPipe, ScMimeTypes, ScCatalogService, SC_URLS, IS_SERVER, ScWarehouseService, SEARCH_TERM_PROVIDERS, ScPaginationService, SC_NEXT_PAGE_PAGINATION_CLICK, SC_PRODUCT_PAGINATION_OPTIONS, ScCartService, ScUploadedFile, ScConfiguratorService, RESPONSE, ScIconTypesEnum, ScDocumentInfoTypesEnum, ScFrequentlyAskedQuestionsService, SC_COMPANY_INFO, ScFeedbackService, ScIdOrSlugPipe, ScJsonLdModule } from '@snabcentr/client-core';
+import { ScContactsService, ScUserService, ScAuthService, SEARCH_TERM, ScUnitsHelper, ScImageHelper, SC_PATH_IMAGE_NOT_FOUND, ScImage, IS_SERVER, RESPONSE, ScCatalogService, ScLocationsService, ScPhoneService, ScUserMetrikaService, ScUserMetrikaGoalsEnum, IS_RUNNING_ON_TERMINAL, ScVCardService, ScVerificationService, ScISuggestionType, SC_MIN_LENGTH_SEARCH_TERM, ScConvertersService, ScOpfList, ScReferencesService, ScContragentService, ScMediaImageTransformerPipe, ScMimeTypes, SC_URLS, ScWarehouseService, SEARCH_TERM_PROVIDERS, ScPaginationService, SC_NEXT_PAGE_PAGINATION_CLICK, SC_PRODUCT_PAGINATION_OPTIONS, ScCatalogFilterService, ScIdOrSlugPipe, ScCartService, ScUploadedFile, ScConfiguratorService, ScIconTypesEnum, ScDocumentInfoTypesEnum, ScFrequentlyAskedQuestionsService, SC_COMPANY_INFO, ScFeedbackService, ScJsonLdModule } from '@snabcentr/client-core';
 import * as i6$1 from 'rxjs';
-import { EMPTY, BehaviorSubject, switchMap, of, shareReplay, map, Subject, filter, tap, catchError, finalize, startWith, share, timer, scan, takeWhile, endWith, distinctUntilChanged, debounceTime, throwError, combineLatest, Observable, pairwise, noop, first, merge, skip } from 'rxjs';
+import { EMPTY, BehaviorSubject, switchMap, of, shareReplay, noop, filter, map, startWith, catchError, Subject, tap, finalize, share, timer, scan, takeWhile, endWith, distinctUntilChanged, debounceTime, throwError, combineLatest, Observable, pairwise, first, merge, skip } from 'rxjs';
 import * as i6 from '@taiga-ui/cdk';
-import { tuiCreateToken, tuiCreateTokenFromFactory, TUI_IS_MOBILE, TuiDay, TuiTime, TuiValueTransformer, tuiControlValue, tuiIsPresent, tuiMarkControlAsTouchedAndValidate, tuiIsFalsy, TuiLet, TuiAutoFocus, TuiRepeatTimes, TuiHovered, TuiDayRange, TuiMonth, tuiPure, TUI_WINDOW_SIZE, TuiValidationError, TUI_TRUE_HANDLER } from '@taiga-ui/cdk';
-import { HttpClient, HttpErrorResponse } from '@angular/common/http';
+import { tuiCreateToken, tuiCreateTokenFromFactory, TUI_IS_MOBILE, tuiIsPresent, TuiDay, TuiTime, TuiValueTransformer, tuiControlValue, tuiMarkControlAsTouchedAndValidate, tuiIsFalsy, TuiLet, TuiAutoFocus, TuiRepeatTimes, TuiHovered, TuiDayRange, TuiMonth, tuiPure, TUI_WINDOW_SIZE, TuiValidationError, TUI_TRUE_HANDLER } from '@taiga-ui/cdk';
+import { HttpErrorResponse, HttpClient } from '@angular/common/http';
 import { takeUntilDestroyed, toSignal, outputFromObservable, toObservable } from '@angular/core/rxjs-interop';
 import * as i1$1 from '@angular/forms';
 import { FormControl, FormGroupDirective, NgControl, FormGroup, Validators, FormArray, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i1$2 from '@taiga-ui/core';
-import { TuiButton, TuiDialog, TuiDialogService, TuiLink, TuiFallbackSrcPipe, TuiInitialsPipe, TuiIcon, TuiAppearance, TuiWithAppearance, TuiIcons, TuiWithIcons, TUI_DATA_LIST_HOST, tuiDropdownOptionsProvider, TuiLabel, TuiError, TuiLoader, TuiDataList, TuiNotification, TuiTextfield, TuiTitle, TuiHint, TUI_MONTHS, TuiFormatNumberPipe, TuiNumberFormat, tuiNumberFormatProvider, tuiItemsHandlersProvider, TUI_BUTTON_OPTIONS, TUI_BUTTON_DEFAULT_OPTIONS, TuiScrollbar, TuiSurface, tuiFadeIn } from '@taiga-ui/core';
+import { TuiButton, TuiAppearance, TuiWithAppearance, TuiIcons, TuiWithIcons, TuiDialog, TuiDialogService, TuiLink, TuiFallbackSrcPipe, TuiInitialsPipe, TuiIcon, TUI_DATA_LIST_HOST, tuiDropdownOptionsProvider, TuiLabel, TuiError, TuiLoader, TuiDataList, TuiNotification, TuiTextfield, TuiTitle, TuiHint, TUI_MONTHS, TuiFormatNumberPipe, TuiNumberFormat, tuiNumberFormatProvider, tuiItemsHandlersProvider, TUI_BUTTON_OPTIONS, TUI_BUTTON_DEFAULT_OPTIONS, TuiScrollbar, TuiSurface, tuiFadeIn } from '@taiga-ui/core';
 import { isValidPhoneNumber } from 'libphonenumber-js/max';
 import * as i4 from '@taiga-ui/legacy/components/primitive-textfield';
 import * as i3 from '@taiga-ui/legacy';
@@ -22,9 +22,11 @@ import * as i5 from '@taiga-ui/core/components/label';
 import * as i8 from '@maskito/angular';
 import { MaskitoDirective } from '@maskito/angular';
 import * as i2$1 from '@taiga-ui/kit';
-import { TUI_DATE_VALUE_TRANSFORMER, TuiPreview, TuiAvatar, TuiAccordionItem, TuiElasticContainer, TuiAccordion, TuiFieldErrorPipe, TuiFilterByInputPipe, TuiStringifyContentPipe, TuiDataListWrapper, TuiButtonLoading, TuiSortCountriesPipe, TuiStepper, TuiCarousel, TuiPush, TuiCheckbox, TuiBadge, TuiTooltip, TuiHighlight, TuiLineClamp, TuiPreviewDialogService, TuiFiles, TuiChip, TuiInputNumber, tuiInputNumberOptionsProvider, TuiDataListWrapperComponent, TuiChevron, TuiSelect, TuiInputSlider, TuiTreeService, TuiTreeItemContent, TUI_TREE_START, TUI_TREE_CONTENT, TUI_TREE_LOADING, TUI_TREE_LOADER, TuiTree, tuiItemsHandlersProvider as tuiItemsHandlersProvider$1, TuiPagination, TuiAccordionDirective, TuiAccordionItemContent, tuiFilesAccepted } from '@taiga-ui/kit';
+import { TUI_DATE_VALUE_TRANSFORMER, TuiPreview, TuiAvatar, TuiAccordionItem, TuiElasticContainer, TuiAccordion, TuiFieldErrorPipe, TuiFilterByInputPipe, TuiStringifyContentPipe, TuiDataListWrapper, TuiButtonLoading, TuiSortCountriesPipe, TuiStepper, TuiCarousel, TuiPush, TuiCheckbox, TuiBadge, TuiTooltip, TuiHighlight, TuiLineClamp, TuiInputRange, TuiPreviewDialogService, TuiFiles, TuiChip, TuiInputNumber, tuiInputNumberOptionsProvider, TuiDataListWrapperComponent, TuiChevron, TuiSelect, TuiInputSlider, TuiTreeService, TuiTreeItemContent, TUI_TREE_START, TUI_TREE_CONTENT, TUI_TREE_LOADING, TUI_TREE_LOADER, TuiTree, tuiItemsHandlersProvider as tuiItemsHandlersProvider$1, TuiPagination, TuiAccordionDirective, TuiAccordionItemContent, tuiFilesAccepted } from '@taiga-ui/kit';
 import * as i2$2 from '@angular/common';
 import { DOCUMENT, CommonModule, NgIf, AsyncPipe, NgFor, NgClass } from '@angular/common';
+import * as i2$4 from '@angular/router';
+import { ActivatedRoute, RouterLink, Router, NavigationStart, NavigationEnd, RouterModule } from '@angular/router';
 import * as i2$3 from '@taiga-ui/polymorpheus';
 import { POLYMORPHEUS_CONTEXT, PolymorpheusComponent, PolymorpheusTemplate, PolymorpheusOutlet, injectContext } from '@taiga-ui/polymorpheus';
 import * as i2 from 'angularx-qrcode';
@@ -35,8 +37,6 @@ import * as i3$1 from '@taiga-ui/core/components/data-list';
 import * as i1$4 from '@taiga-ui/cdk/directives/item';
 import * as i3$2 from '@ng-web-apis/intersection-observer';
 import { IntersectionObserverService, WaIntersectionObserver } from '@ng-web-apis/intersection-observer';
-import * as i2$4 from '@angular/router';
-import { RouterModule, ActivatedRoute, RouterLink, Router, NavigationStart } from '@angular/router';
 import { TuiCurrencyPipe, TuiAmountPipe } from '@taiga-ui/addon-commerce';
 import { WA_WINDOW } from '@ng-web-apis/common';
 import * as i1$5 from '@taiga-ui/layout';
@@ -44,12 +44,12 @@ import { TuiCardLarge, TuiBlockStatus, TuiHeader } from '@taiga-ui/layout';
 import { __decorate } from 'tslib';
 import * as i5$1 from '@taiga-ui/addon-charts';
 import { TuiLineDaysChart, TuiLineDaysChartHint, TuiAxes } from '@taiga-ui/addon-charts';
+import * as i2$5 from '@taiga-ui/experimental/components/expand';
 import { TuiAppearance as TuiAppearance$1, TuiWithAppearance as TuiWithAppearance$1 } from '@taiga-ui/core/directives/appearance';
 import { TuiIcons as TuiIcons$1, TuiWithIcons as TuiWithIcons$1 } from '@taiga-ui/core/directives/icons';
 import * as i5$2 from '@taiga-ui/kit/components/slider';
 import * as i9 from 'angular8-yandex-maps';
 import { AngularYandexMapsModule } from 'angular8-yandex-maps';
-import * as i2$5 from '@taiga-ui/experimental/components/expand';
 import * as i3$3 from '@taiga-ui/kit/components/data-list-wrapper';
 import { TuiGroup } from '@taiga-ui/core/directives/group';
 import * as i4$1 from 'ng-recaptcha-2';
@@ -408,6 +408,194 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 type: Output
             }] } });
 
+/**
+ * Токен обработчика смены ошибки.
+ */
+// eslint-disable-next-line unicorn/consistent-function-scoping
+const SC_ERROR_CHANGE_HANDLER = tuiCreateTokenFromFactory(() => () => noop);
+
+/**
+ * Компонент представления данных об ошибке.
+ */
+class ScErrorBlockStatusComponent {
+    /**
+     * Инициализирует экземпляр класса {@link ErrorPageComponent}.
+     */
+    constructor() {
+        /**
+         * Компонент управляющий кодом ошибки отображаемой на странице.
+         */
+        this.errorHandlerComponent = inject(ScErrorHandlerComponent, { skipSelf: true });
+        /**
+         * Сигнал кода ошибки.
+         */
+        this.code = this.errorHandlerComponent.getErrorCode();
+        /**
+         * Данные об ошибке.
+         */
+        // eslint-disable-next-line unicorn/consistent-function-scoping
+        this.error = computed(() => this.getErrorMessage(this.code()));
+        /**
+         * Создает сигнал изменения строкового представления об ошибке.
+         */
+        this.pageErrorChange = output();
+        /**
+         * Признак, что текущий скрипт исполняется на сервере.
+         */
+        this.isServer = inject(IS_SERVER);
+        /**
+         * Данные об ответе на запрос.
+         */
+        this.response = inject(RESPONSE, { optional: true });
+        // Если компонент отображён маршрутизацией из-за перехода по неизвестному маршруту, то устанавливаем код 404.
+        if (inject(ActivatedRoute).snapshot.data['routes_key'] === 'error') {
+            this.errorHandlerComponent.setErrorCode(404);
+        }
+        effect(() => {
+            if (this.code() !== null) {
+                this.pageErrorChange.emit(this.error());
+                if (this.isServer) {
+                    this.response?.status(this.code() ?? 0);
+                }
+            }
+        });
+    }
+    /**
+     * Возвращает описание ошибки.
+     *
+     * @param code Код ошибки.
+     */
+    // eslint-disable-next-line class-methods-use-this
+    getErrorMessage(code) {
+        switch (code) {
+            case 403:
+                return {
+                    message: 'К сожалению, у вас нет доступа к этому ресурсу',
+                    description: 'Воспользуйтесь навигацией в шапке или подвале сайта, чтобы перейти в интересующий вас раздел',
+                    code,
+                };
+            case 404:
+                return {
+                    message: 'К сожалению, такой страницы нет',
+                    description: 'Воспользуйтесь навигацией в шапке или подвале сайта, чтобы перейти в интересующий вас раздел',
+                    code,
+                };
+            default:
+                return {
+                    message: 'Неизвестная ошибка',
+                    description: 'Пожалуйста обновите страницу или обратитесь к менеджеру',
+                    code: 0,
+                };
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorBlockStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ScErrorBlockStatusComponent, isStandalone: true, selector: "sc-error-block-status", outputs: { pageErrorChange: "pageErrorChange" }, ngImport: i0, template: "<div class=\"flex flex-col items-center gap-8\">\n    <div class=\"border-20 border-solid border-tui-primary text-center sm:border-32\">\n        <div class=\"text-8xl leading-1.15 text-black sm:text-44\">\n            {{ error().code }}\n        </div>\n        <div class=\"text-6xl leading-1.15 text-tui-primary sm:text-8xl\">ERROR</div>\n    </div>\n    <div class=\"flex flex-col gap-2 text-center\">\n        <div class=\"text-h5 sm:text-h4\">{{ error().message }}</div>\n        <div class=\"text-body-m-bold sm:text-h6\">{{ error().description }}</div>\n    </div>\n    <button\n        tuiButton\n        appearance=\"primary\"\n        routerLink=\"/\"\n    >\n        \u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E\n    </button>\n</div>\n", dependencies: [{ kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorBlockStatusComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'sc-error-block-status', imports: [TuiAppearance, TuiWithAppearance, TuiIcons, TuiWithIcons, TuiButton, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col items-center gap-8\">\n    <div class=\"border-20 border-solid border-tui-primary text-center sm:border-32\">\n        <div class=\"text-8xl leading-1.15 text-black sm:text-44\">\n            {{ error().code }}\n        </div>\n        <div class=\"text-6xl leading-1.15 text-tui-primary sm:text-8xl\">ERROR</div>\n    </div>\n    <div class=\"flex flex-col gap-2 text-center\">\n        <div class=\"text-h5 sm:text-h4\">{{ error().message }}</div>\n        <div class=\"text-body-m-bold sm:text-h6\">{{ error().description }}</div>\n    </div>\n    <button\n        tuiButton\n        appearance=\"primary\"\n        routerLink=\"/\"\n    >\n        \u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E\n    </button>\n</div>\n" }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Компонент для управления кодом ошибки отображаемой на странице.
+ */
+class ScErrorHandlerComponent {
+    /**
+     * Инициирует экземпляр класса {@link ErrorHandlerComponent}.
+     */
+    constructor() {
+        /**
+         * Сигнал для хранения кода ошибки.
+         */
+        this.code = signal(null);
+        /**
+         * Сигнал дефолтного передаваемого из вне значения ошибки.
+         */
+        // eslint-disable-next-line @angular-eslint/no-input-rename
+        this.defaultCode = input(null, { alias: 'code' });
+        /**
+         * Сервис маршрутизации.
+         */
+        this.router = inject(Router);
+        /**
+         * Обработчик изменения ошибки.
+         */
+        this.errorChangeHandler = inject(SC_ERROR_CHANGE_HANDLER);
+        this.router.events.pipe(filter((event) => event instanceof NavigationStart)).subscribe(() => {
+            // Сбрасываем ошибку при переходе на новый маршрут.
+            this.code.set(this.defaultCode());
+        });
+    }
+    /**
+     * Возвращает текущий сигнал с кодом ошибки.
+     */
+    getErrorCode() {
+        return this.code;
+    }
+    /**
+     * Устанавливает новый код ошибки.
+     *
+     * @param code Новый код ошибки.
+     */
+    setErrorCode(code) {
+        this.code.set(code);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorHandlerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ScErrorHandlerComponent, isStandalone: true, selector: "sc-error-handler", inputs: { defaultCode: { classPropertyName: "defaultCode", publicName: "code", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (code() === null) {\n    <ng-content />\n} @else {\n    <sc-error-block-status (pageErrorChange)=\"errorChangeHandler($event)\"></sc-error-block-status>\n}\n", dependencies: [{ kind: "component", type: ScErrorBlockStatusComponent, selector: "sc-error-block-status", outputs: ["pageErrorChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorHandlerComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'sc-error-handler', imports: [ScErrorBlockStatusComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (code() === null) {\n    <ng-content />\n} @else {\n    <sc-error-block-status (pageErrorChange)=\"errorChangeHandler($event)\"></sc-error-block-status>\n}\n" }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Возвращает текущий маршрут.
+ * Функция проходит по дереву маршрутов начиная с переданного route и возвращает самый вложенный активный маршрут.
+ *
+ * @param route Данные маршрута, от которого ищем текущий маршрут в приложении.
+ */
+const scGetCurrentRoute = (route) => {
+    let currentRoute = route;
+    while (currentRoute.firstChild) {
+        currentRoute = currentRoute.firstChild;
+    }
+    return currentRoute;
+};
+
+/**
+ * Токен потока данных о категории.
+ */
+const SC_CATEGORY_INFO = new InjectionToken('A stream with current category information');
+/**
+ * Фабрика создания потока данных о категории.
+ *
+ * @param router Сервис маршрутизации.
+ * @param route Маршрут.
+ * @param catalogService Сервис для работы с каталогом.
+ * @param catalogService.paramMap Параметры.
+ * @param errorHandlerComponent Компонент для управления кодом ошибки отображаемой на странице.
+ */
+function categoryFactory(router, route, catalogService, errorHandlerComponent) {
+    return router.events
+        .pipe(filter((event) => event instanceof NavigationEnd), map(() => scGetCurrentRoute(route).snapshot.paramMap), startWith(scGetCurrentRoute(route).snapshot.paramMap))
+        .pipe(map((parameters) => parameters.get('categoryIdOrSlug')), filter(tuiIsPresent), switchMap((categoryId) => catalogService.getCategoryCached$(categoryId).pipe(catchError((error) => {
+        if (error instanceof HttpErrorResponse) {
+            errorHandlerComponent.setErrorCode(error.status);
+        }
+        return EMPTY;
+    }), shareReplay())), takeUntilDestroyed());
+}
+/**
+ * Провайдеры потока данных о категории.
+ */
+const SC_CATEGORY_PROVIDERS = [
+    {
+        provide: SC_CATEGORY_INFO,
+        deps: [Router, ActivatedRoute, ScCatalogService, ScErrorHandlerComponent],
+        useFactory: categoryFactory,
+    },
+];
+
 /**
  * Токен признака, что разрешено выбирать записи ликвидированных организаций.
  */
@@ -5119,6 +5307,203 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 }]
         }] });
 
+/**
+ * Токен для инъекции {@link Subject} для хранения фильтров продуктов.
+ */
+const SC_CATALOG_PRODUCTS_FILTERS = new InjectionToken('SC_CATALOG_PRODUCTS_FILTERS$', {
+    providedIn: 'root',
+    factory: () => new Subject(),
+});
+
+/**
+ * Токен для инъекции признака необходимости отображать фильтры для вложенных категорий.
+ */
+const SC_CATALOG_SHOW_PRODUCTS_RECURSIVELY = new InjectionToken('SC_CATALOG_SHOW_PRODUCTS_RECURSIVELY');
+
+/* eslint-disable class-methods-use-this */
+/**
+ * Компонент вывода фильтров каталога.
+ */
+class ScCatalogFiltersComponent {
+    /**
+     * Инициализирует экземпляр класса {@link ScCatalogFiltersComponent}.
+     */
+    constructor() {
+        /**
+         * Состояние открытия accordion.
+         */
+        this.isOpenAccordion = input(false);
+        /**
+         * Сервис для работы с фильтрами каталога.
+         */
+        this.catalogFilterService = inject(ScCatalogFilterService);
+        /**
+         * Пайп, возвращающий идентификатор или символьное обозначение (slug) исходя из настроек окружения.
+         */
+        this.idOrSlugPipe = inject(ScIdOrSlugPipe);
+        /**
+         * Subject для хранения фильтров продуктов.
+         */
+        this.catalogProductsFilters$ = inject(SC_CATALOG_PRODUCTS_FILTERS);
+        /**
+         * Признак необходимости отображать фильтры для вложенных категорий.
+         */
+        this.isRecursively = inject(SC_CATALOG_SHOW_PRODUCTS_RECURSIVELY);
+        /**
+         * {@link Observable} фильтров категории.
+         */
+        this.filters = toSignal(inject(SC_CATEGORY_INFO).pipe(filter(tuiIsPresent), switchMap((category) => this.catalogFilterService.getFilters$(this.idOrSlugPipe.transform(category), this.isRecursively)), map((filters) => filters.filter((item) => item.type !== 'range' || item.min !== item.max)), tap((filters) => {
+            // Обновляем состав контролов формы на основе полученных фильтров.
+            this.updateFormControls(filters);
+        }), share()), { initialValue: [] });
+        /**
+         * FormGroup для фильтров.
+         */
+        this.form = new FormGroup({});
+        this.form.valueChanges.pipe(debounceTime(0), takeUntilDestroyed()).subscribe((filters) => {
+            this.catalogProductsFilters$.next(this.buildPropertyFilters(filters));
+        });
+    }
+    /**
+     * Обновляет состав контролов формы на основе переданных фильтров.
+     *
+     * @param filters Массив фильтров для создания контролов.
+     */
+    updateFormControls(filters) {
+        Object.keys(this.form.controls).forEach((key) => {
+            this.form.removeControl(key, { emitEvent: false });
+        });
+        filters.forEach((item) => {
+            switch (item.type) {
+                case 'checkbox':
+                    this.form.addControl(item.id, this.createCheckboxFormControl(item), { emitEvent: false });
+                    break;
+                case 'range':
+                    this.form.addControl(item.id, this.createRangeFormControl(item), { emitEvent: false });
+                    break;
+                case 'toggle':
+                    this.form.addControl(item.id, this.createToggleFormControl(item), { emitEvent: false });
+                    break;
+                default:
+                    break;
+            }
+        });
+        this.form.updateValueAndValidity();
+    }
+    /**
+     * Преобразует значения формы в объект фильтров свойств.
+     *
+     * @param value Значения формы.
+     * @returns Объект фильтров свойств.
+     */
+    buildPropertyFilters(value) {
+        const result = {};
+        this.filters().forEach((filterItem) => {
+            const controlValue = value[filterItem.id];
+            if (isNil(controlValue)) {
+                return;
+            }
+            switch (filterItem.type) {
+                case 'checkbox':
+                    this.processCheckboxFilter(result, filterItem.id, controlValue);
+                    break;
+                case 'range':
+                    this.processRangeFilter(result, filterItem.id, controlValue);
+                    break;
+                case 'toggle':
+                    this.processToggleFilter(result, filterItem.id, controlValue);
+                    break;
+                default:
+                    break;
+            }
+        });
+        return result;
+    }
+    /**
+     * Создает FormGroup для checkbox.
+     *
+     * @param checkboxFilter Фильтр типа checkbox.
+     */
+    createCheckboxFormControl(checkboxFilter) {
+        const controls = {};
+        checkboxFilter.values.forEach((value) => {
+            controls[value.id] = new FormControl(false, { nonNullable: true });
+        });
+        return new FormGroup(controls);
+    }
+    /**
+     * Создает FormControl для range.
+     *
+     * @param rangeFilter Фильтр типа range.
+     */
+    createRangeFormControl(rangeFilter) {
+        // TODO: Добавить updateOn: 'blur' после исправления бага в taiga-ui.
+        return new FormControl([Number(rangeFilter.selectedMin ?? rangeFilter.min), Number(rangeFilter.selectedMax ?? rangeFilter.max)], { nonNullable: true });
+    }
+    /**
+     * Создает FormControl для toggle.
+     *
+     * @param toggleFilter Фильтр типа toggle.
+     */
+    createToggleFormControl(toggleFilter) {
+        return new FormControl(toggleFilter.selectedValue ?? false, { nonNullable: true });
+    }
+    /**
+     * Обрабатывает checkbox фильтр.
+     *
+     * @param result Объект результата для заполнения.
+     * @param filterId Идентификатор фильтра.
+     * @param controlValue Значение контрола формы.
+     */
+    processCheckboxFilter(result, filterId, controlValue) {
+        // Для checkbox: FormGroup с FormControl<boolean> -> string[] (массив ID выбранных значений)
+        const selectedIds = Object.entries(controlValue)
+            .filter(([, isSelected]) => isSelected)
+            .map(([id]) => id);
+        if (selectedIds.length > 0) {
+            // eslint-disable-next-line security/detect-object-injection, no-param-reassign
+            result[filterId] = selectedIds;
+        }
+    }
+    /**
+     * Обрабатывает range фильтр.
+     *
+     * @param result Объект результата для заполнения.
+     * @param filterId Идентификатор фильтра.
+     * @param controlValue Значение контрола формы.
+     * @param controlValue.0 Начальное значение диапазона.
+     * @param controlValue.1 Конечное значение диапазона.
+     */
+    processRangeFilter(result, filterId, [from, to]) {
+        // Для range: FormControl<[number, number]> -> { from?: string; to?: string; }
+        // eslint-disable-next-line security/detect-object-injection, no-param-reassign
+        result[filterId] = {
+            from: String(from),
+            to: String(to),
+        };
+    }
+    /**
+     * Обрабатывает toggle фильтр.
+     *
+     * @param result Объект результата для заполнения.
+     * @param filterId Идентификатор фильтра.
+     * @param controlValue Значение контрола формы.
+     */
+    processToggleFilter(result, filterId, controlValue) {
+        // Для toggle: FormControl<boolean> -> boolean
+        if (controlValue) {
+            // eslint-disable-next-line security/detect-object-injection, no-param-reassign
+            result[filterId] = controlValue;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScCatalogFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ScCatalogFiltersComponent, isStandalone: true, selector: "sc-catalog-filters", inputs: { isOpenAccordion: { classPropertyName: "isOpenAccordion", publicName: "isOpenAccordion", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (filters().length) {\n    <div class=\"bg-tui-base-01 shadow-sc mb-4 flex flex-col items-center gap-3 rounded-xl\">\n        <tui-accordion class=\"accordion\">\n            <button\n                [tuiAccordion]=\"isOpenAccordion()\"\n                appearance=\"primary\"\n            >\n                \u0424\u0438\u043B\u044C\u0442\u0440\u044B\n            </button>\n            <tui-expand>\n                <form\n                    [formGroup]=\"form\"\n                    class=\"flex flex-col gap-4 pb-1\"\n                >\n                    @for (filter of filters(); track filter.id) {\n                        <div class=\"flex flex-col gap-2\">\n                            <label class=\"text-body-s font-medium\">{{ filter.label }}</label>\n\n                            @if (filter.type === 'checkbox') {\n                                <div\n                                    [formGroupName]=\"filter.id\"\n                                    class=\"flex flex-col gap-2\"\n                                >\n                                    @for (value of filter.values; track value.id) {\n                                        <label class=\"flex items-center gap-2\">\n                                            <input\n                                                [formControlName]=\"value.id\"\n                                                tuiCheckbox\n                                                type=\"checkbox\"\n                                            />\n                                            <span class=\"text-body-s\">{{ value.label }}</span>\n                                        </label>\n                                    }\n                                </div>\n                            }\n\n                            @if (filter.type === 'range') {\n                                <tui-input-range\n                                    [formControlName]=\"filter.id\"\n                                    [min]=\"+filter.min\"\n                                    [max]=\"+filter.max\"\n                                />\n                            }\n\n                            @if (filter.type === 'toggle') {\n                                <label class=\"flex items-center gap-2\">\n                                    <input\n                                        [formControlName]=\"filter.id\"\n                                        tuiCheckbox\n                                        type=\"checkbox\"\n                                    />\n                                    <span class=\"text-body-s\">\u0414\u0430</span>\n                                </label>\n                            }\n                        </div>\n                    }\n                </form>\n            </tui-expand>\n        </tui-accordion>\n    </div>\n}\n", styles: [".accordion [tuiAccordion]{border:none;mask:none}.accordion tui-expand{box-shadow:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: TuiCheckbox, selector: "input[type=\"checkbox\"][tuiCheckbox]", inputs: ["size"] }, { kind: "component", type: i2$1.TuiInputRangeComponent, selector: "tui-input-range", inputs: ["min", "max", "step", "segments", "keySteps", "prefix", "postfix", "quantum", "content"] }, { kind: "component", type: i1$3.TuiAccordionComponent, selector: "tui-accordion", inputs: ["closeOthers", "size"] }, { kind: "directive", type: i1$3.TuiAccordionDirective, selector: "button[tuiAccordion]", inputs: ["tuiAccordion"], outputs: ["tuiAccordionChange"] }, { kind: "component", type: i2$5.TuiExpand, selector: "tui-expand", inputs: ["expanded"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScCatalogFiltersComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'sc-catalog-filters', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, TuiTextfield, TuiCheckbox, TuiInputRange, TuiAccordion$1, ReactiveFormsModule], template: "@if (filters().length) {\n    <div class=\"bg-tui-base-01 shadow-sc mb-4 flex flex-col items-center gap-3 rounded-xl\">\n        <tui-accordion class=\"accordion\">\n            <button\n                [tuiAccordion]=\"isOpenAccordion()\"\n                appearance=\"primary\"\n            >\n                \u0424\u0438\u043B\u044C\u0442\u0440\u044B\n            </button>\n            <tui-expand>\n                <form\n                    [formGroup]=\"form\"\n                    class=\"flex flex-col gap-4 pb-1\"\n                >\n                    @for (filter of filters(); track filter.id) {\n                        <div class=\"flex flex-col gap-2\">\n                            <label class=\"text-body-s font-medium\">{{ filter.label }}</label>\n\n                            @if (filter.type === 'checkbox') {\n                                <div\n                                    [formGroupName]=\"filter.id\"\n                                    class=\"flex flex-col gap-2\"\n                                >\n                                    @for (value of filter.values; track value.id) {\n                                        <label class=\"flex items-center gap-2\">\n                                            <input\n                                                [formControlName]=\"value.id\"\n                                                tuiCheckbox\n                                                type=\"checkbox\"\n                                            />\n                                            <span class=\"text-body-s\">{{ value.label }}</span>\n                                        </label>\n                                    }\n                                </div>\n                            }\n\n                            @if (filter.type === 'range') {\n                                <tui-input-range\n                                    [formControlName]=\"filter.id\"\n                                    [min]=\"+filter.min\"\n                                    [max]=\"+filter.max\"\n                                />\n                            }\n\n                            @if (filter.type === 'toggle') {\n                                <label class=\"flex items-center gap-2\">\n                                    <input\n                                        [formControlName]=\"filter.id\"\n                                        tuiCheckbox\n                                        type=\"checkbox\"\n                                    />\n                                    <span class=\"text-body-s\">\u0414\u0430</span>\n                                </label>\n                            }\n                        </div>\n                    }\n                </form>\n            </tui-expand>\n        </tui-accordion>\n    </div>\n}\n", styles: [".accordion [tuiAccordion]{border:none;mask:none}.accordion tui-expand{box-shadow:none}\n"] }]
+        }], ctorParameters: () => [] });
+
 /* eslint-disable no-underscore-dangle */
 /**
  * Компонент карточки элемента корзины.
@@ -5614,31 +5999,30 @@ class ScSandwichComponent {
         /**
          * Выбранный продукт (материал для раскроя).
          */
-        this.product = new FormControl(null, { validators: Validators.required, nonNullable: false });
+        this.product = new FormControl(null, { validators: Validators.required });
         /**
          * {@link Observable} расчета оптимизации раскладки.
          */
         this.calculate$ = combineLatest({
             productId: tuiControlValue(this.product).pipe(map((product) => product?.id ?? null)),
             items: tuiControlValue(this.items),
-        }).pipe(debounceTime(this.debounceTimeDefault), filter(() => this.product.valid && this.form.controls.items.valid), switchMap(({ productId, items }) => {
-            if (productId === null || items.length === 0) {
-                return of(null);
+        }).pipe(debounceTime(this.debounceTimeDefault), switchMap(({ productId, items }) => {
+            if (productId === null || items.length === 0 || this.form.controls.items.invalid) {
+                // eslint-disable-next-line unicorn/no-useless-undefined
+                return of(undefined);
             }
             return this.configuratorService.calculate$(this.categoryId(), this.editor(), { productId, items }).pipe(tap((calculateResult) => {
                 this.form.get('quantity')?.setValue(calculateResult.quantity);
             }), startWith(null), catchError(() => of(null)));
-        }), share(), tap((calculateResult) => {
-            console.log('calculateResult', calculateResult);
-        }));
+        }), share());
         /**
          * Результат расчета оптимизации раскладки.
          */
-        this.calculateResult$ = this.calculate$.pipe(filter(tuiIsPresent));
+        this.calculateResult$ = this.calculate$.pipe(filter((data) => data !== null));
         /**
          * Сигнал состояния загрузки расчета.
          */
-        this.isCalculateLoading = toSignal(this.calculate$.pipe(map(tuiIsFalsy)), { initialValue: false });
+        this.isCalculateLoading = toSignal(this.calculate$.pipe(map((data) => data === null)), { initialValue: false });
         /**
          * Валидатор для ширины изделия.
          */
@@ -5733,7 +6117,7 @@ class ScSandwichComponent {
      * @param calculateResult Результат расчета оптимизации раскладки.
      */
     onSubmit(calculateResult) {
-        if (!calculateResult || this.form.invalid || !this.isCalculateLoading()) {
+        if (!calculateResult || this.form.invalid || this.isCalculateLoading()) {
             return;
         }
         const formValue = { ...this.form.value, productId: this.product.value?.id ?? null, calculationId: calculateResult.id };
@@ -5801,7 +6185,7 @@ class ScSandwichComponent {
                 stringify: signal((x) => x.name),
                 identityMatcher: signal((a, b) => a.id === b.id),
             }),
-        ], ngImport: i0, template: "@if (!cartItem() && settings()?.allowShowTable) {\n    <div class=\"mb-5 flex justify-center\">\n        <button\n            tuiButton\n            appearance=\"secondary\"\n            (click)=\"toggleShowEvent.emit()\"\n            type=\"button\"\n            iconStart=\"@tui.layout-list\"\n        >\n            \u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0432 \u0432\u0438\u0434\u0435 \u0441\u043F\u0438\u0441\u043A\u0430\n        </button>\n    </div>\n}\n<div class=\"\">\n    @let calculateResult = calculateResult$ | async;\n    @let products = products$ | async;\n    @let productValue = product.value;\n    @let validatorWidth = validatorWidth$ | async;\n    @let validatorLength = validatorLength$ | async;\n\n    <form\n        [formGroup]=\"form\"\n        (ngSubmit)=\"onSubmit(calculateResult)\"\n        ScNextInputFocus\n        class=\"flex flex-col gap-3\"\n    >\n        <label\n            tuiLabel\n            class=\"grow\"\n        >\n            \u0422\u043E\u0432\u0430\u0440\n            <tui-textfield\n                tuiChevron\n                [tuiTextfieldCleaner]=\"false\"\n            >\n                <input\n                    tuiChevron\n                    tuiSelect\n                    [formControl]=\"product\"\n                    placeholder=\"\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043C\u0430\u0442\u0435\u0440\u0438\u0430\u043B\"\n                />\n\n                <tui-data-list-wrapper\n                    *tuiTextfieldDropdown\n                    new\n                    [items]=\"products\"\n                />\n            </tui-textfield>\n            @if (productValue) {\n                <div class=\"ml-2 text-tui-text-secondary\">\n                    \u0421\u0442\u043E\u0438\u043C\u043E\u0441\u0442\u044C:\n                    <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.</span>\n                </div>\n            }\n            <tui-error\n                [formControl]=\"product\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (product.value && validatorWidth && validatorLength) {\n            <p class=\"w-full font-bold\">\u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0438\u0437\u0434\u0435\u043B\u0438\u0439</p>\n            <p class=\"w-full\">\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ settings()?.minWidth }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ product.value.properties?.width }} \u043C\u043C.\n                <br />\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ settings()?.minLength }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ product.value.properties?.length }} \u043C\u043C.\n                <br />\n            </p>\n            <div\n                formArrayName=\"items\"\n                class=\"flex flex-col gap-3\"\n            >\n                @for (item of items.controls; track item) {\n                    <div\n                        class=\"flex grow gap-2\"\n                        [formGroupName]=\"$index\"\n                    >\n                        <div class=\"grid grow grid-cols-3 gap-2\">\n                            <label tuiLabel>\n                                \u0428\u0438\u0440\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"width\"\n                                        [min]=\"settings()?.minWidth ?? 0\"\n                                        [max]=\"product.value.properties?.width ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0428\u0438\u0440\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.width }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"width\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n\n                            <label tuiLabel>\n                                \u0414\u043B\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"length\"\n                                        [min]=\"settings()?.minLength ?? 0\"\n                                        [max]=\"product.value.properties?.length ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0414\u043B\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.length }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"length\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                            <label tuiLabel>\n                                <span class=\"whitespace-nowrap\">\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E, \u0448\u0442</span>\n                                <tui-textfield [tuiTextfieldCleaner]=\"false\">\n                                    <input\n                                        tuiInputNumber\n                                        formControlName=\"quantity\"\n                                        [min]=\"1\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E\"\n                                        autocomplete=\"off\"\n                                    />\n                                </tui-textfield>\n                                <tui-error\n                                    formControlName=\"quantity\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                        </div>\n                        <button\n                            tuiIconButton\n                            (click)=\"removeItem($index)\"\n                            [disabled]=\"items.length <= 1\"\n                            size=\"m\"\n                            type=\"button\"\n                            iconStart=\"@tui.trash-2\"\n                            appearance=\"secondary\"\n                            class=\"mt-6\"\n                            [style.flex]=\"'0 0 auto'\"\n                        ></button>\n                    </div>\n                }\n            </div>\n            <button\n                tuiButton\n                appearance=\"secondary\"\n                [disabled]=\"items.invalid\"\n                (click)=\"addItem()\"\n                type=\"button\"\n                class=\"self-center\"\n                iconStart=\"@tui.plus\"\n            >\n                \u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0438\u0437\u0434\u0435\u043B\u0438\u0435\n            </button>\n        } @else if (product.value) {\n            <tui-error error=\"\u0420\u0430\u0441\u0447\u0435\u0442 \u043F\u043E \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0443 \u043D\u0435\u0432\u043E\u0437\u043C\u043E\u0436\u0435\u043D. \u041E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u043A \u043C\u0435\u043D\u0435\u0434\u0436\u0435\u0440\u0443\" />\n        }\n\n        <label tuiLabel>\n            \u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\n            <tui-textfield>\n                <input\n                    tuiTextfield\n                    formControlName=\"marker\"\n                    placeholder=\"\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\"\n                    autocomplete=\"marker\"\n                />\n            </tui-textfield>\n\n            <tui-error\n                formControlName=\"marker\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (calculateResult && product.value) {\n            <tui-loader [showLoader]=\"isCalculateLoading()\" >\n                <div class=\"mt-2 flex flex-wrap items-end gap-2\">\n                    <div>\n                        \u0418\u0442\u043E\u0433\u043E: <span class=\"text-xl font-bold whitespace-nowrap\">{{ getTotalCost(calculateResult).toLocaleString() }} {{ product.value.currency.symbol }}</span>\n                    </div>\n                    @if (calculateResult?.quantity && productValue) {\n                        <div class=\"text-lg text-sc-dark-grey whitespace-nowrap\">\n                            <span class=\"font-bold\">({{ calculateResult.quantity }} \u0448\u0442.</span> x\n                            <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.)</span>\n                        </div>\n                    }\n                </div>\n            </tui-loader>\n        }\n\n        <tui-error [error]=\"[] | tuiFieldError | async\" />\n        <button\n            [disabled]=\"form.invalid || !calculateResult || isCalculateLoading() || isSubmitLoading()\"\n            tuiButton\n            class=\"self-center\"\n            iconStart=\"@tui.check\"\n        >\n            {{ !cartItem() ? '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0432 \u043A\u043E\u0440\u0437\u0438\u043D\u0443' : '\u0418\u0437\u043C\u0435\u043D\u0438\u0442\u044C' }}\n        </button>\n    </form>\n</div>\n", styles: [":host{display:block;width:100%;max-width:30rem}.slider-ticks-labels{--t-offset: calc($thumb / 2);display:flex;font:var(--tui-font-text-s);margin-inline-start:var(--t-offset);margin-inline-end:var(--t-offset);color:var(--tui-text-secondary)}.slider-ticks-labels>*{position:relative;flex:2;text-align:center}.slider-ticks-labels>*:first-child{left:calc(-1 * var(--t-offset));inset-inline-start:calc(-1 * var(--t-offset));flex:1;text-align:start}.slider-ticks-labels>*:last-child{right:calc(-1 * var(--t-offset));flex:1;text-align:end}@supports (inset-inline-end: 0){.slider-ticks-labels>*:last-child{right:unset;inset-inline-end:calc(-1 * var(--t-offset))}}tui-input-slider+.slider-ticks-labels{margin-inline-start:calc(var(--tui-radius-m) / 2 + var(--t-offset))}tui-textfield+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-m) / 2 + $thumb / 2)}tui-textfield[data-size=l]+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-l) / 2 + $thumb / 2)}tui-input-range:not([new])+.slider-ticks-labels,tui-range+.slider-ticks-labels{--t-offset: $thumb}tui-input-range[new]+.slider-ticks-labels{--t-offset: calc(map-get($track-inset, $input-size) + $thumb)}\n"], dependencies: [{ kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ScNextInputFocusModule }, { kind: "directive", type: ScNextInputFocusDirective, selector: "form[ScNextInputFocus]" }, { kind: "directive", type: TuiLabel, selector: "label[tuiLabel]" }, { kind: "component", type: TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels]), tui-data-list-wrapper:not([labels])[new]", inputs: ["items", "disabledItemHandler", "emptyContent", "size", "itemContent"], outputs: ["itemClick"] }, { kind: "component", type: TuiError, selector: "tui-error", inputs: ["error"] }, { kind: "component", type: i1$2.TuiTextfieldComponent, selector: "tui-textfield:not([multi])" }, { kind: "directive", type: i1$2.TuiTextfieldDirective, selector: "input[tuiTextfield]:not([tuiInputCard]):not([tuiInputExpire]):not([tuiInputCVC])" }, { kind: "directive", type: i1$2.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i1$2.TuiTextfieldDropdownDirective, selector: "ng-template[tuiTextfieldDropdown]" }, { kind: "directive", type: TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "directive", type: i2$1.TuiSelectDirective, selector: "input[tuiSelect]" }, { kind: "directive", type: i2$1.TuiInputNumberDirective, selector: "input[tuiInputNumber]", inputs: ["min", "max", "prefix", "postfix"] }, { kind: "directive", type: TuiNumberFormat, selector: "[tuiNumberFormat]", inputs: ["tuiNumberFormat"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TuiFieldErrorPipe, name: "tuiFieldError" }, { kind: "component", type: i5$2.TuiSliderComponent, selector: "input[type=range][tuiSlider]", inputs: ["size", "segments"] }, { kind: "directive", type: i2$1.TuiInputSliderDirective, selector: "input[tuiInputSlider]" }, { kind: "directive", type: ScSelectOnFocusinDirective, selector: "tui-input-number, tui-input, tui-input-phone, tui-input-date, tui-input-password, input[tuiInputNumber], input[tuiTextfield], input[tuiInputSlider]" }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "@if (!cartItem() && settings()?.allowShowTable) {\n    <div class=\"mb-5 flex justify-center\">\n        <button\n            tuiButton\n            appearance=\"secondary\"\n            (click)=\"toggleShowEvent.emit()\"\n            type=\"button\"\n            iconStart=\"@tui.layout-list\"\n        >\n            \u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0432 \u0432\u0438\u0434\u0435 \u0441\u043F\u0438\u0441\u043A\u0430\n        </button>\n    </div>\n}\n<div class=\"\">\n    @let calculateResult = calculateResult$ | async;\n    @let products = products$ | async;\n    @let productValue = product.value;\n    @let validatorWidth = validatorWidth$ | async;\n    @let validatorLength = validatorLength$ | async;\n\n    <form\n        [formGroup]=\"form\"\n        (ngSubmit)=\"onSubmit(calculateResult)\"\n        ScNextInputFocus\n        class=\"flex flex-col gap-3\"\n    >\n        <label\n            tuiLabel\n            class=\"grow\"\n        >\n            \u0422\u043E\u0432\u0430\u0440\n            <tui-textfield\n                tuiChevron\n                [tuiTextfieldCleaner]=\"false\"\n            >\n                <input\n                    tuiChevron\n                    tuiSelect\n                    [formControl]=\"product\"\n                    placeholder=\"\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043C\u0430\u0442\u0435\u0440\u0438\u0430\u043B\"\n                />\n\n                <tui-data-list-wrapper\n                    *tuiTextfieldDropdown\n                    new\n                    [items]=\"products\"\n                />\n            </tui-textfield>\n            @if (productValue) {\n                <div class=\"ml-2 text-tui-text-secondary\">\n                    \u0421\u0442\u043E\u0438\u043C\u043E\u0441\u0442\u044C:\n                    <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.</span>\n                </div>\n            }\n            <tui-error\n                [formControl]=\"product\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (product.value && validatorWidth && validatorLength) {\n            <p class=\"w-full font-bold\">\u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0438\u0437\u0434\u0435\u043B\u0438\u0439</p>\n            <p class=\"w-full\">\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ settings()?.minWidth }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ product.value.properties?.width }} \u043C\u043C.\n                <br />\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ settings()?.minLength }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ product.value.properties?.length }} \u043C\u043C.\n                <br />\n            </p>\n            <div\n                formArrayName=\"items\"\n                class=\"flex flex-col gap-3\"\n            >\n                @for (item of items.controls; track item) {\n                    <div\n                        class=\"flex grow gap-2\"\n                        [formGroupName]=\"$index\"\n                    >\n                        <div class=\"grid grow grid-cols-3 gap-2\">\n                            <label tuiLabel>\n                                \u0428\u0438\u0440\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"width\"\n                                        [min]=\"settings()?.minWidth ?? 0\"\n                                        [max]=\"product.value.properties?.width ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0428\u0438\u0440\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.width }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"width\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n\n                            <label tuiLabel>\n                                \u0414\u043B\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"length\"\n                                        [min]=\"settings()?.minLength ?? 0\"\n                                        [max]=\"product.value.properties?.length ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0414\u043B\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.length }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"length\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                            <label tuiLabel>\n                                <span class=\"whitespace-nowrap\">\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E, \u0448\u0442</span>\n                                <tui-textfield [tuiTextfieldCleaner]=\"false\">\n                                    <input\n                                        tuiInputNumber\n                                        formControlName=\"quantity\"\n                                        [min]=\"1\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E\"\n                                        autocomplete=\"off\"\n                                    />\n                                </tui-textfield>\n                                <tui-error\n                                    formControlName=\"quantity\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                        </div>\n                        <button\n                            tuiIconButton\n                            (click)=\"removeItem($index)\"\n                            [disabled]=\"items.length <= 1\"\n                            size=\"m\"\n                            type=\"button\"\n                            iconStart=\"@tui.trash-2\"\n                            appearance=\"secondary\"\n                            class=\"mt-6\"\n                            [style.flex]=\"'0 0 auto'\"\n                        ></button>\n                    </div>\n                }\n            </div>\n            <button\n                tuiButton\n                appearance=\"secondary\"\n                [disabled]=\"items.invalid\"\n                (click)=\"addItem()\"\n                type=\"button\"\n                class=\"self-center\"\n                iconStart=\"@tui.plus\"\n            >\n                \u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0438\u0437\u0434\u0435\u043B\u0438\u0435\n            </button>\n        } @else if (product.value) {\n            <tui-error error=\"\u0420\u0430\u0441\u0447\u0435\u0442 \u043F\u043E \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0443 \u043D\u0435\u0432\u043E\u0437\u043C\u043E\u0436\u0435\u043D. \u041E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u043A \u043C\u0435\u043D\u0435\u0434\u0436\u0435\u0440\u0443\" />\n        }\n\n        <label tuiLabel>\n            \u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\n            <tui-textfield>\n                <input\n                    tuiTextfield\n                    formControlName=\"marker\"\n                    placeholder=\"\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\"\n                    autocomplete=\"marker\"\n                />\n            </tui-textfield>\n\n            <tui-error\n                formControlName=\"marker\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (product.value) {\n            <tui-loader [showLoader]=\"isCalculateLoading()\">\n                @if (calculateResult) {\n                    <div class=\"mt-2 flex flex-wrap items-end gap-2\">\n                        <div>\n                            \u0418\u0442\u043E\u0433\u043E: <span class=\"whitespace-nowrap text-xl font-bold\">{{ getTotalCost(calculateResult).toLocaleString() }} {{ product.value.currency.symbol }}</span>\n                        </div>\n                        @if (calculateResult?.quantity && productValue) {\n                            <div class=\"whitespace-nowrap text-lg text-sc-dark-grey\">\n                                <span class=\"font-bold\">({{ calculateResult.quantity }} \u0448\u0442.</span> x\n                                <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.)</span>\n                            </div>\n                        }\n                    </div>\n                }\n            </tui-loader>\n        }\n\n        <tui-error [error]=\"[] | tuiFieldError | async\" />\n\n        <button\n            [disabled]=\"form.invalid || !calculateResult || isCalculateLoading() || isSubmitLoading()\"\n            [loading]=\"isSubmitLoading()\"\n            tuiButton\n            class=\"self-center\"\n            iconStart=\"@tui.check\"\n        >\n            {{ !cartItem() ? '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0432 \u043A\u043E\u0440\u0437\u0438\u043D\u0443' : '\u0418\u0437\u043C\u0435\u043D\u0438\u0442\u044C' }}\n        </button>\n    </form>\n</div>\n", styles: [":host{display:block;width:100%;max-width:30rem}.slider-ticks-labels{--t-offset: calc($thumb / 2);display:flex;font:var(--tui-font-text-s);margin-inline-start:var(--t-offset);margin-inline-end:var(--t-offset);color:var(--tui-text-secondary)}.slider-ticks-labels>*{position:relative;flex:2;text-align:center}.slider-ticks-labels>*:first-child{left:calc(-1 * var(--t-offset));inset-inline-start:calc(-1 * var(--t-offset));flex:1;text-align:start}.slider-ticks-labels>*:last-child{right:calc(-1 * var(--t-offset));flex:1;text-align:end}@supports (inset-inline-end: 0){.slider-ticks-labels>*:last-child{right:unset;inset-inline-end:calc(-1 * var(--t-offset))}}tui-input-slider+.slider-ticks-labels{margin-inline-start:calc(var(--tui-radius-m) / 2 + var(--t-offset))}tui-textfield+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-m) / 2 + $thumb / 2)}tui-textfield[data-size=l]+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-l) / 2 + $thumb / 2)}tui-input-range:not([new])+.slider-ticks-labels,tui-range+.slider-ticks-labels{--t-offset: $thumb}tui-input-range[new]+.slider-ticks-labels{--t-offset: calc(map-get($track-inset, $input-size) + $thumb)}\n"], dependencies: [{ kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ScNextInputFocusModule }, { kind: "directive", type: ScNextInputFocusDirective, selector: "form[ScNextInputFocus]" }, { kind: "directive", type: TuiLabel, selector: "label[tuiLabel]" }, { kind: "component", type: TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels]), tui-data-list-wrapper:not([labels])[new]", inputs: ["items", "disabledItemHandler", "emptyContent", "size", "itemContent"], outputs: ["itemClick"] }, { kind: "component", type: TuiError, selector: "tui-error", inputs: ["error"] }, { kind: "component", type: i1$2.TuiTextfieldComponent, selector: "tui-textfield:not([multi])" }, { kind: "directive", type: i1$2.TuiTextfieldDirective, selector: "input[tuiTextfield]:not([tuiInputCard]):not([tuiInputExpire]):not([tuiInputCVC])" }, { kind: "directive", type: i1$2.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i1$2.TuiTextfieldDropdownDirective, selector: "ng-template[tuiTextfieldDropdown]" }, { kind: "directive", type: TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "directive", type: i2$1.TuiSelectDirective, selector: "input[tuiSelect]" }, { kind: "directive", type: i2$1.TuiInputNumberDirective, selector: "input[tuiInputNumber]", inputs: ["min", "max", "prefix", "postfix"] }, { kind: "directive", type: TuiNumberFormat, selector: "[tuiNumberFormat]", inputs: ["tuiNumberFormat"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TuiFieldErrorPipe, name: "tuiFieldError" }, { kind: "component", type: i5$2.TuiSliderComponent, selector: "input[type=range][tuiSlider]", inputs: ["size", "segments"] }, { kind: "directive", type: i2$1.TuiInputSliderDirective, selector: "input[tuiInputSlider]" }, { kind: "directive", type: ScSelectOnFocusinDirective, selector: "tui-input-number, tui-input, tui-input-phone, tui-input-date, tui-input-password, input[tuiInputNumber], input[tuiTextfield], input[tuiInputSlider]" }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "component", type: TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScSandwichComponent, decorators: [{
             type: Component,
@@ -5828,6 +6212,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         TuiDataList,
                         ScSelectOnFocusinDirective,
                         TuiLoader,
+                        TuiButtonLoading,
                     ], providers: [
                         tuiNumberFormatProvider({ precision: 0 }),
                         tuiInputNumberOptionsProvider({
@@ -5837,7 +6222,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                             stringify: signal((x) => x.name),
                             identityMatcher: signal((a, b) => a.id === b.id),
                         }),
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!cartItem() && settings()?.allowShowTable) {\n    <div class=\"mb-5 flex justify-center\">\n        <button\n            tuiButton\n            appearance=\"secondary\"\n            (click)=\"toggleShowEvent.emit()\"\n            type=\"button\"\n            iconStart=\"@tui.layout-list\"\n        >\n            \u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0432 \u0432\u0438\u0434\u0435 \u0441\u043F\u0438\u0441\u043A\u0430\n        </button>\n    </div>\n}\n<div class=\"\">\n    @let calculateResult = calculateResult$ | async;\n    @let products = products$ | async;\n    @let productValue = product.value;\n    @let validatorWidth = validatorWidth$ | async;\n    @let validatorLength = validatorLength$ | async;\n\n    <form\n        [formGroup]=\"form\"\n        (ngSubmit)=\"onSubmit(calculateResult)\"\n        ScNextInputFocus\n        class=\"flex flex-col gap-3\"\n    >\n        <label\n            tuiLabel\n            class=\"grow\"\n        >\n            \u0422\u043E\u0432\u0430\u0440\n            <tui-textfield\n                tuiChevron\n                [tuiTextfieldCleaner]=\"false\"\n            >\n                <input\n                    tuiChevron\n                    tuiSelect\n                    [formControl]=\"product\"\n                    placeholder=\"\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043C\u0430\u0442\u0435\u0440\u0438\u0430\u043B\"\n                />\n\n                <tui-data-list-wrapper\n                    *tuiTextfieldDropdown\n                    new\n                    [items]=\"products\"\n                />\n            </tui-textfield>\n            @if (productValue) {\n                <div class=\"ml-2 text-tui-text-secondary\">\n                    \u0421\u0442\u043E\u0438\u043C\u043E\u0441\u0442\u044C:\n                    <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.</span>\n                </div>\n            }\n            <tui-error\n                [formControl]=\"product\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (product.value && validatorWidth && validatorLength) {\n            <p class=\"w-full font-bold\">\u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0438\u0437\u0434\u0435\u043B\u0438\u0439</p>\n            <p class=\"w-full\">\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ settings()?.minWidth }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ product.value.properties?.width }} \u043C\u043C.\n                <br />\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ settings()?.minLength }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ product.value.properties?.length }} \u043C\u043C.\n                <br />\n            </p>\n            <div\n                formArrayName=\"items\"\n                class=\"flex flex-col gap-3\"\n            >\n                @for (item of items.controls; track item) {\n                    <div\n                        class=\"flex grow gap-2\"\n                        [formGroupName]=\"$index\"\n                    >\n                        <div class=\"grid grow grid-cols-3 gap-2\">\n                            <label tuiLabel>\n                                \u0428\u0438\u0440\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"width\"\n                                        [min]=\"settings()?.minWidth ?? 0\"\n                                        [max]=\"product.value.properties?.width ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0428\u0438\u0440\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.width }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"width\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n\n                            <label tuiLabel>\n                                \u0414\u043B\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"length\"\n                                        [min]=\"settings()?.minLength ?? 0\"\n                                        [max]=\"product.value.properties?.length ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0414\u043B\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.length }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"length\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                            <label tuiLabel>\n                                <span class=\"whitespace-nowrap\">\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E, \u0448\u0442</span>\n                                <tui-textfield [tuiTextfieldCleaner]=\"false\">\n                                    <input\n                                        tuiInputNumber\n                                        formControlName=\"quantity\"\n                                        [min]=\"1\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E\"\n                                        autocomplete=\"off\"\n                                    />\n                                </tui-textfield>\n                                <tui-error\n                                    formControlName=\"quantity\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                        </div>\n                        <button\n                            tuiIconButton\n                            (click)=\"removeItem($index)\"\n                            [disabled]=\"items.length <= 1\"\n                            size=\"m\"\n                            type=\"button\"\n                            iconStart=\"@tui.trash-2\"\n                            appearance=\"secondary\"\n                            class=\"mt-6\"\n                            [style.flex]=\"'0 0 auto'\"\n                        ></button>\n                    </div>\n                }\n            </div>\n            <button\n                tuiButton\n                appearance=\"secondary\"\n                [disabled]=\"items.invalid\"\n                (click)=\"addItem()\"\n                type=\"button\"\n                class=\"self-center\"\n                iconStart=\"@tui.plus\"\n            >\n                \u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0438\u0437\u0434\u0435\u043B\u0438\u0435\n            </button>\n        } @else if (product.value) {\n            <tui-error error=\"\u0420\u0430\u0441\u0447\u0435\u0442 \u043F\u043E \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0443 \u043D\u0435\u0432\u043E\u0437\u043C\u043E\u0436\u0435\u043D. \u041E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u043A \u043C\u0435\u043D\u0435\u0434\u0436\u0435\u0440\u0443\" />\n        }\n\n        <label tuiLabel>\n            \u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\n            <tui-textfield>\n                <input\n                    tuiTextfield\n                    formControlName=\"marker\"\n                    placeholder=\"\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\"\n                    autocomplete=\"marker\"\n                />\n            </tui-textfield>\n\n            <tui-error\n                formControlName=\"marker\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (calculateResult && product.value) {\n            <tui-loader [showLoader]=\"isCalculateLoading()\" >\n                <div class=\"mt-2 flex flex-wrap items-end gap-2\">\n                    <div>\n                        \u0418\u0442\u043E\u0433\u043E: <span class=\"text-xl font-bold whitespace-nowrap\">{{ getTotalCost(calculateResult).toLocaleString() }} {{ product.value.currency.symbol }}</span>\n                    </div>\n                    @if (calculateResult?.quantity && productValue) {\n                        <div class=\"text-lg text-sc-dark-grey whitespace-nowrap\">\n                            <span class=\"font-bold\">({{ calculateResult.quantity }} \u0448\u0442.</span> x\n                            <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.)</span>\n                        </div>\n                    }\n                </div>\n            </tui-loader>\n        }\n\n        <tui-error [error]=\"[] | tuiFieldError | async\" />\n        <button\n            [disabled]=\"form.invalid || !calculateResult || isCalculateLoading() || isSubmitLoading()\"\n            tuiButton\n            class=\"self-center\"\n            iconStart=\"@tui.check\"\n        >\n            {{ !cartItem() ? '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0432 \u043A\u043E\u0440\u0437\u0438\u043D\u0443' : '\u0418\u0437\u043C\u0435\u043D\u0438\u0442\u044C' }}\n        </button>\n    </form>\n</div>\n", styles: [":host{display:block;width:100%;max-width:30rem}.slider-ticks-labels{--t-offset: calc($thumb / 2);display:flex;font:var(--tui-font-text-s);margin-inline-start:var(--t-offset);margin-inline-end:var(--t-offset);color:var(--tui-text-secondary)}.slider-ticks-labels>*{position:relative;flex:2;text-align:center}.slider-ticks-labels>*:first-child{left:calc(-1 * var(--t-offset));inset-inline-start:calc(-1 * var(--t-offset));flex:1;text-align:start}.slider-ticks-labels>*:last-child{right:calc(-1 * var(--t-offset));flex:1;text-align:end}@supports (inset-inline-end: 0){.slider-ticks-labels>*:last-child{right:unset;inset-inline-end:calc(-1 * var(--t-offset))}}tui-input-slider+.slider-ticks-labels{margin-inline-start:calc(var(--tui-radius-m) / 2 + var(--t-offset))}tui-textfield+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-m) / 2 + $thumb / 2)}tui-textfield[data-size=l]+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-l) / 2 + $thumb / 2)}tui-input-range:not([new])+.slider-ticks-labels,tui-range+.slider-ticks-labels{--t-offset: $thumb}tui-input-range[new]+.slider-ticks-labels{--t-offset: calc(map-get($track-inset, $input-size) + $thumb)}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!cartItem() && settings()?.allowShowTable) {\n    <div class=\"mb-5 flex justify-center\">\n        <button\n            tuiButton\n            appearance=\"secondary\"\n            (click)=\"toggleShowEvent.emit()\"\n            type=\"button\"\n            iconStart=\"@tui.layout-list\"\n        >\n            \u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0432 \u0432\u0438\u0434\u0435 \u0441\u043F\u0438\u0441\u043A\u0430\n        </button>\n    </div>\n}\n<div class=\"\">\n    @let calculateResult = calculateResult$ | async;\n    @let products = products$ | async;\n    @let productValue = product.value;\n    @let validatorWidth = validatorWidth$ | async;\n    @let validatorLength = validatorLength$ | async;\n\n    <form\n        [formGroup]=\"form\"\n        (ngSubmit)=\"onSubmit(calculateResult)\"\n        ScNextInputFocus\n        class=\"flex flex-col gap-3\"\n    >\n        <label\n            tuiLabel\n            class=\"grow\"\n        >\n            \u0422\u043E\u0432\u0430\u0440\n            <tui-textfield\n                tuiChevron\n                [tuiTextfieldCleaner]=\"false\"\n            >\n                <input\n                    tuiChevron\n                    tuiSelect\n                    [formControl]=\"product\"\n                    placeholder=\"\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043C\u0430\u0442\u0435\u0440\u0438\u0430\u043B\"\n                />\n\n                <tui-data-list-wrapper\n                    *tuiTextfieldDropdown\n                    new\n                    [items]=\"products\"\n                />\n            </tui-textfield>\n            @if (productValue) {\n                <div class=\"ml-2 text-tui-text-secondary\">\n                    \u0421\u0442\u043E\u0438\u043C\u043E\u0441\u0442\u044C:\n                    <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.</span>\n                </div>\n            }\n            <tui-error\n                [formControl]=\"product\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (product.value && validatorWidth && validatorLength) {\n            <p class=\"w-full font-bold\">\u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0438\u0437\u0434\u0435\u043B\u0438\u0439</p>\n            <p class=\"w-full\">\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ settings()?.minWidth }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0448\u0438\u0440\u0438\u043D\u0430: {{ product.value.properties?.width }} \u043C\u043C.\n                <br />\n                \u041C\u0438\u043D\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ settings()?.minLength }} \u043C\u043C.\n                <br />\n                \u041C\u0430\u043A\u0441\u0438\u043C\u0430\u043B\u044C\u043D\u0430\u044F \u0434\u043B\u0438\u043D\u0430: {{ product.value.properties?.length }} \u043C\u043C.\n                <br />\n            </p>\n            <div\n                formArrayName=\"items\"\n                class=\"flex flex-col gap-3\"\n            >\n                @for (item of items.controls; track item) {\n                    <div\n                        class=\"flex grow gap-2\"\n                        [formGroupName]=\"$index\"\n                    >\n                        <div class=\"grid grow grid-cols-3 gap-2\">\n                            <label tuiLabel>\n                                \u0428\u0438\u0440\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"width\"\n                                        [min]=\"settings()?.minWidth ?? 0\"\n                                        [max]=\"product.value.properties?.width ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0428\u0438\u0440\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.width }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"width\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n\n                            <label tuiLabel>\n                                \u0414\u043B\u0438\u043D\u0430, \u043C\u043C\n                                <tui-textfield>\n                                    <input\n                                        tuiInputSlider\n                                        formControlName=\"length\"\n                                        [min]=\"settings()?.minLength ?? 0\"\n                                        [max]=\"product.value.properties?.length ?? 0\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u0414\u043B\u0438\u043D\u0430\"\n                                        autocomplete=\"off\"\n                                    />\n                                    @if (product.value) {\n                                        <input\n                                            tuiSlider\n                                            type=\"range\"\n                                        />\n                                    }\n                                </tui-textfield>\n                                @if (product.value) {\n                                    <div class=\"slider-ticks-labels\">\n                                        <span> 0 </span>\n                                        <span>{{ product.value.properties?.length }}</span>\n                                    </div>\n                                }\n                                <tui-error\n                                    formControlName=\"length\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                            <label tuiLabel>\n                                <span class=\"whitespace-nowrap\">\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E, \u0448\u0442</span>\n                                <tui-textfield [tuiTextfieldCleaner]=\"false\">\n                                    <input\n                                        tuiInputNumber\n                                        formControlName=\"quantity\"\n                                        [min]=\"1\"\n                                        [tuiNumberFormat]=\"{ precision: 0 }\"\n                                        placeholder=\"\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E\"\n                                        autocomplete=\"off\"\n                                    />\n                                </tui-textfield>\n                                <tui-error\n                                    formControlName=\"quantity\"\n                                    [error]=\"[] | tuiFieldError | async\"\n                                />\n                            </label>\n                        </div>\n                        <button\n                            tuiIconButton\n                            (click)=\"removeItem($index)\"\n                            [disabled]=\"items.length <= 1\"\n                            size=\"m\"\n                            type=\"button\"\n                            iconStart=\"@tui.trash-2\"\n                            appearance=\"secondary\"\n                            class=\"mt-6\"\n                            [style.flex]=\"'0 0 auto'\"\n                        ></button>\n                    </div>\n                }\n            </div>\n            <button\n                tuiButton\n                appearance=\"secondary\"\n                [disabled]=\"items.invalid\"\n                (click)=\"addItem()\"\n                type=\"button\"\n                class=\"self-center\"\n                iconStart=\"@tui.plus\"\n            >\n                \u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0438\u0437\u0434\u0435\u043B\u0438\u0435\n            </button>\n        } @else if (product.value) {\n            <tui-error error=\"\u0420\u0430\u0441\u0447\u0435\u0442 \u043F\u043E \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0443 \u043D\u0435\u0432\u043E\u0437\u043C\u043E\u0436\u0435\u043D. \u041E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u043A \u043C\u0435\u043D\u0435\u0434\u0436\u0435\u0440\u0443\" />\n        }\n\n        <label tuiLabel>\n            \u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\n            <tui-textfield>\n                <input\n                    tuiTextfield\n                    formControlName=\"marker\"\n                    placeholder=\"\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430 \u0440\u0430\u0441\u043F\u0438\u043B\u0430\"\n                    autocomplete=\"marker\"\n                />\n            </tui-textfield>\n\n            <tui-error\n                formControlName=\"marker\"\n                [error]=\"[] | tuiFieldError | async\"\n            />\n        </label>\n\n        @if (product.value) {\n            <tui-loader [showLoader]=\"isCalculateLoading()\">\n                @if (calculateResult) {\n                    <div class=\"mt-2 flex flex-wrap items-end gap-2\">\n                        <div>\n                            \u0418\u0442\u043E\u0433\u043E: <span class=\"whitespace-nowrap text-xl font-bold\">{{ getTotalCost(calculateResult).toLocaleString() }} {{ product.value.currency.symbol }}</span>\n                        </div>\n                        @if (calculateResult?.quantity && productValue) {\n                            <div class=\"whitespace-nowrap text-lg text-sc-dark-grey\">\n                                <span class=\"font-bold\">({{ calculateResult.quantity }} \u0448\u0442.</span> x\n                                <span class=\"font-bold\">{{ productValue.costRub?.toLocaleString() }} {{ productValue.currency.symbol }}/\u0448\u0442.)</span>\n                            </div>\n                        }\n                    </div>\n                }\n            </tui-loader>\n        }\n\n        <tui-error [error]=\"[] | tuiFieldError | async\" />\n\n        <button\n            [disabled]=\"form.invalid || !calculateResult || isCalculateLoading() || isSubmitLoading()\"\n            [loading]=\"isSubmitLoading()\"\n            tuiButton\n            class=\"self-center\"\n            iconStart=\"@tui.check\"\n        >\n            {{ !cartItem() ? '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0432 \u043A\u043E\u0440\u0437\u0438\u043D\u0443' : '\u0418\u0437\u043C\u0435\u043D\u0438\u0442\u044C' }}\n        </button>\n    </form>\n</div>\n", styles: [":host{display:block;width:100%;max-width:30rem}.slider-ticks-labels{--t-offset: calc($thumb / 2);display:flex;font:var(--tui-font-text-s);margin-inline-start:var(--t-offset);margin-inline-end:var(--t-offset);color:var(--tui-text-secondary)}.slider-ticks-labels>*{position:relative;flex:2;text-align:center}.slider-ticks-labels>*:first-child{left:calc(-1 * var(--t-offset));inset-inline-start:calc(-1 * var(--t-offset));flex:1;text-align:start}.slider-ticks-labels>*:last-child{right:calc(-1 * var(--t-offset));flex:1;text-align:end}@supports (inset-inline-end: 0){.slider-ticks-labels>*:last-child{right:unset;inset-inline-end:calc(-1 * var(--t-offset))}}tui-input-slider+.slider-ticks-labels{margin-inline-start:calc(var(--tui-radius-m) / 2 + var(--t-offset))}tui-textfield+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-m) / 2 + $thumb / 2)}tui-textfield[data-size=l]+.slider-ticks-labels{--t-offset: calc(var(--tui-radius-l) / 2 + $thumb / 2)}tui-input-range:not([new])+.slider-ticks-labels,tui-range+.slider-ticks-labels{--t-offset: $thumb}tui-input-range[new]+.slider-ticks-labels{--t-offset: calc(map-get($track-inset, $input-size) + $thumb)}\n"] }]
         }] });
 
 /**
@@ -6347,146 +6732,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
             args: [{ standalone: true, selector: 'sc-resource-preview', imports: [TuiNotification, TuiButton], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (src && isVideoResource()) {\n    <video\n        #video\n        controls\n        (canplay)=\"onCanPlay(video)\"\n        class=\"size-full bg-black\"\n    >\n        <source\n            [src]=\"src\"\n            [type]=\"type\"\n        />\n    </video>\n} @else {\n    <tui-notification\n        appearance=\"warning\"\n        size=\"l\"\n    >\n        <div\n            tuiTitle\n            [style.padding-inline-end.rem]=\"2\"\n            class=\"flex flex-col\"\n        >\n            {{ !src || !type ? '\u0418\u0437\u0432\u0438\u043D\u0438\u0442\u0435, \u0440\u0435\u0441\u0443\u0440\u0441 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D.' : '\u0418\u0437\u0432\u0438\u043D\u0438\u0442\u0435, \u0434\u0430\u043D\u043D\u044B\u0439 \u0444\u043E\u0440\u043C\u0430\u0442 \u0440\u0435\u0441\u0443\u0440\u0441\u0430 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044F.' }}\n            <button\n                tuiButton\n                type=\"button\"\n                size=\"m\"\n                appearance=\"primary\"\n                (click)=\"context?.$implicit?.complete()\"\n                class=\"mt-4 self-center\"\n            >\n                \u0417\u0430\u043A\u0440\u044B\u0442\u044C\n            </button>\n        </div>\n    </tui-notification>\n}\n", styles: [":host{display:flex;height:100lvh;width:100%;justify-content:center;align-items:center}\n"] }]
         }] });
 
-/**
- * Токен обработчика смены ошибки.
- */
-// eslint-disable-next-line unicorn/consistent-function-scoping
-const SC_ERROR_CHANGE_HANDLER = tuiCreateTokenFromFactory(() => () => noop);
-
-/**
- * Компонент представления данных об ошибке.
- */
-class ScErrorBlockStatusComponent {
-    /**
-     * Инициализирует экземпляр класса {@link ErrorPageComponent}.
-     */
-    constructor() {
-        /**
-         * Компонент управляющий кодом ошибки отображаемой на странице.
-         */
-        this.errorHandlerComponent = inject(ScErrorHandlerComponent, { skipSelf: true });
-        /**
-         * Сигнал кода ошибки.
-         */
-        this.code = this.errorHandlerComponent.getErrorCode();
-        /**
-         * Данные об ошибке.
-         */
-        // eslint-disable-next-line unicorn/consistent-function-scoping
-        this.error = computed(() => this.getErrorMessage(this.code()));
-        /**
-         * Создает сигнал изменения строкового представления об ошибке.
-         */
-        this.pageErrorChange = output();
-        /**
-         * Признак, что текущий скрипт исполняется на сервере.
-         */
-        this.isServer = inject(IS_SERVER);
-        /**
-         * Данные об ответе на запрос.
-         */
-        this.response = inject(RESPONSE, { optional: true });
-        // Если компонент отображён маршрутизацией из-за перехода по неизвестному маршруту, то устанавливаем код 404.
-        if (inject(ActivatedRoute).snapshot.data['routes_key'] === 'error') {
-            this.errorHandlerComponent.setErrorCode(404);
-        }
-        effect(() => {
-            if (this.code() !== null) {
-                this.pageErrorChange.emit(this.error());
-                if (this.isServer) {
-                    this.response?.status(this.code() ?? 0);
-                }
-            }
-        });
-    }
-    /**
-     * Возвращает описание ошибки.
-     *
-     * @param code Код ошибки.
-     */
-    // eslint-disable-next-line class-methods-use-this
-    getErrorMessage(code) {
-        switch (code) {
-            case 403:
-                return {
-                    message: 'К сожалению, у вас нет доступа к этому ресурсу',
-                    description: 'Воспользуйтесь навигацией в шапке или подвале сайта, чтобы перейти в интересующий вас раздел',
-                    code,
-                };
-            case 404:
-                return {
-                    message: 'К сожалению, такой страницы нет',
-                    description: 'Воспользуйтесь навигацией в шапке или подвале сайта, чтобы перейти в интересующий вас раздел',
-                    code,
-                };
-            default:
-                return {
-                    message: 'Неизвестная ошибка',
-                    description: 'Пожалуйста обновите страницу или обратитесь к менеджеру',
-                    code: 0,
-                };
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorBlockStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ScErrorBlockStatusComponent, isStandalone: true, selector: "sc-error-block-status", outputs: { pageErrorChange: "pageErrorChange" }, ngImport: i0, template: "<div class=\"flex flex-col items-center gap-8\">\n    <div class=\"border-20 border-solid border-tui-primary text-center sm:border-32\">\n        <div class=\"text-8xl leading-1.15 text-black sm:text-44\">\n            {{ error().code }}\n        </div>\n        <div class=\"text-6xl leading-1.15 text-tui-primary sm:text-8xl\">ERROR</div>\n    </div>\n    <div class=\"flex flex-col gap-2 text-center\">\n        <div class=\"text-h5 sm:text-h4\">{{ error().message }}</div>\n        <div class=\"text-body-m-bold sm:text-h6\">{{ error().description }}</div>\n    </div>\n    <button\n        tuiButton\n        appearance=\"primary\"\n        routerLink=\"/\"\n    >\n        \u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E\n    </button>\n</div>\n", dependencies: [{ kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorBlockStatusComponent, decorators: [{
-            type: Component,
-            args: [{ standalone: true, selector: 'sc-error-block-status', imports: [TuiAppearance, TuiWithAppearance, TuiIcons, TuiWithIcons, TuiButton, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col items-center gap-8\">\n    <div class=\"border-20 border-solid border-tui-primary text-center sm:border-32\">\n        <div class=\"text-8xl leading-1.15 text-black sm:text-44\">\n            {{ error().code }}\n        </div>\n        <div class=\"text-6xl leading-1.15 text-tui-primary sm:text-8xl\">ERROR</div>\n    </div>\n    <div class=\"flex flex-col gap-2 text-center\">\n        <div class=\"text-h5 sm:text-h4\">{{ error().message }}</div>\n        <div class=\"text-body-m-bold sm:text-h6\">{{ error().description }}</div>\n    </div>\n    <button\n        tuiButton\n        appearance=\"primary\"\n        routerLink=\"/\"\n    >\n        \u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F \u043D\u0430 \u0433\u043B\u0430\u0432\u043D\u0443\u044E\n    </button>\n</div>\n" }]
-        }], ctorParameters: () => [] });
-
-/**
- * Компонент для управления кодом ошибки отображаемой на странице.
- */
-class ScErrorHandlerComponent {
-    /**
-     * Инициирует экземпляр класса {@link ErrorHandlerComponent}.
-     */
-    constructor() {
-        /**
-         * Сигнал для хранения кода ошибки.
-         */
-        this.code = signal(null);
-        /**
-         * Сигнал дефолтного передаваемого из вне значения ошибки.
-         */
-        // eslint-disable-next-line @angular-eslint/no-input-rename
-        this.defaultCode = input(null, { alias: 'code' });
-        /**
-         * Сервис маршрутизации.
-         */
-        this.router = inject(Router);
-        /**
-         * Обработчик изменения ошибки.
-         */
-        this.errorChangeHandler = inject(SC_ERROR_CHANGE_HANDLER);
-        this.router.events.pipe(filter((event) => event instanceof NavigationStart)).subscribe(() => {
-            // Сбрасываем ошибку при переходе на новый маршрут.
-            this.code.set(this.defaultCode());
-        });
-    }
-    /**
-     * Возвращает текущий сигнал с кодом ошибки.
-     */
-    getErrorCode() {
-        return this.code;
-    }
-    /**
-     * Устанавливает новый код ошибки.
-     *
-     * @param code Новый код ошибки.
-     */
-    setErrorCode(code) {
-        this.code.set(code);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorHandlerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ScErrorHandlerComponent, isStandalone: true, selector: "sc-error-handler", inputs: { defaultCode: { classPropertyName: "defaultCode", publicName: "code", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (code() === null) {\n    <ng-content />\n} @else {\n    <sc-error-block-status (pageErrorChange)=\"errorChangeHandler($event)\"></sc-error-block-status>\n}\n", dependencies: [{ kind: "component", type: ScErrorBlockStatusComponent, selector: "sc-error-block-status", outputs: ["pageErrorChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScErrorHandlerComponent, decorators: [{
-            type: Component,
-            args: [{ standalone: true, selector: 'sc-error-handler', imports: [ScErrorBlockStatusComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (code() === null) {\n    <ng-content />\n} @else {\n    <sc-error-block-status (pageErrorChange)=\"errorChangeHandler($event)\"></sc-error-block-status>\n}\n" }]
-        }], ctorParameters: () => [] });
-
 /* eslint-disable class-methods-use-this */
 /**
  * Сервис работающий с значками элементов дерева.
@@ -7281,6 +7526,7 @@ class ScFrequentlyAskedQuestionsWithGroupsComponent {
             page: this.page$,
             perPage: this.perPage$,
             group: this.groupId$,
+            paginate: of(true),
         }).pipe(
         // Нулевой debounceTime для случая, когда меняются направление и поле сортировки одновременно.
         debounceTime(0), switchMap((value) => this.frequentlyAskedQuestionsService
@@ -8675,5 +8921,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractScPriceCard, AuthMethod, CURRENT_COUNTRY_ID, CostWithDiscountComponent, FilesAndDocumentsComponent, FilesAndDocumentsModule, FinishDateTimeTransformerDirective, IS_DEFAULT_COUNTRY, MAX_FILES_IN_FORM_INPUT, SC_ALLOW_SELECT_TERMINATED, SC_BANNER_DURATION, SC_DATE_FORMATTER, SC_DEBOUNCE_TIME_DEFAULT, SC_ERROR_CHANGE_HANDLER, SC_HELP_NOTIFICATION_CLOSE, SC_HELP_NOTIFICATION_LIMIT, SC_MANAGER_QR_HANDLER, SC_NOTIFY_WHEN_IN_STOCK_REQUIRED_FIELDS, SC_PAGE_SIZE_OPTIONS$1 as SC_PAGE_SIZE_OPTIONS, SC_SHOW_HELP_NOTIFICATION_IN_PHONE_INPUT, SC_USER_CITY_INFO, SC_USER_INFO, SC_USER_PROVIDERS, SC_VERIFICATION_CODE_TIMEOUT, ScAccordionComponent, ScAccordionContentDirective, ScAccordionModule, ScAddContactDialogComponent, ScAddContragentBankAccountsDialogComponent, ScAddContragentDialogComponent, ScAddDeliveryAddressDialogComponent, ScAddOrEditingCartItemDialogComponent, ScAddOrEditingCartItemFormComponent, ScAddressesSelectionFieldComponent, ScAuthModule, ScBannerComponent, ScBannerModule, ScBrandsListComponent, ScBrandsListModule, ScCartAddProductsFromCsvDialogComponent, ScCartItemComponent, ScCatalogModule, ScCategoryCardComponent, ScContactsAccordionComponent, ScContactsModule, ScContragentsAccordionComponent, ScContragentsAccordionItemComponent, ScContragentsModule, ScDeliveryAddressAccordionComponent, ScDeliveryAddressAccordionItemComponent, ScDeliveryAddressModule, ScDownloadPriceListComponent, ScEmailLinkDirective, ScErrorBlockStatusComponent, ScErrorHandlerComponent, ScFavoriteButtonComponent, ScFeedbackFormComponent, ScFocusFirstInvalidFieldDirective, ScFormFieldsModule, ScFormatDatePipe, ScFrequentlyAskedQuestionsComponent, ScFrequentlyAskedQuestionsGroupSelectorComponent, ScFrequentlyAskedQuestionsWithGroupsComponent, ScGratitudeComponent, ScHelpNotificationService, ScHoverImageCarouselComponent, ScInputQuantityComponent, ScJsonLdCategoryComponent, ScLinks, ScManagerCardComponent, ScManagerCardPushComponent, ScNewContactFormComponent, ScNewContragentBankAccountsFormComponent, ScNewContragentFormComponent, ScNewsCardComponent, ScNewsCardSkeletonComponent, ScNewsModule, ScNextInputFocusDirective, ScNextInputFocusModule, ScNoindexDirective, ScNoindexWrapperComponent, ScNotifyWhenInStockDialogComponent, ScOrderItemMobileComponent, ScOrderModule, ScPaymentStatusComponent, ScPersonalDataProcessingPolicyComponent, ScPhoneFormatPipe, ScPreviewSampleComponent, ScPreviewSampleModule, ScPreviewSamplesMosquitoComponent, ScPriceCardComponent, ScPriceCardInlineComponent, ScPriceHistoryComponent, ScPriceListPaginationComponent, ScPriceWarehouseStockComponent, ScPrivacyPolicyComponent, ScProductInAllWarehousesPipe, ScProfileAccordionsContentComponent, ScProfileModule, ScPublicOfferComponent, ScQRCodeDialogComponent, ScQRCodeModule, ScResetUserPasswordComponent, ScResourcePreviewComponent, ScSandwichComponent, ScSandwichSkeletonComponent, ScSelectOnFocusinDirective, ScShareButtonComponent, ScShareButtonModule, ScSignInFormByEmailComponent, ScSignInFormByPhoneComponent, ScSignInFormComponent, ScSignUpFormComponent, ScSimpleSignUpFormComponent, ScSuggestionFieldComponent, ScTelLinkDirective, ScTerminalLinkDirective, ScUpdateUserInfoDialogComponent, ScUserManagersComponent, ScUserModule, ScUserPhoneApproveDialogComponent, ScVerificationModule, ScVerificationPhoneCheckFormComponent, TreeDirective, TreeIconService, TreeLoaderService, TreeTopDirective, phoneValidator, scAtLeastOneRequiredValidator, scBicValidator, scClientUiIconsName, scCorrespondentAccountValidator, scPasswordConfirmMatchingValidator, stepValidator, tuiDateValueTransformerDefaultProvider };
+export { AbstractScPriceCard, AuthMethod, CURRENT_COUNTRY_ID, CostWithDiscountComponent, FilesAndDocumentsComponent, FilesAndDocumentsModule, FinishDateTimeTransformerDirective, IS_DEFAULT_COUNTRY, MAX_FILES_IN_FORM_INPUT, SC_ALLOW_SELECT_TERMINATED, SC_BANNER_DURATION, SC_CATALOG_PRODUCTS_FILTERS, SC_CATALOG_SHOW_PRODUCTS_RECURSIVELY, SC_CATEGORY_INFO, SC_CATEGORY_PROVIDERS, SC_DATE_FORMATTER, SC_DEBOUNCE_TIME_DEFAULT, SC_ERROR_CHANGE_HANDLER, SC_HELP_NOTIFICATION_CLOSE, SC_HELP_NOTIFICATION_LIMIT, SC_MANAGER_QR_HANDLER, SC_NOTIFY_WHEN_IN_STOCK_REQUIRED_FIELDS, SC_PAGE_SIZE_OPTIONS$1 as SC_PAGE_SIZE_OPTIONS, SC_SHOW_HELP_NOTIFICATION_IN_PHONE_INPUT, SC_USER_CITY_INFO, SC_USER_INFO, SC_USER_PROVIDERS, SC_VERIFICATION_CODE_TIMEOUT, ScAccordionComponent, ScAccordionContentDirective, ScAccordionModule, ScAddContactDialogComponent, ScAddContragentBankAccountsDialogComponent, ScAddContragentDialogComponent, ScAddDeliveryAddressDialogComponent, ScAddOrEditingCartItemDialogComponent, ScAddOrEditingCartItemFormComponent, ScAddressesSelectionFieldComponent, ScAuthModule, ScBannerComponent, ScBannerModule, ScBrandsListComponent, ScBrandsListModule, ScCartAddProductsFromCsvDialogComponent, ScCartItemComponent, ScCatalogFiltersComponent, ScCatalogModule, ScCategoryCardComponent, ScContactsAccordionComponent, ScContactsModule, ScContragentsAccordionComponent, ScContragentsAccordionItemComponent, ScContragentsModule, ScDeliveryAddressAccordionComponent, ScDeliveryAddressAccordionItemComponent, ScDeliveryAddressModule, ScDownloadPriceListComponent, ScEmailLinkDirective, ScErrorBlockStatusComponent, ScErrorHandlerComponent, ScFavoriteButtonComponent, ScFeedbackFormComponent, ScFocusFirstInvalidFieldDirective, ScFormFieldsModule, ScFormatDatePipe, ScFrequentlyAskedQuestionsComponent, ScFrequentlyAskedQuestionsGroupSelectorComponent, ScFrequentlyAskedQuestionsWithGroupsComponent, ScGratitudeComponent, ScHelpNotificationService, ScHoverImageCarouselComponent, ScInputQuantityComponent, ScJsonLdCategoryComponent, ScLinks, ScManagerCardComponent, ScManagerCardPushComponent, ScNewContactFormComponent, ScNewContragentBankAccountsFormComponent, ScNewContragentFormComponent, ScNewsCardComponent, ScNewsCardSkeletonComponent, ScNewsModule, ScNextInputFocusDirective, ScNextInputFocusModule, ScNoindexDirective, ScNoindexWrapperComponent, ScNotifyWhenInStockDialogComponent, ScOrderItemMobileComponent, ScOrderModule, ScPaymentStatusComponent, ScPersonalDataProcessingPolicyComponent, ScPhoneFormatPipe, ScPreviewSampleComponent, ScPreviewSampleModule, ScPreviewSamplesMosquitoComponent, ScPriceCardComponent, ScPriceCardInlineComponent, ScPriceHistoryComponent, ScPriceListPaginationComponent, ScPriceWarehouseStockComponent, ScPrivacyPolicyComponent, ScProductInAllWarehousesPipe, ScProfileAccordionsContentComponent, ScProfileModule, ScPublicOfferComponent, ScQRCodeDialogComponent, ScQRCodeModule, ScResetUserPasswordComponent, ScResourcePreviewComponent, ScSandwichComponent, ScSandwichSkeletonComponent, ScSelectOnFocusinDirective, ScShareButtonComponent, ScShareButtonModule, ScSignInFormByEmailComponent, ScSignInFormByPhoneComponent, ScSignInFormComponent, ScSignUpFormComponent, ScSimpleSignUpFormComponent, ScSuggestionFieldComponent, ScTelLinkDirective, ScTerminalLinkDirective, ScUpdateUserInfoDialogComponent, ScUserManagersComponent, ScUserModule, ScUserPhoneApproveDialogComponent, ScVerificationModule, ScVerificationPhoneCheckFormComponent, TreeDirective, TreeIconService, TreeLoaderService, TreeTopDirective, phoneValidator, scAtLeastOneRequiredValidator, scBicValidator, scClientUiIconsName, scCorrespondentAccountValidator, scGetCurrentRoute, scPasswordConfirmMatchingValidator, stepValidator, tuiDateValueTransformerDefaultProvider };
 //# sourceMappingURL=snabcentr-client-ui.mjs.map