@snabcentr/client-ui 2.1.0 → 2.2.0

package/fesm2022/snabcentr-client-ui.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ChangeDetectionStrategy, Inject, Input, Output, inject, DestroyRef, SkipSelf, Directive, HostBinding, ContentChild, ViewChild, NgModule, ContentChildren, HostListener, Injectable, Renderer2, ElementRef, Pipe, Optional, forwardRef, InjectionToken } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, Inject, Input, Output, inject, DestroyRef, SkipSelf, Directive, HostBinding, ContentChild, ViewChild, NgModule, ContentChildren, HostListener, Renderer2, ElementRef, Pipe, Optional, Injectable, forwardRef, InjectionToken } from '@angular/core';
 import * as i1 from '@snabcentr/client-core';
-import { ScUserMetrikaGoalsEnum, ScISuggestionType, ScOpfList, ScWarehouseService, ScAuthService, SEARCH_TERM, ScImageHelper, SC_PATH_IMAGE_NOT_FOUND, ScPhoneService, IS_RUNNING_ON_TERMINAL, SC_URLS, TERMINAL_PROVIDERS, SEARCH_TERM_PROVIDERS, ScPaginationService, SC_NEXT_PAGE_PAGINATION_CLICK, SC_PRODUCT_PAGINATION_OPTIONS, ScIconTypesEnum, ScDocumentInfoTypesEnum, ScUserService } from '@snabcentr/client-core';
-import * as i5$1 from 'rxjs';
+import { ScUserMetrikaGoalsEnum, ScISuggestionType, SC_MIN_LENGTH_SEARCH_TERM, ScOpfList, ScWarehouseService, ScAuthService, SEARCH_TERM, ScUnitsHelper, ScImageHelper, SC_PATH_IMAGE_NOT_FOUND, ScPhoneService, IS_RUNNING_ON_TERMINAL, SC_URLS, TERMINAL_PROVIDERS, SEARCH_TERM_PROVIDERS, ScPaginationService, SC_NEXT_PAGE_PAGINATION_CLICK, SC_PRODUCT_PAGINATION_OPTIONS, ScIconTypesEnum, ScDocumentInfoTypesEnum, ScSamplesService, ScUserService } from '@snabcentr/client-core';
+import * as i6 from 'rxjs';
 import { Subject, map, filter, switchMap, tap, catchError, of, finalize, startWith, share, timer, scan, takeWhile, endWith, distinctUntilChanged, combineLatest, debounceTime, throwError, shareReplay, interval, takeUntil, skip } from 'rxjs';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
@@ -12,7 +12,7 @@ import { HttpErrorResponse } from '@angular/common/http';
 import * as i3 from '@angular/forms';
 import { FormGroupDirective, FormGroup, FormControl, Validators, NgControl, FormArray, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i7 from '@taiga-ui/cdk';
-import { tuiControlValue, tuiIsFalsy, tuiIsPresent, tuiMarkControlAsTouchedAndValidate, tuiCreateToken, TuiLet, TuiRepeatTimes, TUI_IS_MOBILE, tuiPure, TuiDay, TuiDayRange, TuiMonth, TuiHovered, TUI_TRUE_HANDLER } from '@taiga-ui/cdk';
+import { tuiControlValue, tuiIsFalsy, tuiIsPresent, tuiMarkControlAsTouchedAndValidate, TuiLet, TuiRepeatTimes, TUI_IS_MOBILE, tuiPure, TuiDay, TuiDayRange, TuiMonth, TuiHovered, TUI_TRUE_HANDLER } from '@taiga-ui/cdk';
 import * as i4 from '@taiga-ui/legacy/components/primitive-textfield';
 import * as i5 from '@taiga-ui/legacy';
 import { AbstractTuiControl, TuiInputModule, TuiTextfieldControllerModule, TuiComboBoxModule, TuiInputPhoneModule, TuiSelectModule, TuiInputPasswordModule, AbstractTuiNullableControl, TuiInputNumberComponent, TuiIslandDirective, TuiInputNumberModule } from '@taiga-ui/legacy';
@@ -33,7 +33,7 @@ import { RouterModule } from '@angular/router';
 import * as i9 from '@taiga-ui/addon-commerce';
 import { TuiCurrencyPipe } from '@taiga-ui/addon-commerce';
 import { __decorate } from 'tslib';
-import * as i4$1 from '@taiga-ui/addon-charts';
+import * as i5$1 from '@taiga-ui/addon-charts';
 import { TuiLineDaysChart, TuiLineDaysChartHint, TuiAxes } from '@taiga-ui/addon-charts';
 import * as i8$1 from 'angular8-yandex-maps';
 import { AngularYandexMapsModule } from 'angular8-yandex-maps';
@@ -686,10 +686,14 @@ class ScSuggestionFieldComponent {
         this.host = inject(TUI_DATA_LIST_HOST, {
             optional: true,
         });
+        /**
+         * Минимальная длина поискового запроса для получения данных.
+         */
+        this.minLengthSearchTerm = inject(SC_MIN_LENGTH_SEARCH_TERM);
     }
     /** @inheritDoc */
     ngOnInit() {
-        const request$ = tuiControlValue(this.control).pipe(debounceTime(500), filter(tuiIsPresent), map((term) => term.trim()), filter((term) => term.length >= 3), switchMap((term) => this.suggestionService.getData(term, this.type).pipe(startWith(null))), catchError((error) => {
+        const request$ = tuiControlValue(this.control).pipe(debounceTime(500), filter(tuiIsPresent), map((term) => term.trim()), filter((term) => term.length >= this.minLengthSearchTerm), switchMap((term) => this.suggestionService.getData(term, this.type).pipe(startWith(null))), catchError((error) => {
             if (error instanceof HttpErrorResponse) {
                 const errorResponse = error.error;
                 if (this.control.control) {
@@ -1511,57 +1515,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
                 }]
         }] });
 
-/**
- * Единицы измерения линейной величины по умолчанию.
- */
-const SC_LINEAR_VALUES = ['пог.м.', 'м.', 'м2'];
-/**
- * Токен единиц измерения линейной величины по умолчанию.
- */
-const SC_LINEAR_VALUES_TOKEN = tuiCreateToken(SC_LINEAR_VALUES);
-
-/* eslint-disable lodash/prefer-lodash-method */
-/**
- * Класс хэлпер для работы со значениями единиц измерения товара.
- */
-class ScUnitsHelper {
-    /**
-     * Инициирует экземпляр класса {@link ScUnitsHelper}.
-     *
-     * @param linearValues Единицы измерения линейной величины.
-     */
-    constructor(linearValues) {
-        this.linearValues = linearValues;
-    }
-    /**
-     * Возвращает признак возможности продажи товара на метраж.
-     *
-     * @param product Товар для которого нужно проверить возможность продажи на метраж.
-     */
-    productIsMeasurable(product) {
-        return this.linearValues.includes(product.unit);
-    }
-    /**
-     * Возвращает кратность количества для товара.
-     *
-     * @param product Товар для которого нужно вернуть кратность количества.
-     */
-    productMultiplicity(product) {
-        return product.minCount && !this.linearValues.includes(product.unit) ? product.minCount : 1;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScUnitsHelper, deps: [{ token: SC_LINEAR_VALUES_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScUnitsHelper, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScUnitsHelper, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [SC_LINEAR_VALUES_TOKEN]
-                }] }] });
-
 /* eslint-disable no-underscore-dangle */
 /**
  * Директива абстрактной карточки товара.
@@ -3303,6 +3256,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
                 args: ['mouseleave']
             }] } });
 
+/* eslint-disable @typescript-eslint/dot-notation */
 /**
  * Компонент поля ввода количества.
  */
@@ -3321,6 +3275,10 @@ class ScInputQuantityComponent extends AbstractTuiNullableControl {
          * Признак, что необходимо отобразить кнопку очистки поля ввода.
          */
         this.showCross = true;
+        /**
+         * Признак, что необходимо игнорировать валидацию кратности и минимального количества.
+         */
+        this.ignoreStepValidators = false;
         /**
          * Формат внешнего вида компонента.
          */
@@ -3344,16 +3302,20 @@ class ScInputQuantityComponent extends AbstractTuiNullableControl {
     get nativeFocusableElement() {
         return this.numberInput?.nativeFocusableElement;
     }
+    /** @inheritDoc */
     get focused() {
         return !!this.numberInput?.focused;
     }
+    /**
+     * Элемент формы ввода количества.
+     */
     get formControl() {
         return this.control;
     }
     /** @inheritDoc */
     ngOnInit() {
         if (this.control) {
-            this.control.setValidators(stepValidator(this.step));
+            this.control.setValidators(stepValidator(this.ignoreStepValidators ? 1 : this.step));
         }
     }
     /**
@@ -3374,19 +3336,27 @@ class ScInputQuantityComponent extends AbstractTuiNullableControl {
     }
     /**
      * Увеличивает значение в поле ввода на 1 шаг. Если число в поле ввода не кратно шагу, то увеличит до ближайшего кратного значения.
+     *
+     * @param checkUpdateOn Признак, что нужно проверить `updateOn` свойство `formControl`.
      */
-    incident() {
-        // eslint-disable-next-line @typescript-eslint/dot-notation
+    incident(checkUpdateOn = false) {
         this.numberInput?.['onArrow'](this.step - ((this.numberInput.value ?? 0) % this.step));
-        this.numberInput?.nativeFocusableElement?.blur();
+        // eslint-disable-next-line no-underscore-dangle, @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
+        if (checkUpdateOn && this.formControl?._updateOn === 'blur') {
+            this.control?.setValue(this.numberInput?.value);
+        }
     }
     /**
      * Уменьшает значение в поле ввода на 1 шаг. Если число в поле ввода не кратно шагу, то уменьшит до ближайшего кратного значения.
+     *
+     * @param checkUpdateOn Признак, что нужно проверить `updateOn` свойство `formControl`.
      */
-    decrement() {
-        // eslint-disable-next-line @typescript-eslint/dot-notation
+    decrement(checkUpdateOn = false) {
         this.numberInput?.['onArrow'](-((this.numberInput.value ?? 0) % this.step) || -this.step);
-        this.numberInput?.nativeFocusableElement?.blur();
+        // eslint-disable-next-line no-underscore-dangle, @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
+        if (checkUpdateOn && this.formControl?._updateOn === 'blur') {
+            this.control?.setValue(this.numberInput?.value);
+        }
     }
     /**
      * Очищает поля ввода.
@@ -3396,11 +3366,11 @@ class ScInputQuantityComponent extends AbstractTuiNullableControl {
         this.clickClearEvent.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScInputQuantityComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: { step: "step", showLoader: "showLoader", showCross: "showCross", appearance: "appearance", isDisabled: "isDisabled", size: "size" }, outputs: { clickClearEvent: "clickClearEvent" }, host: { listeners: { "keydown.arrowDown": "onArrow(-step)", "keydown.arrowUp": "onArrow(step)" }, properties: { "attr.data-appearance": "this.appearance", "attr.data-disabled": "this.isDisabled", "attr.data-size": "this.size" } }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: TuiInputNumberComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<tui-loader\n    *ngIf=\"formControl\"\n    class=\"w-full\"\n    [overlay]=\"true\"\n    [showLoader]=\"showLoader\"\n    [size]=\"size\"\n>\n    <div class=\"flex items-center gap-1 text-center\">\n        <div class=\"field-with-button flex grow rounded-xl\">\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [disabled]=\"!numberInput['canDecrement']\"\n                [size]=\"size\"\n                (click.prevent)=\"decrement()\"\n                (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n            >\n                <tui-icon icon=\"@tui.minus\"></tui-icon>\n            </button>\n            <tui-input-number\n                #numberInput\n                [formControl]=\"formControl\"\n                [tuiHint]=\"([] | tuiFieldError | async)?.message\"\n                [tuiTextfieldLabelOutside]=\"true\"\n                [min]=\"step\"\n                [tuiTextfieldSize]=\"size\"\n                [required]=\"true\"\n                [style.text-align]=\"'center'\"\n                [style.font-weight]=\"700\"\n                (focusin)=\"$any($event.target).select()\"\n                oncontextmenu=\"return false;\"\n                class=\"grow\"\n            >\n            </tui-input-number>\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [size]=\"size\"\n                [disabled]=\"!numberInput['canIncrement']\"\n                (click.prevent)=\"incident()\"\n                (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n            >\n                <tui-icon icon=\"@tui.plus\"></tui-icon>\n            </button>\n        </div>\n        <button\n            *ngIf=\"showCross\"\n            tuiIconButton\n            [appearance]=\"appearance\"\n            [size]=\"size\"\n            [disabled]=\"!numberInput['canIncrement']\"\n            (click.prevent)=\"clear()\"\n            (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n        >\n            <tui-icon icon=\"@tui.x\"></tui-icon>\n        </button>\n    </div>\n</tui-loader>\n", styles: [":host [data-size=l]{--tui-height-l: var(--tui-height-m);--tui-font-text-m: bold .875rem/1.25rem var(--tui-font-text);--tui-padding-l: 0}:host [data-size=m]{--tui-height-m: var(--tui-height-s);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-m: 0}:host [data-size=m] tui-svg{font-size:12px!important}:host [data-size=s]{--tui-height-s: var(--tui-height-xs);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-s: 0}:host [data-size=s] tui-svg{font-size:12px!important}:host[data-disabled=true]{pointer-events:none;opacity:var(--tui-disabled-opacity)}:host[data-appearance=secondary] .field-with-button{background-color:var(--tui-background-base);box-shadow:inset 0 0 0 .0625rem var(--tui-background-neutral-1-hover)}:host[data-appearance=primary] .field-with-button{background-color:var(--tui-status-warning-pale)}:host .field-with-button:has(._invalid){background-color:var(--tui-status-negative-pale)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i5.TuiInputNumberComponent, selector: "tui-input-number", inputs: ["min", "max", "step"] }, { kind: "directive", type: i5.TuiInputNumberDirective, selector: "tui-input-number" }, { kind: "directive", type: i5.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { kind: "directive", type: i5.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "component", type: i1$1.TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.TuiFieldErrorPipe, name: "tuiFieldError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: { step: "step", showLoader: "showLoader", showCross: "showCross", ignoreStepValidators: "ignoreStepValidators", appearance: "appearance", isDisabled: "isDisabled", size: "size" }, outputs: { clickClearEvent: "clickClearEvent" }, host: { listeners: { "keydown.arrowDown": "onArrow(-step)", "keydown.arrowUp": "onArrow(step)" }, properties: { "attr.data-appearance": "this.appearance", "attr.data-disabled": "this.isDisabled", "attr.data-size": "this.size" } }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: TuiInputNumberComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<tui-loader\n    *ngIf=\"formControl\"\n    class=\"w-full\"\n    [overlay]=\"true\"\n    [showLoader]=\"showLoader\"\n    [size]=\"size\"\n>\n    <div class=\"flex items-center gap-1 text-center\">\n        <div class=\"field-with-button flex grow rounded-xl\">\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [disabled]=\"!numberInput['canDecrement']\"\n                [size]=\"size\"\n                (click.prevent)=\"decrement(true)\"\n            >\n                <tui-icon icon=\"@tui.minus\"></tui-icon>\n            </button>\n            <tui-input-number\n                #numberInput\n                [formControl]=\"formControl\"\n                [tuiHint]=\"([] | tuiFieldError | async)?.message\"\n                [tuiTextfieldLabelOutside]=\"true\"\n                [min]=\"ignoreStepValidators ? 1 : step\"\n                [tuiTextfieldSize]=\"size\"\n                [required]=\"true\"\n                [style.text-align]=\"'center'\"\n                [style.font-weight]=\"700\"\n                (focusin)=\"$any($event.target).select()\"\n                oncontextmenu=\"return false;\"\n                class=\"grow\"\n            >\n            </tui-input-number>\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [size]=\"size\"\n                [disabled]=\"!numberInput['canIncrement']\"\n                (click.prevent)=\"incident(true)\"\n                (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n            >\n                <tui-icon icon=\"@tui.plus\"></tui-icon>\n            </button>\n        </div>\n        <button\n            *ngIf=\"showCross\"\n            tuiIconButton\n            [appearance]=\"appearance\"\n            [size]=\"size\"\n            [disabled]=\"!numberInput['canIncrement']\"\n            (click.prevent)=\"clear()\"\n        >\n            <tui-icon icon=\"@tui.x\"></tui-icon>\n        </button>\n    </div>\n</tui-loader>\n", styles: [":host [data-size=l]{--tui-height-l: var(--tui-height-m);--tui-font-text-m: bold .875rem/1.25rem var(--tui-font-text);--tui-padding-l: 0}:host [data-size=m]{--tui-height-m: var(--tui-height-s);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-m: 0}:host [data-size=m] tui-svg{font-size:12px!important}:host [data-size=s]{--tui-height-s: var(--tui-height-xs);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-s: 0}:host [data-size=s] tui-svg{font-size:12px!important}:host[data-disabled=true]{pointer-events:none;opacity:var(--tui-disabled-opacity)}:host[data-appearance=secondary] .field-with-button{background-color:var(--tui-background-base);box-shadow:inset 0 0 0 .0625rem var(--tui-background-neutral-1-hover)}:host[data-appearance=primary] .field-with-button{background-color:var(--tui-status-warning-pale)}:host .field-with-button:has(._invalid){background-color:var(--tui-status-negative-pale)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i5.TuiInputNumberComponent, selector: "tui-input-number", inputs: ["min", "max", "step"] }, { kind: "directive", type: i5.TuiInputNumberDirective, selector: "tui-input-number" }, { kind: "directive", type: i5.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { kind: "directive", type: i5.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "component", type: i1$1.TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.TuiFieldErrorPipe, name: "tuiFieldError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScInputQuantityComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-input-quantity', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-loader\n    *ngIf=\"formControl\"\n    class=\"w-full\"\n    [overlay]=\"true\"\n    [showLoader]=\"showLoader\"\n    [size]=\"size\"\n>\n    <div class=\"flex items-center gap-1 text-center\">\n        <div class=\"field-with-button flex grow rounded-xl\">\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [disabled]=\"!numberInput['canDecrement']\"\n                [size]=\"size\"\n                (click.prevent)=\"decrement()\"\n                (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n            >\n                <tui-icon icon=\"@tui.minus\"></tui-icon>\n            </button>\n            <tui-input-number\n                #numberInput\n                [formControl]=\"formControl\"\n                [tuiHint]=\"([] | tuiFieldError | async)?.message\"\n                [tuiTextfieldLabelOutside]=\"true\"\n                [min]=\"step\"\n                [tuiTextfieldSize]=\"size\"\n                [required]=\"true\"\n                [style.text-align]=\"'center'\"\n                [style.font-weight]=\"700\"\n                (focusin)=\"$any($event.target).select()\"\n                oncontextmenu=\"return false;\"\n                class=\"grow\"\n            >\n            </tui-input-number>\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [size]=\"size\"\n                [disabled]=\"!numberInput['canIncrement']\"\n                (click.prevent)=\"incident()\"\n                (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n            >\n                <tui-icon icon=\"@tui.plus\"></tui-icon>\n            </button>\n        </div>\n        <button\n            *ngIf=\"showCross\"\n            tuiIconButton\n            [appearance]=\"appearance\"\n            [size]=\"size\"\n            [disabled]=\"!numberInput['canIncrement']\"\n            (click.prevent)=\"clear()\"\n            (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n        >\n            <tui-icon icon=\"@tui.x\"></tui-icon>\n        </button>\n    </div>\n</tui-loader>\n", styles: [":host [data-size=l]{--tui-height-l: var(--tui-height-m);--tui-font-text-m: bold .875rem/1.25rem var(--tui-font-text);--tui-padding-l: 0}:host [data-size=m]{--tui-height-m: var(--tui-height-s);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-m: 0}:host [data-size=m] tui-svg{font-size:12px!important}:host [data-size=s]{--tui-height-s: var(--tui-height-xs);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-s: 0}:host [data-size=s] tui-svg{font-size:12px!important}:host[data-disabled=true]{pointer-events:none;opacity:var(--tui-disabled-opacity)}:host[data-appearance=secondary] .field-with-button{background-color:var(--tui-background-base);box-shadow:inset 0 0 0 .0625rem var(--tui-background-neutral-1-hover)}:host[data-appearance=primary] .field-with-button{background-color:var(--tui-status-warning-pale)}:host .field-with-button:has(._invalid){background-color:var(--tui-status-negative-pale)}\n"] }]
+            args: [{ selector: 'sc-input-quantity', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-loader\n    *ngIf=\"formControl\"\n    class=\"w-full\"\n    [overlay]=\"true\"\n    [showLoader]=\"showLoader\"\n    [size]=\"size\"\n>\n    <div class=\"flex items-center gap-1 text-center\">\n        <div class=\"field-with-button flex grow rounded-xl\">\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [disabled]=\"!numberInput['canDecrement']\"\n                [size]=\"size\"\n                (click.prevent)=\"decrement(true)\"\n            >\n                <tui-icon icon=\"@tui.minus\"></tui-icon>\n            </button>\n            <tui-input-number\n                #numberInput\n                [formControl]=\"formControl\"\n                [tuiHint]=\"([] | tuiFieldError | async)?.message\"\n                [tuiTextfieldLabelOutside]=\"true\"\n                [min]=\"ignoreStepValidators ? 1 : step\"\n                [tuiTextfieldSize]=\"size\"\n                [required]=\"true\"\n                [style.text-align]=\"'center'\"\n                [style.font-weight]=\"700\"\n                (focusin)=\"$any($event.target).select()\"\n                oncontextmenu=\"return false;\"\n                class=\"grow\"\n            >\n            </tui-input-number>\n            <button\n                tuiIconButton\n                [appearance]=\"appearance\"\n                [size]=\"size\"\n                [disabled]=\"!numberInput['canIncrement']\"\n                (click.prevent)=\"incident(true)\"\n                (mousedown.prevent)=\"numberInput.nativeFocusableElement?.focus()\"\n            >\n                <tui-icon icon=\"@tui.plus\"></tui-icon>\n            </button>\n        </div>\n        <button\n            *ngIf=\"showCross\"\n            tuiIconButton\n            [appearance]=\"appearance\"\n            [size]=\"size\"\n            [disabled]=\"!numberInput['canIncrement']\"\n            (click.prevent)=\"clear()\"\n        >\n            <tui-icon icon=\"@tui.x\"></tui-icon>\n        </button>\n    </div>\n</tui-loader>\n", styles: [":host [data-size=l]{--tui-height-l: var(--tui-height-m);--tui-font-text-m: bold .875rem/1.25rem var(--tui-font-text);--tui-padding-l: 0}:host [data-size=m]{--tui-height-m: var(--tui-height-s);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-m: 0}:host [data-size=m] tui-svg{font-size:12px!important}:host [data-size=s]{--tui-height-s: var(--tui-height-xs);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-s: 0}:host [data-size=s] tui-svg{font-size:12px!important}:host[data-disabled=true]{pointer-events:none;opacity:var(--tui-disabled-opacity)}:host[data-appearance=secondary] .field-with-button{background-color:var(--tui-background-base);box-shadow:inset 0 0 0 .0625rem var(--tui-background-neutral-1-hover)}:host[data-appearance=primary] .field-with-button{background-color:var(--tui-status-warning-pale)}:host .field-with-button:has(._invalid){background-color:var(--tui-status-negative-pale)}\n"] }]
         }], propDecorators: { numberInput: [{
                 type: ViewChild,
                 args: [TuiInputNumberComponent]
@@ -3410,6 +3380,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
                 type: Input
             }], showCross: [{
                 type: Input
+            }], ignoreStepValidators: [{
+                type: Input
             }], appearance: [{
                 type: Input
             }, {
@@ -3510,11 +3482,11 @@ class ScPriceCardComponent extends AbstractScPriceCard {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScPriceCardComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScPriceCardComponent, selector: "sc-price-card", inputs: { size: "size" }, host: { properties: { "attr.data-size": "this.size", "attr.is_mobile": "this.isMobile", "attr.is_in_cart": "this.isInCart" } }, providers: [SEARCH_TERM_PROVIDERS], usesInheritance: true, ngImport: i0, template: "<div\n    *ngIf=\"product; else skeleton\"\n    class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n    <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n        <img\n            (click)=\"clickCardEvent.emit()\"\n            [src]=\"getCardImagePreview()\"\n            [alt]=\"product.name\"\n            class=\"max-h-full w-full rounded-xl object-cover\"\n        />\n        <sc-favorite-btn\n            *ngIf=\"authStatus$ | async\"\n            class=\"absolute left-2 top-2\"\n            (clickEvent)=\"clickFavoriteEvent.emit()\"\n            [showLoader]=\"favoriteShowLoader\"\n            [isFavorite]=\"product.isFavorite\"\n            [disabled]=\"!!product.primaryCategory?.isFavorite\"\n        ></sc-favorite-btn>\n        <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n            <tui-icon \n                *ngIf=\"product.isPreviouslyOrdered\"\n                icon=\"@tui.star\"\n                class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n            ></tui-icon>\n            <tui-icon \n                *ngIf=\"product.cartItem\"\n                icon=\"@tui.check\"\n                class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n            ></tui-icon>\n        </div>\n    </div>\n    <div class=\"p-2\">\n        <tui-elastic-container class=\"shrink-0\">\n            <a\n                tuiLink\n                class=\"name\"\n                \n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                (click)=\"clickCardEvent.emit()\"\n            >\n                {{ product.name }}\n            </a>\n        </tui-elastic-container>\n        <tui-elastic-container class=\"shrink-0\">\n            <p\n                *ngIf=\"product?.pack\"\n                class=\"text-tui-text-02\"\n            >\n                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n            </p>\n            <p\n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                class=\"code text-tui-text-02\"\n            >\n                \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n            </p>\n\n            <a\n                tuiLink\n                *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n                \n                aria-disabled=\"true\"\n                class=\"history\"\n                (click)=\"clickPriceHistoryEvent.emit()\"\n            >\n                \u0414\u0430\u0442\u0430: {{ product.costDate }}\n            </a>\n        </tui-elastic-container>\n        <div\n            *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n            class=\"flex flex-col\"\n        >\n            <span\n                *ngIf=\"product.discount && !isMobile\"\n                class=\"flex items-center text-tui-text-02\"\n            >\n                <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                <tui-icon \n                    icon=\"@tui.info\"\n                    [tuiHint]=\"discountHint\"\n                    [tuiHintShowDelay]=\"100\"\n                    tuiHintDirection=\"top\"\n                    class=\"!h-4 text-black\"\n                ></tui-icon>\n                <ng-template #discountHint>\n                    <div class=\"font-bold\">{{ product.discount.name }}</div>\n                    <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                </ng-template>\n            </span>\n            <span\n                [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n                class=\"cost font-bold\"\n                >{{ product.costRubString }}</span\n            >\n            <span\n                *ngIf=\"!product.priceInRub\"\n                class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n                >{{ product.costString }}</span\n            >\n            <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n        </div>\n        <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n            <button\n                *ngIf=\"!showQuantityControl\"\n                tuiButton\n                (click)=\"clickAddToCartEvent.emit(product)\"\n                [loading]=\"quantityShowLoader\"\n                [size]=\"size === 's' ? 'xs' : 's'\"\n                class=\"mt-2 grow\"\n                iconStart=\"@tui.shopping-cart\"\n            >\n                \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n            </button>\n            <sc-input-quantity\n                #inputQuantity\n                *ngIf=\"showQuantityControl\"\n                [formControl]=\"quantityControl\"\n                [size]=\"size\"\n                [step]=\"unitsHelper.productMultiplicity(product)\"\n                [showLoader]=\"quantityShowLoader\"\n                (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n                class=\"mt-2 w-full\"\n                (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n            ></sc-input-quantity>\n        </div>\n    </div>\n</div>\n\n<ng-template #skeleton>\n    <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n        <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n        <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n        <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n        <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: i2$1.TuiElasticContainer, selector: "tui-elastic-container" }, { kind: "directive", type: i2$1.TuiHighlight, selector: "[tuiHighlight]", inputs: ["tuiHighlight", "tuiHighlightColor"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }, { kind: "component", type: ScFavoriteBtnComponent, selector: "sc-favorite-btn", inputs: ["isFavorite", "showLoader", "disabled"], outputs: ["clickEvent"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScPriceCardComponent, selector: "sc-price-card", inputs: { size: "size" }, host: { properties: { "attr.data-size": "this.size", "attr.is_mobile": "this.isMobile", "attr.is_in_cart": "this.isInCart" } }, providers: [SEARCH_TERM_PROVIDERS], usesInheritance: true, ngImport: i0, template: "<div\n    *ngIf=\"product; else skeleton\"\n    class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n    <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n        <img\n            (click)=\"clickCardEvent.emit()\"\n            [src]=\"getCardImagePreview()\"\n            [alt]=\"product.name\"\n            class=\"max-h-full w-full rounded-xl object-cover\"\n        />\n        <sc-favorite-btn\n            *ngIf=\"authStatus$ | async\"\n            class=\"absolute left-2 top-2\"\n            (clickEvent)=\"clickFavoriteEvent.emit()\"\n            [showLoader]=\"favoriteShowLoader\"\n            [isFavorite]=\"product.isFavorite\"\n            [disabled]=\"!!product.primaryCategory?.isFavorite\"\n        ></sc-favorite-btn>\n        <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n            <tui-icon \n                *ngIf=\"product.isPreviouslyOrdered\"\n                icon=\"@tui.star\"\n                class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n            ></tui-icon>\n            <tui-icon \n                *ngIf=\"product.cartItem\"\n                icon=\"@tui.check\"\n                class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n            ></tui-icon>\n        </div>\n    </div>\n    <div class=\"p-2\">\n        <tui-elastic-container class=\"shrink-0\">\n            <a\n                tuiLink\n                class=\"name\"\n                \n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                (click)=\"clickCardEvent.emit()\"\n            >\n                {{ product.name }}\n            </a>\n        </tui-elastic-container>\n        <tui-elastic-container class=\"shrink-0\">\n            <p\n                *ngIf=\"product?.pack\"\n                class=\"text-tui-text-02\"\n            >\n                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                <tui-svg\n                    *ngIf=\"product.ignoreMinCountCheck\"\n                    src=\"tuiIconPackage\"\n                    [tuiHint]=\"minCountHint\"\n                    [tuiHintShowDelay]=\"100\"\n                    tuiHintDirection=\"top\"\n                ></tui-svg>\n                <ng-template #minCountHint>\n                    \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n                    \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n                    \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n                </ng-template>\n            </p>\n            <p\n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                class=\"code text-tui-text-02\"\n            >\n                \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n            </p>\n\n            <a\n                tuiLink\n                *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n                \n                aria-disabled=\"true\"\n                class=\"history\"\n                (click)=\"clickPriceHistoryEvent.emit()\"\n            >\n                \u0414\u0430\u0442\u0430: {{ product.costDate }}\n            </a>\n        </tui-elastic-container>\n        <div\n            *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n            class=\"flex flex-col\"\n        >\n            <span\n                *ngIf=\"product.discount && !isMobile\"\n                class=\"flex items-center text-tui-text-02\"\n            >\n                <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                <tui-icon \n                    icon=\"@tui.info\"\n                    [tuiHint]=\"discountHint\"\n                    [tuiHintShowDelay]=\"100\"\n                    tuiHintDirection=\"top\"\n                    class=\"!h-4 text-black\"\n                ></tui-icon>\n                <ng-template #discountHint>\n                    <div class=\"font-bold\">{{ product.discount.name }}</div>\n                    <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                </ng-template>\n            </span>\n            <span\n                [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n                class=\"cost font-bold\"\n                >{{ product.costRubString }}</span\n            >\n            <span\n                *ngIf=\"!product.priceInRub\"\n                class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n                >{{ product.costString }}</span\n            >\n            <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n        </div>\n        <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n            <button\n                *ngIf=\"!showQuantityControl\"\n                tuiButton\n                (click)=\"clickAddToCartEvent.emit(product)\"\n                [loading]=\"quantityShowLoader\"\n                [size]=\"size === 's' ? 'xs' : 's'\"\n                class=\"mt-2 grow\"\n                iconStart=\"@tui.shopping-cart\"\n            >\n                \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n            </button>\n            <sc-input-quantity\n                #inputQuantity\n                *ngIf=\"showQuantityControl\"\n                [formControl]=\"quantityControl\"\n                [size]=\"size\"\n                [step]=\"unitsHelper.productMultiplicity(product)\"\n                [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n                [showLoader]=\"quantityShowLoader\"\n                (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n                class=\"mt-2 w-full\"\n                (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n            ></sc-input-quantity>\n        </div>\n    </div>\n</div>\n\n<ng-template #skeleton>\n    <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n        <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n        <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n        <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n        <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: i2$1.TuiElasticContainer, selector: "tui-elastic-container" }, { kind: "directive", type: i2$1.TuiHighlight, selector: "[tuiHighlight]", inputs: ["tuiHighlight", "tuiHighlightColor"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }, { kind: "component", type: ScFavoriteBtnComponent, selector: "sc-favorite-btn", inputs: ["isFavorite", "showLoader", "disabled"], outputs: ["clickEvent"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "ignoreStepValidators", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScPriceCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-price-card', providers: [SEARCH_TERM_PROVIDERS], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    *ngIf=\"product; else skeleton\"\n    class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n    <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n        <img\n            (click)=\"clickCardEvent.emit()\"\n            [src]=\"getCardImagePreview()\"\n            [alt]=\"product.name\"\n            class=\"max-h-full w-full rounded-xl object-cover\"\n        />\n        <sc-favorite-btn\n            *ngIf=\"authStatus$ | async\"\n            class=\"absolute left-2 top-2\"\n            (clickEvent)=\"clickFavoriteEvent.emit()\"\n            [showLoader]=\"favoriteShowLoader\"\n            [isFavorite]=\"product.isFavorite\"\n            [disabled]=\"!!product.primaryCategory?.isFavorite\"\n        ></sc-favorite-btn>\n        <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n            <tui-icon \n                *ngIf=\"product.isPreviouslyOrdered\"\n                icon=\"@tui.star\"\n                class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n            ></tui-icon>\n            <tui-icon \n                *ngIf=\"product.cartItem\"\n                icon=\"@tui.check\"\n                class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n            ></tui-icon>\n        </div>\n    </div>\n    <div class=\"p-2\">\n        <tui-elastic-container class=\"shrink-0\">\n            <a\n                tuiLink\n                class=\"name\"\n                \n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                (click)=\"clickCardEvent.emit()\"\n            >\n                {{ product.name }}\n            </a>\n        </tui-elastic-container>\n        <tui-elastic-container class=\"shrink-0\">\n            <p\n                *ngIf=\"product?.pack\"\n                class=\"text-tui-text-02\"\n            >\n                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n            </p>\n            <p\n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                class=\"code text-tui-text-02\"\n            >\n                \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n            </p>\n\n            <a\n                tuiLink\n                *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n                \n                aria-disabled=\"true\"\n                class=\"history\"\n                (click)=\"clickPriceHistoryEvent.emit()\"\n            >\n                \u0414\u0430\u0442\u0430: {{ product.costDate }}\n            </a>\n        </tui-elastic-container>\n        <div\n            *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n            class=\"flex flex-col\"\n        >\n            <span\n                *ngIf=\"product.discount && !isMobile\"\n                class=\"flex items-center text-tui-text-02\"\n            >\n                <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                <tui-icon \n                    icon=\"@tui.info\"\n                    [tuiHint]=\"discountHint\"\n                    [tuiHintShowDelay]=\"100\"\n                    tuiHintDirection=\"top\"\n                    class=\"!h-4 text-black\"\n                ></tui-icon>\n                <ng-template #discountHint>\n                    <div class=\"font-bold\">{{ product.discount.name }}</div>\n                    <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                </ng-template>\n            </span>\n            <span\n                [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n                class=\"cost font-bold\"\n                >{{ product.costRubString }}</span\n            >\n            <span\n                *ngIf=\"!product.priceInRub\"\n                class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n                >{{ product.costString }}</span\n            >\n            <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n        </div>\n        <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n            <button\n                *ngIf=\"!showQuantityControl\"\n                tuiButton\n                (click)=\"clickAddToCartEvent.emit(product)\"\n                [loading]=\"quantityShowLoader\"\n                [size]=\"size === 's' ? 'xs' : 's'\"\n                class=\"mt-2 grow\"\n                iconStart=\"@tui.shopping-cart\"\n            >\n                \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n            </button>\n            <sc-input-quantity\n                #inputQuantity\n                *ngIf=\"showQuantityControl\"\n                [formControl]=\"quantityControl\"\n                [size]=\"size\"\n                [step]=\"unitsHelper.productMultiplicity(product)\"\n                [showLoader]=\"quantityShowLoader\"\n                (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n                class=\"mt-2 w-full\"\n                (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n            ></sc-input-quantity>\n        </div>\n    </div>\n</div>\n\n<ng-template #skeleton>\n    <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n        <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n        <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n        <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n        <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"] }]
+            args: [{ selector: 'sc-price-card', providers: [SEARCH_TERM_PROVIDERS], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    *ngIf=\"product; else skeleton\"\n    class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n    <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n        <img\n            (click)=\"clickCardEvent.emit()\"\n            [src]=\"getCardImagePreview()\"\n            [alt]=\"product.name\"\n            class=\"max-h-full w-full rounded-xl object-cover\"\n        />\n        <sc-favorite-btn\n            *ngIf=\"authStatus$ | async\"\n            class=\"absolute left-2 top-2\"\n            (clickEvent)=\"clickFavoriteEvent.emit()\"\n            [showLoader]=\"favoriteShowLoader\"\n            [isFavorite]=\"product.isFavorite\"\n            [disabled]=\"!!product.primaryCategory?.isFavorite\"\n        ></sc-favorite-btn>\n        <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n            <tui-icon \n                *ngIf=\"product.isPreviouslyOrdered\"\n                icon=\"@tui.star\"\n                class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n            ></tui-icon>\n            <tui-icon \n                *ngIf=\"product.cartItem\"\n                icon=\"@tui.check\"\n                class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n            ></tui-icon>\n        </div>\n    </div>\n    <div class=\"p-2\">\n        <tui-elastic-container class=\"shrink-0\">\n            <a\n                tuiLink\n                class=\"name\"\n                \n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                (click)=\"clickCardEvent.emit()\"\n            >\n                {{ product.name }}\n            </a>\n        </tui-elastic-container>\n        <tui-elastic-container class=\"shrink-0\">\n            <p\n                *ngIf=\"product?.pack\"\n                class=\"text-tui-text-02\"\n            >\n                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                <tui-svg\n                    *ngIf=\"product.ignoreMinCountCheck\"\n                    src=\"tuiIconPackage\"\n                    [tuiHint]=\"minCountHint\"\n                    [tuiHintShowDelay]=\"100\"\n                    tuiHintDirection=\"top\"\n                ></tui-svg>\n                <ng-template #minCountHint>\n                    \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n                    \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n                    \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n                </ng-template>\n            </p>\n            <p\n                [tuiHighlight]=\"(search$ | async) ?? ''\"\n                class=\"code text-tui-text-02\"\n            >\n                \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n            </p>\n\n            <a\n                tuiLink\n                *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n                \n                aria-disabled=\"true\"\n                class=\"history\"\n                (click)=\"clickPriceHistoryEvent.emit()\"\n            >\n                \u0414\u0430\u0442\u0430: {{ product.costDate }}\n            </a>\n        </tui-elastic-container>\n        <div\n            *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n            class=\"flex flex-col\"\n        >\n            <span\n                *ngIf=\"product.discount && !isMobile\"\n                class=\"flex items-center text-tui-text-02\"\n            >\n                <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                <tui-icon \n                    icon=\"@tui.info\"\n                    [tuiHint]=\"discountHint\"\n                    [tuiHintShowDelay]=\"100\"\n                    tuiHintDirection=\"top\"\n                    class=\"!h-4 text-black\"\n                ></tui-icon>\n                <ng-template #discountHint>\n                    <div class=\"font-bold\">{{ product.discount.name }}</div>\n                    <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                </ng-template>\n            </span>\n            <span\n                [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n                class=\"cost font-bold\"\n                >{{ product.costRubString }}</span\n            >\n            <span\n                *ngIf=\"!product.priceInRub\"\n                class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n                >{{ product.costString }}</span\n            >\n            <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n        </div>\n        <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n            <button\n                *ngIf=\"!showQuantityControl\"\n                tuiButton\n                (click)=\"clickAddToCartEvent.emit(product)\"\n                [loading]=\"quantityShowLoader\"\n                [size]=\"size === 's' ? 'xs' : 's'\"\n                class=\"mt-2 grow\"\n                iconStart=\"@tui.shopping-cart\"\n            >\n                \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n            </button>\n            <sc-input-quantity\n                #inputQuantity\n                *ngIf=\"showQuantityControl\"\n                [formControl]=\"quantityControl\"\n                [size]=\"size\"\n                [step]=\"unitsHelper.productMultiplicity(product)\"\n                [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n                [showLoader]=\"quantityShowLoader\"\n                (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n                class=\"mt-2 w-full\"\n                (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n            ></sc-input-quantity>\n        </div>\n    </div>\n</div>\n\n<ng-template #skeleton>\n    <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n        <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n        <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n        <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n        <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n            <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { size: [{
                 type: Input
             }, {
@@ -3545,12 +3517,20 @@ class ScPriceHistoryComponent {
         this.months$ = months$;
         this.userMetrikaService = userMetrikaService;
         this.context = context;
+        /**
+         * Признак того, отображается этот компонент на мобильном устройстве или нет.
+         */
+        this.isMobile = inject(TUI_IS_MOBILE);
         /**
          * {@link Observable} функция для преобразования значения number в строку в подсказке по оси X.
          */
         this.xStringify$ = this.months$.pipe(map((months) => ({ month, day }) => 
         // eslint-disable-next-line security/detect-object-injection
         `${months[month]}, ${day}`));
+        /**
+         * Относительные отступы от верхнего и нижнего края в процентах.
+         */
+        this.paddingPercent = 10;
         /**
          * Функция для преобразования значения number в строку в подсказке по оси Y.
          *
@@ -3578,9 +3558,7 @@ class ScPriceHistoryComponent {
             min: Math.min(...values),
             max: Math.max(...values),
         })));
-        this.range$ = this.history$.pipe(filter(tuiIsPresent), filter((history) => history.length > 1), map((value) => ({ from: value.at(0)?.[0], to: value.at(-1)?.[0] })), filter((range) => !!range.from && !!range.to), map((range) => {
-            return new TuiDayRange(range.from, range.to);
-        }));
+        this.range$ = this.history$.pipe(filter(tuiIsPresent), filter((history) => history.length > 1), map((value) => ({ from: value.at(0)?.[0], to: value.at(-1)?.[0] })), filter((range) => !!range.from && !!range.to), map((range) => new TuiDayRange(range.from, range.to)));
     }
     /**
      * Вычисляет подписи даты к оси X.
@@ -3590,7 +3568,14 @@ class ScPriceHistoryComponent {
      * @param param0.to {@link TuiDay} Дата конца истории цен.
      */
     computeLabels$({ from, to }) {
-        return this.months$.pipe(map((months) => [...Array.from({ length: TuiMonth.lengthBetween(from, to) + 1 }, (_, index) => months[from.append({ month: index }).month]), '']));
+        return this.months$.pipe(map((months) => [
+            ...Array.from({ length: TuiMonth.lengthBetween(from, to) + 1 }, (_, index) => {
+                const previousYear = from.append({ month: index - 1 }).year; // Начальный год
+                const currentYear = from.append({ month: index }).year;
+                return `${this.isMobile || previousYear === currentYear ? '' : currentYear} ${months[from.append({ month: index }).month]}`;
+            }),
+            '',
+        ]));
     }
     /**
      * Вычисляет данные для отображения на графике.
@@ -3617,7 +3602,7 @@ class ScPriceHistoryComponent {
         }, []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScPriceHistoryComponent, deps: [{ token: i1.ScCatalogService }, { token: TUI_MONTHS }, { token: i1.ScUserMetrikaService }, { token: POLYMORPHEUS_CONTEXT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScPriceHistoryComponent, selector: "sc-price-history", inputs: { product: "product" }, ngImport: i0, template: "<tui-loader [showLoader]=\"!!(loadingHistory$ | async)\"> </tui-loader>\n\n<div\n    *ngIf=\"(loadingHistory$ | async) === false\"\n    class=\"flex flex-col items-center\"\n>\n    <ng-container *ngIf=\"priceInfo$ | async as priceInfo; else isNotExist\">\n        <div class=\"w-174 mb-1 text-end text-lg font-bold\">\u043E\u0442 {{ priceInfo.min.toLocaleString() }} \u20BD \u0434\u043E {{ priceInfo.max.toLocaleString() }} \u20BD</div>\n\n        <ng-container *ngIf=\"history$ | async as history\">\n            <div\n                *ngIf=\"range$ | async as range\"\n                class=\"relative h-56 w-full p-5 text-tui-primary\"\n            >\n                <tui-axes\n                    *ngIf=\"computeLabels$(range) | async as labels\"\n                    class=\"h-full\"\n                    [axisXLabels]=\"labels\"\n                    [horizontalLines]=\"4\"\n                    [verticalLines]=\"labels.length\"\n                >\n                    <tui-line-days-chart\n                        class=\"chart\"\n                        [height]=\"priceInfo.max\"\n                        [smoothingFactor]=\"10\"\n                        [y]=\"priceInfo.min - (priceInfo.min * 1) / 4\"\n                        [value]=\"computeValue(range, history)\"\n                        [xStringify]=\"xStringify$ | async\"\n                        [yStringify]=\"yStringify\"\n                        [hintContent]=\"hint\"\n                    ></tui-line-days-chart>\n                </tui-axes>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-template #isNotExist>\n        <p class=\"text-base font-bold\">\u0426\u0435\u043D\u0430 \u043D\u0430 \u0442\u043E\u0432\u0430\u0440 \u043D\u0435 \u0438\u0437\u043C\u0435\u043D\u044F\u043B\u0430\u0441\u044C</p>\n    </ng-template>\n    <ng-template\n        #hint\n        let-data\n    >\n        <div class=\"font-bold\">{{ data[1].toLocaleString() }} \u20BD</div>\n        <div>{{ data[0] }}</div>\n    </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "component", type: i4$1.TuiLineDaysChart, selector: "tui-line-days-chart", inputs: ["y", "height", "smoothingFactor", "hintContent", "xStringify", "yStringify", "dots", "value"] }, { kind: "component", type: i4$1.TuiAxes, selector: "tui-axes", inputs: ["axisX", "axisXLabels", "axisY", "axisYInset", "axisYLabels", "axisYName", "axisYSecondaryInset", "axisYSecondaryLabels", "axisYSecondaryName", "horizontalLines", "horizontalLinesHandler", "verticalLines", "verticalLinesHandler"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScPriceHistoryComponent, selector: "sc-price-history", inputs: { product: "product" }, ngImport: i0, template: "<tui-loader [showLoader]=\"!!(loadingHistory$ | async)\"> </tui-loader>\n\n<div\n    *ngIf=\"(loadingHistory$ | async) === false\"\n    class=\"flex flex-col items-center\"\n>\n    <ng-container *ngIf=\"priceInfo$ | async as priceInfo; else isNotExist\">\n        <div class=\"w-174 mb-1 text-end text-lg font-bold\">\u043E\u0442 {{ priceInfo.min.toLocaleString() }} \u20BD \u0434\u043E {{ priceInfo.max.toLocaleString() }} \u20BD</div>\n\n        <ng-container *ngIf=\"history$ | async as history\">\n            <div\n                *ngIf=\"range$ | async as range\"\n                class=\"relative h-56 w-full p-5 text-tui-primary\"\n            >\n                <tui-axes\n                    *ngIf=\"computeLabels$(range) | async as labels\"\n                    class=\"h-full\"\n                    [axisXLabels]=\"labels\"\n                    [horizontalLines]=\"4\"\n                    [verticalLines]=\"labels.length\"\n                >\n                    <ng-container *tuiLet=\"priceInfo.max - priceInfo.min as height\">\n                        <tui-line-days-chart\n                            *ngIf=\"(height / 100) * paddingPercent as padding\"\n                            [height]=\"height + (height / 100) * paddingPercent * 2\"\n                            [smoothingFactor]=\"10\"\n                            [y]=\"priceInfo.min - (height / 100) * paddingPercent\"\n                            [value]=\"computeValue(range, history)\"\n                            [xStringify]=\"xStringify$ | async\"\n                            [yStringify]=\"yStringify\"\n                            [hintContent]=\"hint\"\n                            class=\"chart\"\n                        ></tui-line-days-chart>\n                    </ng-container>\n                </tui-axes>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-template #isNotExist>\n        <p class=\"text-base font-bold\">\u0426\u0435\u043D\u0430 \u043D\u0430 \u0442\u043E\u0432\u0430\u0440 \u043D\u0435 \u0438\u0437\u043C\u0435\u043D\u044F\u043B\u0430\u0441\u044C</p>\n    </ng-template>\n    <ng-template\n        #hint\n        let-data\n    >\n        <div class=\"font-bold\">{{ data[1].toLocaleString() }} \u20BD</div>\n        <div>{{ data[0] }}</div>\n    </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "directive", type: i7.TuiLet, selector: "[tuiLet]", inputs: ["tuiLet"] }, { kind: "component", type: i5$1.TuiLineDaysChart, selector: "tui-line-days-chart", inputs: ["y", "height", "smoothingFactor", "hintContent", "xStringify", "yStringify", "dots", "value"] }, { kind: "component", type: i5$1.TuiAxes, selector: "tui-axes", inputs: ["axisX", "axisXLabels", "axisY", "axisYInset", "axisYLabels", "axisYName", "axisYSecondaryInset", "axisYSecondaryLabels", "axisYSecondaryName", "horizontalLines", "horizontalLinesHandler", "verticalLines", "verticalLinesHandler"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     tuiPure
@@ -3627,8 +3612,8 @@ __decorate([
 ], ScPriceHistoryComponent.prototype, "computeValue", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScPriceHistoryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-price-history', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-loader [showLoader]=\"!!(loadingHistory$ | async)\"> </tui-loader>\n\n<div\n    *ngIf=\"(loadingHistory$ | async) === false\"\n    class=\"flex flex-col items-center\"\n>\n    <ng-container *ngIf=\"priceInfo$ | async as priceInfo; else isNotExist\">\n        <div class=\"w-174 mb-1 text-end text-lg font-bold\">\u043E\u0442 {{ priceInfo.min.toLocaleString() }} \u20BD \u0434\u043E {{ priceInfo.max.toLocaleString() }} \u20BD</div>\n\n        <ng-container *ngIf=\"history$ | async as history\">\n            <div\n                *ngIf=\"range$ | async as range\"\n                class=\"relative h-56 w-full p-5 text-tui-primary\"\n            >\n                <tui-axes\n                    *ngIf=\"computeLabels$(range) | async as labels\"\n                    class=\"h-full\"\n                    [axisXLabels]=\"labels\"\n                    [horizontalLines]=\"4\"\n                    [verticalLines]=\"labels.length\"\n                >\n                    <tui-line-days-chart\n                        class=\"chart\"\n                        [height]=\"priceInfo.max\"\n                        [smoothingFactor]=\"10\"\n                        [y]=\"priceInfo.min - (priceInfo.min * 1) / 4\"\n                        [value]=\"computeValue(range, history)\"\n                        [xStringify]=\"xStringify$ | async\"\n                        [yStringify]=\"yStringify\"\n                        [hintContent]=\"hint\"\n                    ></tui-line-days-chart>\n                </tui-axes>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-template #isNotExist>\n        <p class=\"text-base font-bold\">\u0426\u0435\u043D\u0430 \u043D\u0430 \u0442\u043E\u0432\u0430\u0440 \u043D\u0435 \u0438\u0437\u043C\u0435\u043D\u044F\u043B\u0430\u0441\u044C</p>\n    </ng-template>\n    <ng-template\n        #hint\n        let-data\n    >\n        <div class=\"font-bold\">{{ data[1].toLocaleString() }} \u20BD</div>\n        <div>{{ data[0] }}</div>\n    </ng-template>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i1.ScCatalogService }, { type: i5$1.Observable, decorators: [{
+            args: [{ selector: 'sc-price-history', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-loader [showLoader]=\"!!(loadingHistory$ | async)\"> </tui-loader>\n\n<div\n    *ngIf=\"(loadingHistory$ | async) === false\"\n    class=\"flex flex-col items-center\"\n>\n    <ng-container *ngIf=\"priceInfo$ | async as priceInfo; else isNotExist\">\n        <div class=\"w-174 mb-1 text-end text-lg font-bold\">\u043E\u0442 {{ priceInfo.min.toLocaleString() }} \u20BD \u0434\u043E {{ priceInfo.max.toLocaleString() }} \u20BD</div>\n\n        <ng-container *ngIf=\"history$ | async as history\">\n            <div\n                *ngIf=\"range$ | async as range\"\n                class=\"relative h-56 w-full p-5 text-tui-primary\"\n            >\n                <tui-axes\n                    *ngIf=\"computeLabels$(range) | async as labels\"\n                    class=\"h-full\"\n                    [axisXLabels]=\"labels\"\n                    [horizontalLines]=\"4\"\n                    [verticalLines]=\"labels.length\"\n                >\n                    <ng-container *tuiLet=\"priceInfo.max - priceInfo.min as height\">\n                        <tui-line-days-chart\n                            *ngIf=\"(height / 100) * paddingPercent as padding\"\n                            [height]=\"height + (height / 100) * paddingPercent * 2\"\n                            [smoothingFactor]=\"10\"\n                            [y]=\"priceInfo.min - (height / 100) * paddingPercent\"\n                            [value]=\"computeValue(range, history)\"\n                            [xStringify]=\"xStringify$ | async\"\n                            [yStringify]=\"yStringify\"\n                            [hintContent]=\"hint\"\n                            class=\"chart\"\n                        ></tui-line-days-chart>\n                    </ng-container>\n                </tui-axes>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-template #isNotExist>\n        <p class=\"text-base font-bold\">\u0426\u0435\u043D\u0430 \u043D\u0430 \u0442\u043E\u0432\u0430\u0440 \u043D\u0435 \u0438\u0437\u043C\u0435\u043D\u044F\u043B\u0430\u0441\u044C</p>\n    </ng-template>\n    <ng-template\n        #hint\n        let-data\n    >\n        <div class=\"font-bold\">{{ data[1].toLocaleString() }} \u20BD</div>\n        <div>{{ data[0] }}</div>\n    </ng-template>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1.ScCatalogService }, { type: i6.Observable, decorators: [{
                     type: Inject,
                     args: [TUI_MONTHS]
                 }] }, { type: i1.ScUserMetrikaService }, { type: undefined, decorators: [{
@@ -3859,13 +3844,13 @@ class ScCartItemMobileComponent {
     getCardImage() {
         return this.product?.getImagePreview(this.urls.imgServerUrl) ?? this.urls.imgServerUrl + this.pathImageNotFound;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScCartItemMobileComponent, deps: [{ token: ScUnitsHelper }, { token: TuiPreviewDialogService }, { token: SC_URLS }, { token: SC_PATH_IMAGE_NOT_FOUND }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScCartItemMobileComponent, selector: "sc-cart-item-mobile", inputs: { cartItem: "cartItem" }, outputs: { quantityValueChanges: "quantityValueChanges", clickDeleteEvent: "clickDeleteEvent", clickSettingsEvent: "clickSettingsEvent", clickCardEvent: "clickCardEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n    <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n        <div class=\"flex w-40 items-center\">\n            <img\n                (click)=\"clickCardEvent.emit()\"\n                [src]=\"getCardImage()\"\n                [alt]=\"product.name\"\n                class=\"max-h-full w-full rounded-xl object-cover\"\n            />\n        </div>\n        <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n            <div class=\"flex max-w-full flex-col gap-1 self-start\">\n                <a\n                    tuiLink\n                    (click)=\"clickCardEvent.emit()\"\n                >\n                    <span class=\"font-bold\">{{ product.name }}</span>\n                </a>\n\n                <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-05\">\n                    <p *ngIf=\"product.pack\">\u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}</p>\n                    <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                </div>\n\n                <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n                    <p\n                        *ngIf=\"!product.priceInRub\"\n                        class=\"font-bold\"\n                    >\n                        {{ product.costString }}\n                    </p>\n                    <p class=\"text-xs font-bold text-tui-base-05\">{{ product.costRubString }}</p>\n                    <span\n                        *ngIf=\"product.discount\"\n                        class=\"flex items-center\"\n                    >\n                        <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                        <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                        <tui-icon\n                            icon=\"@tui.info\"\n                            [tuiHint]=\"discountHint\"\n                            [tuiHintShowDelay]=\"100\"\n                            tuiHintDirection=\"top\"\n                            class=\"!h-4 !text-xs\"\n                        ></tui-icon>\n                        <ng-template #discountHint>\n                            <div class=\"font-bold\">{{ product.discount.name }}</div>\n                            <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                        </ng-template>\n                    </span>\n                </div>\n\n                <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n                <div\n                    *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n                    class=\"flex items-center gap-1\"\n                >\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.settings\"\n                        (click)=\"clickSettingsEvent.emit()\"\n                        size=\"s\"\n                        appearance=\"secondary\"\n                        class=\"mr-2 !self-center\"\n                    ></button>\n                    <div class=\"flex flex-wrap gap-x-2 text-xs font-thin text-tui-base-04\">\n                        <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n                        <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n                        <ng-container *ngIf=\"cartItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n                        </ng-template>\n                    </div>\n                </div>\n\n                <a\n                    tuiLink\n                    *ngIf=\"cartItem.specificationImgUrl\"\n                    (click)=\"showSpecification()\"\n                    >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                >\n                <ng-template\n                    #specificationPreview\n                    let-preview\n                >\n                    <tui-preview\n                        [rotatable]=\"false\"\n                        [zoomable]=\"false\"\n                    >\n                        <img\n                            *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n                            alt=\"preview\"\n                            [src]=\"cartItem.specificationImgUrl\"\n                        />\n                        <button\n                            iconStart=\"@tui.x\"\n                            title=\"Close\"\n                            tuiIconButton\n                            tuiPreviewAction\n                            type=\"button\"\n                            (click)=\"preview.complete()\"\n                        ></button>\n                    </tui-preview>\n                </ng-template>\n            </div>\n            <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n                <div class=\"flex gap-2\">\n                    <sc-input-quantity\n                        #inputQuantity\n                        *ngIf=\"quantityControl\"\n                        [formControl]=\"quantityControl\"\n                        [showCross]=\"false\"\n                        size=\"s\"\n                        [step]=\"unitsHelper.productMultiplicity(product)\"\n                        (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n                        class=\"w-28\"\n                    ></sc-input-quantity>\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.trash-2\"\n                        [style.border-radius.%]=\"100\"\n                        size=\"xs\"\n                        (click)=\"clickDeleteEvent.emit()\"\n                    ></button>\n                </div>\n                <p class=\"text-sm font-bold text-tui-text-01\">\u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber }} {{ 'RUB' | tuiCurrency }}</p>\n            </div>\n        </div>\n    </div>\n</ng-container>\n\n<ng-template #skeleton>\n    <div class=\"flex w-full gap-2\">\n        <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n        <div class=\"flex grow flex-col gap-2.5 bg-white\">\n            <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i2$1.TuiPreviewAction, selector: "[tuiPreviewAction]" }, { kind: "directive", type: i2$2.PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "pipe", type: i9.TuiCurrencyPipe, name: "tuiCurrency" }, { kind: "pipe", type: i1$1.TuiFormatNumberPipe, name: "tuiFormatNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScCartItemMobileComponent, deps: [{ token: i1.ScUnitsHelper }, { token: TuiPreviewDialogService }, { token: SC_URLS }, { token: SC_PATH_IMAGE_NOT_FOUND }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScCartItemMobileComponent, selector: "sc-cart-item-mobile", inputs: { cartItem: "cartItem" }, outputs: { quantityValueChanges: "quantityValueChanges", clickDeleteEvent: "clickDeleteEvent", clickSettingsEvent: "clickSettingsEvent", clickCardEvent: "clickCardEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n    <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n        <div class=\"flex w-40 items-center\">\n            <img\n                (click)=\"clickCardEvent.emit()\"\n                [src]=\"getCardImage()\"\n                [alt]=\"product.name\"\n                class=\"max-h-full w-full rounded-xl object-cover\"\n            />\n        </div>\n        <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n            <div class=\"flex max-w-full flex-col gap-1 self-start\">\n                <a\n                    tuiLink\n                    (click)=\"clickCardEvent.emit()\"\n                >\n                    <span class=\"font-bold\">{{ product.name }}</span>\n                </a>\n\n                <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-05\">\n                    <p *ngIf=\"product.pack\">\n                        \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                        <tui-svg\n                            *ngIf=\"product.ignoreMinCountCheck\"\n                            src=\"tuiIconPackage\"\n                            [tuiHint]=\"minCountHint\"\n                            [tuiHintShowDelay]=\"100\"\n                            tuiHintDirection=\"top\"\n                        ></tui-svg>\n                        <ng-template #minCountHint>\n                            \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n                            \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n                            \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n                        </ng-template>\n                    </p>\n                    <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                </div>\n\n                <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n                    <p\n                        *ngIf=\"!product.priceInRub\"\n                        class=\"font-bold\"\n                    >\n                        {{ product.costString }}\n                    </p>\n                    <p class=\"text-xs font-bold text-tui-base-05\">{{ product.costRubString }}</p>\n                    <span\n                        *ngIf=\"product.discount\"\n                        class=\"flex items-center\"\n                    >\n                        <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                        <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                        <tui-icon\n                            icon=\"@tui.info\"\n                            [tuiHint]=\"discountHint\"\n                            [tuiHintShowDelay]=\"100\"\n                            tuiHintDirection=\"top\"\n                            class=\"!h-4 !text-xs\"\n                        ></tui-icon>\n                        <ng-template #discountHint>\n                            <div class=\"font-bold\">{{ product.discount.name }}</div>\n                            <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                        </ng-template>\n                    </span>\n                </div>\n\n                <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n                <div\n                    *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n                    class=\"flex items-center gap-1\"\n                >\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.settings\"\n                        (click)=\"clickSettingsEvent.emit()\"\n                        size=\"s\"\n                        appearance=\"secondary\"\n                        class=\"mr-2 !self-center\"\n                    ></button>\n                    <div class=\"flex flex-wrap gap-x-2 text-xs font-thin text-tui-base-04\">\n                        <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n                        <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n                        <ng-container *ngIf=\"cartItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n                        </ng-template>\n                    </div>\n                </div>\n\n                <a\n                    tuiLink\n                    *ngIf=\"cartItem.specificationImgUrl\"\n                    (click)=\"showSpecification()\"\n                    >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                >\n                <ng-template\n                    #specificationPreview\n                    let-preview\n                >\n                    <tui-preview\n                        [rotatable]=\"false\"\n                        [zoomable]=\"false\"\n                    >\n                        <img\n                            *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n                            alt=\"preview\"\n                            [src]=\"cartItem.specificationImgUrl\"\n                        />\n                        <button\n                            iconStart=\"@tui.x\"\n                            title=\"Close\"\n                            tuiIconButton\n                            tuiPreviewAction\n                            type=\"button\"\n                            (click)=\"preview.complete()\"\n                        ></button>\n                    </tui-preview>\n                </ng-template>\n            </div>\n            <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n                <div class=\"flex gap-2\">\n                    <sc-input-quantity\n                        #inputQuantity\n                        *ngIf=\"quantityControl\"\n                        [formControl]=\"quantityControl\"\n                        [showCross]=\"false\"\n                        size=\"s\"\n                        [step]=\"unitsHelper.productMultiplicity(product)\"\n                        [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n                        (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n                        class=\"w-28\"\n                    ></sc-input-quantity>\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.trash-2\"\n                        [style.border-radius.%]=\"100\"\n                        size=\"xs\"\n                        (click)=\"clickDeleteEvent.emit()\"\n                    ></button>\n                </div>\n                <p class=\"text-sm font-bold text-tui-text-01\">\u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber }} {{ 'RUB' | tuiCurrency }}</p>\n            </div>\n        </div>\n    </div>\n</ng-container>\n\n<ng-template #skeleton>\n    <div class=\"flex w-full gap-2\">\n        <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n        <div class=\"flex grow flex-col gap-2.5 bg-white\">\n            <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "ignoreStepValidators", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i2$1.TuiPreviewAction, selector: "[tuiPreviewAction]" }, { kind: "directive", type: i2$2.PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "pipe", type: i9.TuiCurrencyPipe, name: "tuiCurrency" }, { kind: "pipe", type: i1$1.TuiFormatNumberPipe, name: "tuiFormatNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScCartItemMobileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-cart-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n    <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n        <div class=\"flex w-40 items-center\">\n            <img\n                (click)=\"clickCardEvent.emit()\"\n                [src]=\"getCardImage()\"\n                [alt]=\"product.name\"\n                class=\"max-h-full w-full rounded-xl object-cover\"\n            />\n        </div>\n        <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n            <div class=\"flex max-w-full flex-col gap-1 self-start\">\n                <a\n                    tuiLink\n                    (click)=\"clickCardEvent.emit()\"\n                >\n                    <span class=\"font-bold\">{{ product.name }}</span>\n                </a>\n\n                <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-05\">\n                    <p *ngIf=\"product.pack\">\u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}</p>\n                    <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                </div>\n\n                <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n                    <p\n                        *ngIf=\"!product.priceInRub\"\n                        class=\"font-bold\"\n                    >\n                        {{ product.costString }}\n                    </p>\n                    <p class=\"text-xs font-bold text-tui-base-05\">{{ product.costRubString }}</p>\n                    <span\n                        *ngIf=\"product.discount\"\n                        class=\"flex items-center\"\n                    >\n                        <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                        <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                        <tui-icon\n                            icon=\"@tui.info\"\n                            [tuiHint]=\"discountHint\"\n                            [tuiHintShowDelay]=\"100\"\n                            tuiHintDirection=\"top\"\n                            class=\"!h-4 !text-xs\"\n                        ></tui-icon>\n                        <ng-template #discountHint>\n                            <div class=\"font-bold\">{{ product.discount.name }}</div>\n                            <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                        </ng-template>\n                    </span>\n                </div>\n\n                <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n                <div\n                    *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n                    class=\"flex items-center gap-1\"\n                >\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.settings\"\n                        (click)=\"clickSettingsEvent.emit()\"\n                        size=\"s\"\n                        appearance=\"secondary\"\n                        class=\"mr-2 !self-center\"\n                    ></button>\n                    <div class=\"flex flex-wrap gap-x-2 text-xs font-thin text-tui-base-04\">\n                        <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n                        <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n                        <ng-container *ngIf=\"cartItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n                        </ng-template>\n                    </div>\n                </div>\n\n                <a\n                    tuiLink\n                    *ngIf=\"cartItem.specificationImgUrl\"\n                    (click)=\"showSpecification()\"\n                    >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                >\n                <ng-template\n                    #specificationPreview\n                    let-preview\n                >\n                    <tui-preview\n                        [rotatable]=\"false\"\n                        [zoomable]=\"false\"\n                    >\n                        <img\n                            *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n                            alt=\"preview\"\n                            [src]=\"cartItem.specificationImgUrl\"\n                        />\n                        <button\n                            iconStart=\"@tui.x\"\n                            title=\"Close\"\n                            tuiIconButton\n                            tuiPreviewAction\n                            type=\"button\"\n                            (click)=\"preview.complete()\"\n                        ></button>\n                    </tui-preview>\n                </ng-template>\n            </div>\n            <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n                <div class=\"flex gap-2\">\n                    <sc-input-quantity\n                        #inputQuantity\n                        *ngIf=\"quantityControl\"\n                        [formControl]=\"quantityControl\"\n                        [showCross]=\"false\"\n                        size=\"s\"\n                        [step]=\"unitsHelper.productMultiplicity(product)\"\n                        (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n                        class=\"w-28\"\n                    ></sc-input-quantity>\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.trash-2\"\n                        [style.border-radius.%]=\"100\"\n                        size=\"xs\"\n                        (click)=\"clickDeleteEvent.emit()\"\n                    ></button>\n                </div>\n                <p class=\"text-sm font-bold text-tui-text-01\">\u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber }} {{ 'RUB' | tuiCurrency }}</p>\n            </div>\n        </div>\n    </div>\n</ng-container>\n\n<ng-template #skeleton>\n    <div class=\"flex w-full gap-2\">\n        <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n        <div class=\"flex grow flex-col gap-2.5 bg-white\">\n            <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: ScUnitsHelper }, { type: i2$1.TuiPreviewDialogService, decorators: [{
+            args: [{ selector: 'sc-cart-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n    <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n        <div class=\"flex w-40 items-center\">\n            <img\n                (click)=\"clickCardEvent.emit()\"\n                [src]=\"getCardImage()\"\n                [alt]=\"product.name\"\n                class=\"max-h-full w-full rounded-xl object-cover\"\n            />\n        </div>\n        <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n            <div class=\"flex max-w-full flex-col gap-1 self-start\">\n                <a\n                    tuiLink\n                    (click)=\"clickCardEvent.emit()\"\n                >\n                    <span class=\"font-bold\">{{ product.name }}</span>\n                </a>\n\n                <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-05\">\n                    <p *ngIf=\"product.pack\">\n                        \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                        <tui-svg\n                            *ngIf=\"product.ignoreMinCountCheck\"\n                            src=\"tuiIconPackage\"\n                            [tuiHint]=\"minCountHint\"\n                            [tuiHintShowDelay]=\"100\"\n                            tuiHintDirection=\"top\"\n                        ></tui-svg>\n                        <ng-template #minCountHint>\n                            \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n                            \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n                            \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n                        </ng-template>\n                    </p>\n                    <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                </div>\n\n                <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n                    <p\n                        *ngIf=\"!product.priceInRub\"\n                        class=\"font-bold\"\n                    >\n                        {{ product.costString }}\n                    </p>\n                    <p class=\"text-xs font-bold text-tui-base-05\">{{ product.costRubString }}</p>\n                    <span\n                        *ngIf=\"product.discount\"\n                        class=\"flex items-center\"\n                    >\n                        <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                        <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                        <tui-icon\n                            icon=\"@tui.info\"\n                            [tuiHint]=\"discountHint\"\n                            [tuiHintShowDelay]=\"100\"\n                            tuiHintDirection=\"top\"\n                            class=\"!h-4 !text-xs\"\n                        ></tui-icon>\n                        <ng-template #discountHint>\n                            <div class=\"font-bold\">{{ product.discount.name }}</div>\n                            <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                        </ng-template>\n                    </span>\n                </div>\n\n                <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n                <div\n                    *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n                    class=\"flex items-center gap-1\"\n                >\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.settings\"\n                        (click)=\"clickSettingsEvent.emit()\"\n                        size=\"s\"\n                        appearance=\"secondary\"\n                        class=\"mr-2 !self-center\"\n                    ></button>\n                    <div class=\"flex flex-wrap gap-x-2 text-xs font-thin text-tui-base-04\">\n                        <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n                        <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n                        <ng-container *ngIf=\"cartItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n                        </ng-template>\n                    </div>\n                </div>\n\n                <a\n                    tuiLink\n                    *ngIf=\"cartItem.specificationImgUrl\"\n                    (click)=\"showSpecification()\"\n                    >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                >\n                <ng-template\n                    #specificationPreview\n                    let-preview\n                >\n                    <tui-preview\n                        [rotatable]=\"false\"\n                        [zoomable]=\"false\"\n                    >\n                        <img\n                            *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n                            alt=\"preview\"\n                            [src]=\"cartItem.specificationImgUrl\"\n                        />\n                        <button\n                            iconStart=\"@tui.x\"\n                            title=\"Close\"\n                            tuiIconButton\n                            tuiPreviewAction\n                            type=\"button\"\n                            (click)=\"preview.complete()\"\n                        ></button>\n                    </tui-preview>\n                </ng-template>\n            </div>\n            <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n                <div class=\"flex gap-2\">\n                    <sc-input-quantity\n                        #inputQuantity\n                        *ngIf=\"quantityControl\"\n                        [formControl]=\"quantityControl\"\n                        [showCross]=\"false\"\n                        size=\"s\"\n                        [step]=\"unitsHelper.productMultiplicity(product)\"\n                        [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n                        (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n                        class=\"w-28\"\n                    ></sc-input-quantity>\n                    <button\n                        tuiIconButton\n                        iconStart=\"@tui.trash-2\"\n                        [style.border-radius.%]=\"100\"\n                        size=\"xs\"\n                        (click)=\"clickDeleteEvent.emit()\"\n                    ></button>\n                </div>\n                <p class=\"text-sm font-bold text-tui-text-01\">\u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber }} {{ 'RUB' | tuiCurrency }}</p>\n            </div>\n        </div>\n    </div>\n</ng-container>\n\n<ng-template #skeleton>\n    <div class=\"flex w-full gap-2\">\n        <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n        <div class=\"flex grow flex-col gap-2.5 bg-white\">\n            <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n        </div>\n    </div>\n</ng-template>\n" }]
+        }], ctorParameters: () => [{ type: i1.ScUnitsHelper }, { type: i2$1.TuiPreviewDialogService, decorators: [{
                     type: Inject,
                     args: [TuiPreviewDialogService]
                 }] }, { type: undefined, decorators: [{
@@ -4875,13 +4860,13 @@ class ScOrderItemMobileComponent {
     getCardImage() {
         return this.product?.getImage(this.urls.imgServerUrl) ?? this.urls.imgServerUrl + this.pathImageNotFound;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScOrderItemMobileComponent, deps: [{ token: ScUnitsHelper }, { token: TuiPreviewDialogService }, { token: SC_URLS }, { token: SC_PATH_IMAGE_NOT_FOUND }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScOrderItemMobileComponent, selector: "sc-order-item-mobile", inputs: { orderItem: "orderItem" }, outputs: { clickCardEvent: "clickCardEvent", clickActionsEvent: "clickActionsEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<div class=\"relative flex flex-wrap gap-x-4 gap-y-2 rounded-xl border border-tui-base-04 bg-white p-4 shadow-sc-2\">\n    <ng-container *ngIf=\"orderItem && product; else skeleton\">\n        <button\n            tuiIconButton\n            (click)=\"clickActionsEvent.emit()\"\n            size=\"m\"\n            iconStart=\"@tui.ellipsis-vertical\"\n            appearance=\"float\"\n            class=\"!absolute right-0 top-0 !hidden\"\n        ></button>\n        <div class=\"flex grow gap-2\">\n            <div class=\"flex size-20 shrink-0 items-center justify-center overflow-hidden\">\n                <img\n                    (click)=\"clickCardEvent.emit()\"\n                    [src]=\"getCardImage()\"\n                    [alt]=\"product.name\"\n                    [class.p-5]=\"!product.images?.length\"\n                    class=\"cursor-pointer\"\n                />\n            </div>\n\n            <div class=\"flex grow flex-wrap gap-x-8 self-center\">\n                <div class=\"flex grow basis-min-content flex-col\">\n                    <a\n                        tuiLink\n                        (click)=\"clickCardEvent.emit()\"\n                    >\n                        <span class=\"font-bold\">{{ product.name }}</span>\n                    </a>\n                    <div class=\"flex flex-col gap-y-0.5 text-xs text-tui-text-02\">\n                        <div class=\"flex flex-wrap gap-y-0.5\">\n                            <p class=\"w-40\">\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                            <p\n                                class=\"w-40\"\n                                *ngIf=\"product.pack\"\n                            >\n                                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                            </p>\n                        </div>\n                        <a\n                            tuiLink\n                            *ngIf=\"orderItem.specificationImgUrl\"\n                            (click)=\"showSpecification()\"\n                            >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                        >\n                        <ng-template\n                            #specificationPreview\n                            let-preview\n                        >\n                            <tui-preview\n                                [rotatable]=\"false\"\n                                [zoomable]=\"false\"\n                            >\n                                <img\n                                    *polymorpheusOutlet=\"orderItem.specificationImgUrl as src\"\n                                    alt=\"preview\"\n                                    [src]=\"orderItem.specificationImgUrl\"\n                                />\n                                <button\n                                    iconStart=\"@tui.x\"\n                                    title=\"Close\"\n                                    tuiIconButton\n                                    tuiPreviewAction\n                                    type=\"button\"\n                                    (click)=\"preview.complete()\"\n                                ></button>\n                            </tui-preview>\n                        </ng-template>\n                    </div>\n                </div>\n                <div class=\"flex flex-wrap content-center\">\n                    <div class=\"flex w-40 flex-col gap-x-8 gap-y-0.5\">\n                        <span\n                            *ngIf=\"product.discount\"\n                            class=\"flex items-center text-xs text-tui-text-02\"\n                        >\n                            <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                            <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                            <ng-template #discountHint>\n                                <div class=\"font-bold\">{{ product.discount.name }}</div>\n                                <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                            </ng-template>\n                        </span>\n                        <p class=\"flex flex-col items-baseline gap-x-2 font-bold\">\n                            <span>{{ product.costRubString }}</span>\n                            <span\n                                *ngIf=\"!product.priceInRub\"\n                                class=\"text-xs text-tui-text-02\"\n                                >{{ product.costString }}</span\n                            >\n                        </p>\n                        <sc-price-warehouse-stock\n                            [product]=\"product\"\n                            [fromMain]=\"false\"\n                        ></sc-price-warehouse-stock>\n                    </div>\n\n                    <div class=\"w-40 text-xs text-tui-text-02\">\n                        <ng-container *ngIf=\"orderItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ orderItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"orderItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ orderItem.length }} \u043C.</p>\n                        </ng-template>\n                        <p *ngIf=\"orderItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ orderItem.width }} \u043C.</p>\n                        <p class=\"text-sm text-tui-base-09\">\n                            \u0421\u0443\u043C\u043C\u0430: <span class=\"whitespace-nowrap font-bold\"> {{ orderItem.getCostRubStr() }} </span>\n                        </p>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-template #skeleton>\n        <div class=\"flex w-full gap-2\">\n            <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"flex grow flex-col gap-2.5 bg-white\">\n                <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n            </div>\n        </div>\n    </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i2$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i2$1.TuiPreviewAction, selector: "[tuiPreviewAction]" }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "directive", type: i2$2.PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScOrderItemMobileComponent, deps: [{ token: i1.ScUnitsHelper }, { token: TuiPreviewDialogService }, { token: SC_URLS }, { token: SC_PATH_IMAGE_NOT_FOUND }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScOrderItemMobileComponent, selector: "sc-order-item-mobile", inputs: { orderItem: "orderItem" }, outputs: { clickCardEvent: "clickCardEvent", clickActionsEvent: "clickActionsEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<div class=\"relative flex flex-wrap gap-x-4 gap-y-2 rounded-xl border border-tui-base-04 bg-white p-4 shadow-sc-2\">\n    <ng-container *ngIf=\"orderItem && product; else skeleton\">\n        <button\n            tuiIconButton\n            (click)=\"clickActionsEvent.emit()\"\n            size=\"m\"\n            iconStart=\"@tui.ellipsis-vertical\"\n            appearance=\"float\"\n            class=\"!absolute right-0 top-0 !hidden\"\n        ></button>\n        <div class=\"flex grow gap-2\">\n            <div class=\"flex size-20 shrink-0 items-center justify-center overflow-hidden\">\n                <img\n                    (click)=\"clickCardEvent.emit()\"\n                    [src]=\"getCardImage()\"\n                    [alt]=\"product.name\"\n                    [class.p-5]=\"!product.images?.length\"\n                    class=\"cursor-pointer\"\n                />\n            </div>\n\n            <div class=\"flex grow flex-wrap gap-x-8 self-center\">\n                <div class=\"flex grow basis-min-content flex-col\">\n                    <a\n                        tuiLink\n                        (click)=\"clickCardEvent.emit()\"\n                    >\n                        <span class=\"font-bold\">{{ product.name }}</span>\n                    </a>\n                    <div class=\"flex flex-col gap-y-0.5 text-tui-text-02\">\n                        <div class=\"flex flex-wrap\">\n                            <p class=\"w-40\">\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                            <p\n                                class=\"w-40\"\n                                *ngIf=\"product.pack\"\n                            >\n                                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                            </p>\n                        </div>\n                        <a\n                            tuiLink\n                            *ngIf=\"orderItem.specificationImgUrl\"\n                            (click)=\"showSpecification()\"\n                            >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                        >\n                        <ng-template\n                            #specificationPreview\n                            let-preview\n                        >\n                            <tui-preview\n                                [rotatable]=\"false\"\n                                [zoomable]=\"false\"\n                            >\n                                <img\n                                    *polymorpheusOutlet=\"orderItem.specificationImgUrl as src\"\n                                    alt=\"preview\"\n                                    [src]=\"orderItem.specificationImgUrl\"\n                                />\n                                <button\n                                    iconStart=\"@tui.x\"\n                                    title=\"Close\"\n                                    tuiIconButton\n                                    tuiPreviewAction\n                                    type=\"button\"\n                                    (click)=\"preview.complete()\"\n                                ></button>\n                            </tui-preview>\n                        </ng-template>\n                    </div>\n\n                    <div class=\"flex flex-wrap gap-y-0.5\">\n                        <span\n                            *ngIf=\"product.discount\"\n                            class=\"w-50 items-center gap-x-2 gap-y-0.5 text-xs text-tui-text-02\"\n                        >\n                            <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                            <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                            <ng-template #discountHint>\n                                <div class=\"font-bold\">{{ product.discount.name }}</div>\n                                <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                            </ng-template>\n                        </span>\n                        <p class=\"w-50 flex items-baseline gap-x-2 gap-y-0.5 font-bold\">\n                            <span>{{ product.costRubString }}</span>\n                            <span\n                                *ngIf=\"!product.priceInRub\"\n                                class=\"text-xs text-tui-text-02\"\n                                >{{ product.costString }}</span\n                            >\n                        </p>\n                    </div>\n                </div>\n                <div class=\"flex flex-wrap content-center\">\n                    <div class=\"w-50 flex flex-col gap-x-8 gap-y-0.5\">\n                        <ng-container *ngIf=\"orderItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ orderItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"orderItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ orderItem.length }} \u043C.</p>\n                        </ng-template>\n                        <p *ngIf=\"orderItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ orderItem.width }} \u043C.</p>\n                        <p class=\"flex flex-col items-baseline gap-x-2\">\n                            <span class=\"whitespace-nowrap text-body-m-bold\">\n                                \u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E: <span class=\"whitespace-nowrap\">{{ orderItem.quantity }}</span>\n                            </span>\n                        </p>\n                    </div>\n\n                    <div class=\"w-50 flex flex-col gap-y-0.5\">\n                        <p class=\"whitespace-nowrap text-body-m-bold\">\n                            \u0421\u0443\u043C\u043C\u0430: <span class=\"whitespace-nowrap\"> {{ orderItem.getCostRubStr() }} </span>\n                        </p>\n                        <sc-price-warehouse-stock\n                            [product]=\"product\"\n                            [fromMain]=\"false\"\n                        ></sc-price-warehouse-stock>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-template #skeleton>\n        <div class=\"flex w-full gap-2\">\n            <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"flex grow flex-col gap-2.5 bg-white\">\n                <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n            </div>\n        </div>\n    </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i2$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i2$1.TuiPreviewAction, selector: "[tuiPreviewAction]" }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "directive", type: i2$2.PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScOrderItemMobileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-order-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative flex flex-wrap gap-x-4 gap-y-2 rounded-xl border border-tui-base-04 bg-white p-4 shadow-sc-2\">\n    <ng-container *ngIf=\"orderItem && product; else skeleton\">\n        <button\n            tuiIconButton\n            (click)=\"clickActionsEvent.emit()\"\n            size=\"m\"\n            iconStart=\"@tui.ellipsis-vertical\"\n            appearance=\"float\"\n            class=\"!absolute right-0 top-0 !hidden\"\n        ></button>\n        <div class=\"flex grow gap-2\">\n            <div class=\"flex size-20 shrink-0 items-center justify-center overflow-hidden\">\n                <img\n                    (click)=\"clickCardEvent.emit()\"\n                    [src]=\"getCardImage()\"\n                    [alt]=\"product.name\"\n                    [class.p-5]=\"!product.images?.length\"\n                    class=\"cursor-pointer\"\n                />\n            </div>\n\n            <div class=\"flex grow flex-wrap gap-x-8 self-center\">\n                <div class=\"flex grow basis-min-content flex-col\">\n                    <a\n                        tuiLink\n                        (click)=\"clickCardEvent.emit()\"\n                    >\n                        <span class=\"font-bold\">{{ product.name }}</span>\n                    </a>\n                    <div class=\"flex flex-col gap-y-0.5 text-xs text-tui-text-02\">\n                        <div class=\"flex flex-wrap gap-y-0.5\">\n                            <p class=\"w-40\">\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                            <p\n                                class=\"w-40\"\n                                *ngIf=\"product.pack\"\n                            >\n                                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                            </p>\n                        </div>\n                        <a\n                            tuiLink\n                            *ngIf=\"orderItem.specificationImgUrl\"\n                            (click)=\"showSpecification()\"\n                            >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                        >\n                        <ng-template\n                            #specificationPreview\n                            let-preview\n                        >\n                            <tui-preview\n                                [rotatable]=\"false\"\n                                [zoomable]=\"false\"\n                            >\n                                <img\n                                    *polymorpheusOutlet=\"orderItem.specificationImgUrl as src\"\n                                    alt=\"preview\"\n                                    [src]=\"orderItem.specificationImgUrl\"\n                                />\n                                <button\n                                    iconStart=\"@tui.x\"\n                                    title=\"Close\"\n                                    tuiIconButton\n                                    tuiPreviewAction\n                                    type=\"button\"\n                                    (click)=\"preview.complete()\"\n                                ></button>\n                            </tui-preview>\n                        </ng-template>\n                    </div>\n                </div>\n                <div class=\"flex flex-wrap content-center\">\n                    <div class=\"flex w-40 flex-col gap-x-8 gap-y-0.5\">\n                        <span\n                            *ngIf=\"product.discount\"\n                            class=\"flex items-center text-xs text-tui-text-02\"\n                        >\n                            <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                            <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                            <ng-template #discountHint>\n                                <div class=\"font-bold\">{{ product.discount.name }}</div>\n                                <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                            </ng-template>\n                        </span>\n                        <p class=\"flex flex-col items-baseline gap-x-2 font-bold\">\n                            <span>{{ product.costRubString }}</span>\n                            <span\n                                *ngIf=\"!product.priceInRub\"\n                                class=\"text-xs text-tui-text-02\"\n                                >{{ product.costString }}</span\n                            >\n                        </p>\n                        <sc-price-warehouse-stock\n                            [product]=\"product\"\n                            [fromMain]=\"false\"\n                        ></sc-price-warehouse-stock>\n                    </div>\n\n                    <div class=\"w-40 text-xs text-tui-text-02\">\n                        <ng-container *ngIf=\"orderItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ orderItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"orderItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ orderItem.length }} \u043C.</p>\n                        </ng-template>\n                        <p *ngIf=\"orderItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ orderItem.width }} \u043C.</p>\n                        <p class=\"text-sm text-tui-base-09\">\n                            \u0421\u0443\u043C\u043C\u0430: <span class=\"whitespace-nowrap font-bold\"> {{ orderItem.getCostRubStr() }} </span>\n                        </p>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-template #skeleton>\n        <div class=\"flex w-full gap-2\">\n            <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"flex grow flex-col gap-2.5 bg-white\">\n                <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n            </div>\n        </div>\n    </ng-template>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: ScUnitsHelper }, { type: i2$1.TuiPreviewDialogService, decorators: [{
+            args: [{ selector: 'sc-order-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative flex flex-wrap gap-x-4 gap-y-2 rounded-xl border border-tui-base-04 bg-white p-4 shadow-sc-2\">\n    <ng-container *ngIf=\"orderItem && product; else skeleton\">\n        <button\n            tuiIconButton\n            (click)=\"clickActionsEvent.emit()\"\n            size=\"m\"\n            iconStart=\"@tui.ellipsis-vertical\"\n            appearance=\"float\"\n            class=\"!absolute right-0 top-0 !hidden\"\n        ></button>\n        <div class=\"flex grow gap-2\">\n            <div class=\"flex size-20 shrink-0 items-center justify-center overflow-hidden\">\n                <img\n                    (click)=\"clickCardEvent.emit()\"\n                    [src]=\"getCardImage()\"\n                    [alt]=\"product.name\"\n                    [class.p-5]=\"!product.images?.length\"\n                    class=\"cursor-pointer\"\n                />\n            </div>\n\n            <div class=\"flex grow flex-wrap gap-x-8 self-center\">\n                <div class=\"flex grow basis-min-content flex-col\">\n                    <a\n                        tuiLink\n                        (click)=\"clickCardEvent.emit()\"\n                    >\n                        <span class=\"font-bold\">{{ product.name }}</span>\n                    </a>\n                    <div class=\"flex flex-col gap-y-0.5 text-tui-text-02\">\n                        <div class=\"flex flex-wrap\">\n                            <p class=\"w-40\">\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n                            <p\n                                class=\"w-40\"\n                                *ngIf=\"product.pack\"\n                            >\n                                \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n                            </p>\n                        </div>\n                        <a\n                            tuiLink\n                            *ngIf=\"orderItem.specificationImgUrl\"\n                            (click)=\"showSpecification()\"\n                            >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n                        >\n                        <ng-template\n                            #specificationPreview\n                            let-preview\n                        >\n                            <tui-preview\n                                [rotatable]=\"false\"\n                                [zoomable]=\"false\"\n                            >\n                                <img\n                                    *polymorpheusOutlet=\"orderItem.specificationImgUrl as src\"\n                                    alt=\"preview\"\n                                    [src]=\"orderItem.specificationImgUrl\"\n                                />\n                                <button\n                                    iconStart=\"@tui.x\"\n                                    title=\"Close\"\n                                    tuiIconButton\n                                    tuiPreviewAction\n                                    type=\"button\"\n                                    (click)=\"preview.complete()\"\n                                ></button>\n                            </tui-preview>\n                        </ng-template>\n                    </div>\n\n                    <div class=\"flex flex-wrap gap-y-0.5\">\n                        <span\n                            *ngIf=\"product.discount\"\n                            class=\"w-50 items-center gap-x-2 gap-y-0.5 text-xs text-tui-text-02\"\n                        >\n                            <span class=\"line-through\">{{ product.discountCostString }}</span> &nbsp;\n                            <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n                            <ng-template #discountHint>\n                                <div class=\"font-bold\">{{ product.discount.name }}</div>\n                                <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n                            </ng-template>\n                        </span>\n                        <p class=\"w-50 flex items-baseline gap-x-2 gap-y-0.5 font-bold\">\n                            <span>{{ product.costRubString }}</span>\n                            <span\n                                *ngIf=\"!product.priceInRub\"\n                                class=\"text-xs text-tui-text-02\"\n                                >{{ product.costString }}</span\n                            >\n                        </p>\n                    </div>\n                </div>\n                <div class=\"flex flex-wrap content-center\">\n                    <div class=\"w-50 flex flex-col gap-x-8 gap-y-0.5\">\n                        <ng-container *ngIf=\"orderItem.height; else length\">\n                            <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ orderItem.height }} \u043C.</p>\n                        </ng-container>\n                        <ng-template #length>\n                            <p *ngIf=\"orderItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ orderItem.length }} \u043C.</p>\n                        </ng-template>\n                        <p *ngIf=\"orderItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ orderItem.width }} \u043C.</p>\n                        <p class=\"flex flex-col items-baseline gap-x-2\">\n                            <span class=\"whitespace-nowrap text-body-m-bold\">\n                                \u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E: <span class=\"whitespace-nowrap\">{{ orderItem.quantity }}</span>\n                            </span>\n                        </p>\n                    </div>\n\n                    <div class=\"w-50 flex flex-col gap-y-0.5\">\n                        <p class=\"whitespace-nowrap text-body-m-bold\">\n                            \u0421\u0443\u043C\u043C\u0430: <span class=\"whitespace-nowrap\"> {{ orderItem.getCostRubStr() }} </span>\n                        </p>\n                        <sc-price-warehouse-stock\n                            [product]=\"product\"\n                            [fromMain]=\"false\"\n                        ></sc-price-warehouse-stock>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-template #skeleton>\n        <div class=\"flex w-full gap-2\">\n            <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n            <div class=\"flex grow flex-col gap-2.5 bg-white\">\n                <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n                <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n            </div>\n        </div>\n    </ng-template>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1.ScUnitsHelper }, { type: i2$1.TuiPreviewDialogService, decorators: [{
                     type: Inject,
                     args: [TuiPreviewDialogService]
                 }] }, { type: undefined, decorators: [{
@@ -4948,12 +4933,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
                 }]
         }] });
 
-/* eslint-disable @typescript-eslint/unbound-method */
 /**
  * Компонент формы запроса бесплатного образца.
  */
 class ScAskToSampleFormComponent {
     constructor() {
+        /**
+         * Сервис работы с образцами.
+         */
+        this.samplesService = inject(ScSamplesService);
+        /**
+         * Сервис информации о пользователе.
+         */
+        this.user$ = inject(ScUserService)
+            .getUserChange$()
+            .pipe(tap((user) => {
+            if (user.isGuest) {
+                this.form.controls.email.reset();
+                this.form.controls.name.reset();
+                this.form.controls.phone.reset();
+            }
+            else {
+                this.form.patchValue({
+                    name: user.name,
+                    phone: user.contacts.phone.value,
+                    email: user.contacts.email.value,
+                });
+            }
+        }));
+        this.context = inject(POLYMORPHEUS_CONTEXT, {
+            optional: true,
+        });
         /**
          * Группа полей ввода для формы «Пожелания и предложения по улучшению сайта».
          */
@@ -4961,19 +4971,77 @@ class ScAskToSampleFormComponent {
             name: new FormControl(null, [Validators.required, Validators.minLength(3)]),
             phone: new FormControl(null, [Validators.required, Validators.minLength(12)]),
             email: new FormControl(null, [Validators.required, Validators.email]),
+            description: new FormControl('Неизвестная форма', [Validators.required, Validators.minLength(3)]),
         });
         /**
          * Перечисление типов подсказок.
          */
         this.suggestionType = ScISuggestionType;
+        /**
+         * {@link Subject} события отправки формы.
+         */
+        this.onSubmit = new Subject();
+        /**
+         * {@link Observable} запроса на отправку данных.
+         */
+        this.request$ = this.onSubmit.pipe(filter(() => this.form.valid), map(() => this.form.value), switchMap((value) => this.samplesService.getSamples(value).pipe(tap(() => {
+            if (this.context) {
+                this.context.completeWith();
+            }
+            else {
+                this.form.controls.email.reset();
+                this.form.controls.name.reset();
+                this.form.controls.phone.reset();
+            }
+        }), 
+        // eslint-disable-next-line rxjs/no-implicit-any-catch
+        catchError((error) => {
+            this.form.markAllAsTouched();
+            const { errors, message } = error.error;
+            if (errors) {
+                Object.keys(errors).forEach((key) => {
+                    const control = this.form.get(key);
+                    if (control) {
+                        // eslint-disable-next-line security/detect-object-injection
+                        control.setErrors({ serverResponse: errors[key] });
+                    }
+                });
+            }
+            else if (message) {
+                this.form.setErrors({ serverResponse: [message] });
+            }
+            return of(null);
+        }), 
+        // eslint-disable-next-line unicorn/no-useless-undefined
+        startWith(undefined))), share());
+        /**
+         * {@link Observable} изменения состояния загрузки данных.
+         */
+        this.loading$ = this.request$.pipe(map((value) => value === undefined));
+    }
+    /** @inheritdoc */
+    ngOnInit() {
+        switch (this.formName ?? this.context?.data.formName) {
+            case 'order-sample':
+                this.form.controls.description.patchValue('Форма "Получите бесплатный образец"');
+                break;
+            case 'buy-products':
+                this.form.controls.description.patchValue('Форма "Оставить заявку на покупку"');
+                break;
+            default:
+                this.form.controls.description.patchValue('Неизвестная форма');
+                break;
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScAskToSampleFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScAskToSampleFormComponent, selector: "sc-ask-to-sample-form", ngImport: i0, template: "<form\n    [formGroup]=\"form\"\n    class=\"flex flex-col justify-between gap-4\"\n>\n    <label tuiLabel\n        >\u0424\u0418\u041E\n        <tui-input formControlName=\"name\"> \u0418\u0432\u0430\u043D\u043E\u0432 \u0418\u0432\u0430\u043D \u0418\u0432\u0430\u043D\u043E\u0432\u0438\u0447 </tui-input>\n        <tui-error\n            formControlName=\"name\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label tuiLabel\n        >\u0422\u0435\u043B\u0435\u0444\u043E\u043D\n        <tui-input-phone formControlName=\"phone\"> \u0422\u0435\u043B\u0435\u0444\u043E\u043D </tui-input-phone>\n        <tui-error\n            formControlName=\"phone\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label\n        tuiLabel\n        class=\"w-full\"\n        >\u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n        <tui-input formControlName=\"email\">\n            \u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n            <sc-suggestion-field\n                *tuiDataList\n                [type]=\"suggestionType.email\"\n            ></sc-suggestion-field>\n        </tui-input>\n        <tui-error\n            formControlName=\"email\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <button\n        tuiButton\n        [disabled]=\"form.invalid\"\n        type=\"submit\"\n        iconStart=\"@tui.sc.send\"\n        class=\"self-center\"\n    >\n        \u041E\u0441\u0442\u0430\u0432\u0438\u0442\u044C\n    </button>\n</form>\n", dependencies: [{ kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1$1.TuiError, selector: "tui-error", inputs: ["error"] }, { kind: "component", type: ScSuggestionFieldComponent, selector: "sc-suggestion-field", inputs: ["type"], outputs: ["selectedClick"] }, { kind: "component", type: i5.TuiInputComponent, selector: "tui-input" }, { kind: "directive", type: i5.TuiInputDirective, selector: "tui-input" }, { kind: "component", type: i5.TuiInputPhoneComponent, selector: "tui-input-phone", inputs: ["phoneMaskAfterCountryCode", "allowText", "search", "countryCode"], outputs: ["searchChange"] }, { kind: "directive", type: i5.TuiInputPhoneDirective, selector: "tui-input-phone" }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: i1$1.TuiLabel, selector: "label[tuiLabel]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.TuiFieldErrorPipe, name: "tuiFieldError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.3", type: ScAskToSampleFormComponent, selector: "sc-ask-to-sample-form", inputs: { formName: "formName" }, ngImport: i0, template: "<form\n    *tuiLet=\"user$ | async\"\n    [formGroup]=\"form\"\n    (ngSubmit)=\"onSubmit.next()\"\n    class=\"flex flex-col justify-between gap-4\"\n>\n    <label tuiLabel\n        >\u0424\u0418\u041E\n        <tui-input formControlName=\"name\"> \u0418\u0432\u0430\u043D\u043E\u0432 \u0418\u0432\u0430\u043D \u0418\u0432\u0430\u043D\u043E\u0432\u0438\u0447 </tui-input>\n        <tui-error\n            formControlName=\"name\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label tuiLabel\n        >\u0422\u0435\u043B\u0435\u0444\u043E\u043D\n        <tui-input-phone formControlName=\"phone\"> \u0422\u0435\u043B\u0435\u0444\u043E\u043D </tui-input-phone>\n        <tui-error\n            formControlName=\"phone\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label\n        tuiLabel\n        class=\"w-full\"\n        >\u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n        <tui-input formControlName=\"email\">\n            \u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n            <sc-suggestion-field\n                *tuiDataList\n                [type]=\"suggestionType.email\"\n            ></sc-suggestion-field>\n        </tui-input>\n        <tui-error\n            formControlName=\"email\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <button\n        tuiButton\n        [disabled]=\"form.invalid\"\n        [loading]=\"!!(loading$ | async)\"\n        type=\"submit\"\n        iconStart=\"@tui.sc.send\"\n        class=\"self-center\"\n    >\n        \u041E\u0441\u0442\u0430\u0432\u0438\u0442\u044C\n    </button>\n</form>\n", dependencies: [{ kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1$1.TuiError, selector: "tui-error", inputs: ["error"] }, { kind: "component", type: ScSuggestionFieldComponent, selector: "sc-suggestion-field", inputs: ["type"], outputs: ["selectedClick"] }, { kind: "component", type: i5.TuiInputComponent, selector: "tui-input" }, { kind: "directive", type: i5.TuiInputDirective, selector: "tui-input" }, { kind: "component", type: i5.TuiInputPhoneComponent, selector: "tui-input-phone", inputs: ["phoneMaskAfterCountryCode", "allowText", "search", "countryCode"], outputs: ["searchChange"] }, { kind: "directive", type: i5.TuiInputPhoneDirective, selector: "tui-input-phone" }, { kind: "directive", type: i7.TuiLet, selector: "[tuiLet]", inputs: ["tuiLet"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }, { kind: "directive", type: i1$1.TuiLabel, selector: "label[tuiLabel]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.TuiFieldErrorPipe, name: "tuiFieldError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScAskToSampleFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-ask-to-sample-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<form\n    [formGroup]=\"form\"\n    class=\"flex flex-col justify-between gap-4\"\n>\n    <label tuiLabel\n        >\u0424\u0418\u041E\n        <tui-input formControlName=\"name\"> \u0418\u0432\u0430\u043D\u043E\u0432 \u0418\u0432\u0430\u043D \u0418\u0432\u0430\u043D\u043E\u0432\u0438\u0447 </tui-input>\n        <tui-error\n            formControlName=\"name\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label tuiLabel\n        >\u0422\u0435\u043B\u0435\u0444\u043E\u043D\n        <tui-input-phone formControlName=\"phone\"> \u0422\u0435\u043B\u0435\u0444\u043E\u043D </tui-input-phone>\n        <tui-error\n            formControlName=\"phone\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label\n        tuiLabel\n        class=\"w-full\"\n        >\u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n        <tui-input formControlName=\"email\">\n            \u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n            <sc-suggestion-field\n                *tuiDataList\n                [type]=\"suggestionType.email\"\n            ></sc-suggestion-field>\n        </tui-input>\n        <tui-error\n            formControlName=\"email\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <button\n        tuiButton\n        [disabled]=\"form.invalid\"\n        type=\"submit\"\n        iconStart=\"@tui.sc.send\"\n        class=\"self-center\"\n    >\n        \u041E\u0441\u0442\u0430\u0432\u0438\u0442\u044C\n    </button>\n</form>\n" }]
-        }] });
+            args: [{ selector: 'sc-ask-to-sample-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<form\n    *tuiLet=\"user$ | async\"\n    [formGroup]=\"form\"\n    (ngSubmit)=\"onSubmit.next()\"\n    class=\"flex flex-col justify-between gap-4\"\n>\n    <label tuiLabel\n        >\u0424\u0418\u041E\n        <tui-input formControlName=\"name\"> \u0418\u0432\u0430\u043D\u043E\u0432 \u0418\u0432\u0430\u043D \u0418\u0432\u0430\u043D\u043E\u0432\u0438\u0447 </tui-input>\n        <tui-error\n            formControlName=\"name\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label tuiLabel\n        >\u0422\u0435\u043B\u0435\u0444\u043E\u043D\n        <tui-input-phone formControlName=\"phone\"> \u0422\u0435\u043B\u0435\u0444\u043E\u043D </tui-input-phone>\n        <tui-error\n            formControlName=\"phone\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <label\n        tuiLabel\n        class=\"w-full\"\n        >\u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n        <tui-input formControlName=\"email\">\n            \u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n            <sc-suggestion-field\n                *tuiDataList\n                [type]=\"suggestionType.email\"\n            ></sc-suggestion-field>\n        </tui-input>\n        <tui-error\n            formControlName=\"email\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <button\n        tuiButton\n        [disabled]=\"form.invalid\"\n        [loading]=\"!!(loading$ | async)\"\n        type=\"submit\"\n        iconStart=\"@tui.sc.send\"\n        class=\"self-center\"\n    >\n        \u041E\u0441\u0442\u0430\u0432\u0438\u0442\u044C\n    </button>\n</form>\n" }]
+        }], propDecorators: { formName: [{
+                type: Input
+            }] } });
 
 /**
  * Компонент представления образцов товара.
@@ -5064,13 +5132,15 @@ class ScPreviewSampleModule {
             TuiHovered,
             TuiLet,
             TuiButton,
+            TuiButtonLoading,
             TuiLabel], exports: [ScPreviewSampleComponent, ScAskToSampleFormComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScPreviewSampleModule, imports: [CommonModule,
             ReactiveFormsModule,
             TuiError,
             ScFormFieldsModule,
             TuiInputModule,
-            TuiInputPhoneModule, i2$1.TuiCarouselComponent, TuiAvatar] }); }
+            TuiInputPhoneModule, i2$1.TuiCarouselComponent, TuiAvatar,
+            TuiButtonLoading] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScPreviewSampleModule, decorators: [{
             type: NgModule,
@@ -5089,6 +5159,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
                         TuiHovered,
                         TuiLet,
                         TuiButton,
+                        TuiButtonLoading,
                         TuiLabel,
                     ],
                     exports: [ScPreviewSampleComponent, ScAskToSampleFormComponent],
@@ -5259,7 +5330,7 @@ class ScUpdateUserInfoDialogComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScUpdateUserInfoDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sc-update-user-info-dialog', providers: [SC_USER_PROVIDERS], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form\n    [formGroup]=\"form\"\n    *ngIf=\"user$ | async as user\"\n    (ngSubmit)=\"onSubmit.next()\"\n    class=\"flex flex-col gap-4\"\n>\n    <label tuiLabel\n        >{{ user.isOrg ? '\u041D\u0430\u0437\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438 \u0438\u043B\u0438 \u0418\u041F' : '\u0424.\u0418.\u041E.' }}\n        <tui-input formControlName=\"name\">\n            {{ user.isOrg ? '\u041D\u0430\u0437\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438 \u0438\u043B\u0438 \u0418\u041F' : '\u0424.\u0418.\u041E.' }}\n            <ng-container *ngIf=\"user.isOrg\">\n                <sc-suggestion-field\n                    *tuiDataList\n                    [type]=\"suggestionType.organization\"\n                ></sc-suggestion-field>\n            </ng-container>\n        </tui-input>\n        <tui-error\n            formControlName=\"name\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <sc-verification-phone-check-form\n        *tuiLet=\"user.contacts.phone.value === form.value.phone as phoneIsChange\"\n        [showCodeFields]=\"!phoneIsChange\"\n        [shouldBeBusy]=\"phoneIsChange\"\n        class=\"w-full\"\n    ></sc-verification-phone-check-form>\n    <label\n        tuiLabel\n        class=\"w-full\"\n        >\u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n        <tui-input formControlName=\"email\">\n            \u0410\u0434\u0440\u0435\u0441 \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u044B\n            <sc-suggestion-field\n                *tuiDataList\n                [type]=\"suggestionType.email\"\n            ></sc-suggestion-field>\n        </tui-input>\n        <tui-error\n            formControlName=\"email\"\n            [error]=\"[] | tuiFieldError | async\"\n        ></tui-error>\n    </label>\n    <sc-addresses-selection-field></sc-addresses-selection-field>\n    <label tuiLabel>\n        <input\n            tuiCheckbox\n            type=\"checkbox\"\n            formControlName=\"getNews\"\n            class=\"w-full\"\n        />\n        \u042F \u0445\u043E\u0447\u0443 \u043F\u043E\u043B\u0443\u0447\u0430\u0442\u044C \u0440\u0430\u0441\u0441\u044B\u043B\u043A\u0443 \u0421\u043D\u0430\u0431\u0446\u0435\u043D\u0442\u0440 \u043E \u0441\u043A\u0438\u0434\u043A\u0430\u0445 \u0438 \u043D\u043E\u0432\u043E\u0441\u0442\u044F\u0445 \u043F\u043E \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u0435.\n    </label>\n    <div class=\"flex justify-center gap-4\">\n        <button\n            tuiButton\n            (click)=\"context ? context.$implicit.complete() : cancelButtonClick.emit()\"\n            type=\"button\"\n            iconStart=\"@tui.x\"\n            appearance=\"secondary\"\n        >\n            \u041E\u0442\u043C\u0435\u043D\u0430\n        </button>\n        <button\n            tuiButton\n            [disabled]=\"form.invalid\"\n            [loading]=\"!!(loading$ | async)\"\n            type=\"submit\"\n            iconStart=\"@tui.save\"\n        >\n            \u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C\n        </button>\n    </div>\n</form>\n" }]
-        }], ctorParameters: () => [{ type: i5$1.Observable, decorators: [{
+        }], ctorParameters: () => [{ type: i6.Observable, decorators: [{
                     type: Inject,
                     args: [SC_USER_INFO]
                 }] }, { type: i1.ScUserService }, { type: i1.ScUserMetrikaService }, { type: undefined, decorators: [{
@@ -5288,7 +5359,7 @@ class ScUserManagersComponent {
          * Персональные менеджеры пользователя.
          */
         this.managers$ = this.userService
-            .getUserInfo$()
+            .getUserChange$()
             .pipe(map((user) => user.managers?.sort((a, b) => Number(Boolean(b.isPrimary)) - Number(Boolean(a.isPrimary)))));
         /**
          * Событие нажатия на кнопку QR кода.
@@ -5379,7 +5450,7 @@ class ScUserPhoneApproveDialogComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScUserPhoneApproveDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sc-user-phone-approve-dialog', providers: [SC_USER_PROVIDERS], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"user$ | async as user\">\n    <form\n        [formGroup]=\"form\"\n        *tuiLet=\"!!(loading$ | async) as loadingApproveCode\"\n        (ngSubmit)=\"onSubmit.next()\"\n        class=\"flex flex-col gap-3\"\n    >\n        <sc-verification-phone-check-form\n            [(haveCode)]=\"haveCode\"\n            [shouldBeConfirmed]=\"false\"\n            [showCodeFields]=\"!user.contacts.phone.isApproved\"\n            [readOnly]=\"true\"\n            class=\"w-full\"\n        ></sc-verification-phone-check-form>\n        <div\n            *ngIf=\"user.contacts.phone.isApproved || haveCode\"\n            class=\"flex justify-center gap-4\"\n        >\n            <button\n                *ngIf=\"user.contacts.phone.isApproved && context\"\n                tuiButton\n                (click)=\"context.$implicit.complete()\"\n                type=\"button\"\n                appearance=\"secondary\"\n            >\n                \u0417\u0430\u043A\u0440\u044B\u0442\u044C\n            </button>\n            <button\n                *ngIf=\"haveCode\"\n                tuiButton\n                type=\"submit\"\n                [loading]=\"loadingApproveCode\"\n                [disabled]=\"form.invalid || loadingApproveCode\"\n                iconStart=\"@tui.sc.send\"\n            >\n                \u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C\n            </button>\n        </div>\n    </form>\n</ng-container>\n" }]
-        }], ctorParameters: () => [{ type: i1.ScVerificationService }, { type: i1.ScUserMetrikaService }, { type: i5$1.Observable, decorators: [{
+        }], ctorParameters: () => [{ type: i1.ScVerificationService }, { type: i1.ScUserMetrikaService }, { type: i6.Observable, decorators: [{
                     type: Inject,
                     args: [SC_USER_INFO]
                 }] }, { type: i1.ScUserService }, { type: undefined, decorators: [{
@@ -5586,7 +5657,7 @@ __decorate([
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ScProfileAccordionsContentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sc-profile-accordions-content', providers: [SC_USER_PROVIDERS], animations: [tuiFadeIn], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    *tuiLet=\"user$ | async as user\"\n    class=\"flex flex-col gap-4\"\n>\n    <sc-accordion\n        [showArrow]=\"false\"\n        [showAddButton]=\"false\"\n        [open]=\"true\"\n    >\n        \u041E\u0431\u0449\u0438\u0435 \u0434\u0430\u043D\u043D\u044B\u0435\n        <ng-template scAccordionContent>\n            <tui-loader\n                [overlay]=\"true\"\n                [showLoader]=\"user === null\"\n            >\n                <div class=\"flex gap-2 pl-4\">\n                    <div\n                        *ngIf=\"user\"\n                        class=\"flex grow flex-col gap-2\"\n                    >\n                        <span class=\"font-medium\">{{ user.name }}</span>\n                        <div\n                            *ngIf=\"user.city && (getUserCity$(user.city) | async) as city\"\n                            class=\"flex items-center gap-1\"\n                        >\n                            <tui-icon icon=\"@tui.map-pin\"></tui-icon>\n                            <div class=\"flex flex-wrap\">\n                                <span>\u0433. {{ city.name }}, </span>\n                                <span *ngIf=\"city.region\">{{ city.region.name }}</span>\n                            </div>\n                        </div>\n                        <div class=\"flex flex-wrap gap-2\">\n                            <a\n                                tuiLink\n                                [scTelLink]=\"user.contacts.phone.value\"\n                                iconStart=\"@tui.phone\"\n                                [pseudo]=\"true\"\n                                href=\"tel:{{ user.contacts.phone.value | scFormatePhone }}\"\n                                >{{ user.contacts.phone.value | scFormatePhone }}</a\n                            >\n                            <span\n                                *ngIf=\"!user.contacts.phone.isApproved\"\n                                class=\"text-tui-text-03\"\n                            >\n                                (\u0422\u0435\u043B\u0435\u0444\u043E\u043D \u043D\u0435 \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043D.\n                                <button\n                                    tuiLink\n                                    [pseudo]=\"true\"\n                                    (click)=\"approvePhoneClick.emit()\"\n                                >\n                                    \u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C</button\n                                >)\n                            </span>\n                        </div>\n                        <div\n                            *tuiLet=\"!!(isSendApproveEmail$ | async) as isSendApproveEmail\"\n                            class=\"flex flex-wrap gap-x-2\"\n                        >\n                            <a\n                                tuiLink\n                                iconStart=\"@tui.mail\"\n                                [pseudo]=\"true\"\n                                href=\"mailto:{{ user.contacts.email.value }}\"\n                            >\n                                {{ user.contacts.email.value }}\n                            </a>\n                            <span\n                                *ngIf=\"!isSendApproveEmail && !user.contacts.email.isApproved\"\n                                class=\"inline-flex flex-wrap gap-1 text-tui-text-03\"\n                            >\n                                E-mail \u043D\u0435 \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043D.\n                                <tui-loader\n                                    [showLoader]=\"!!(approveEmailLoading$ | async)\"\n                                    [overlay]=\"true\"\n                                >\n                                    <button\n                                        tuiLink\n                                        [pseudo]=\"true\"\n                                        (click)=\"onSendApproveEmail.next(user.contacts.email.value)\"\n                                    >\n                                        \u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C\n                                    </button>\n                                </tui-loader>\n                            </span>\n                            <span\n                                *ngIf=\"isSendApproveEmail\"\n                                class=\"text-tui-success-fill\"\n                                @tuiFadeIn\n                            >\n                                \u041F\u0438\u0441\u044C\u043C\u043E \u0434\u043B\u044F \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043D\u0438\u044F \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u043E. \u041F\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043F\u043E \u0441\u0441\u044B\u043B\u043A\u0435 \u0432 \u043F\u0438\u0441\u044C\u043C\u0435 \u0438 \u043E\u0431\u043D\u043E\u0432\u0438\u0442\u0435 \u044D\u0442\u0443 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443.\n                            </span>\n                        </div>\n                        <tui-loader\n                            [showLoader]=\"!!(getNewsLoading$ | async)\"\n                            [overlay]=\"true\"\n                        >\n                            <label tuiLabel>\n                                <input\n                                    tuiCheckbox\n                                    type=\"checkbox\"\n                                    size=\"s\"\n                                    class=\"w-full\"\n                                    [formControl]=\"getNewsControl\"\n                                    [ngModel]=\"user.getNews\"\n                                />\n                                \u042F \u0445\u043E\u0447\u0443 \u043F\u043E\u043B\u0443\u0447\u0430\u0442\u044C \u0440\u0430\u0441\u0441\u044B\u043B\u043A\u0443 \u0421\u043D\u0430\u0431\u0446\u0435\u043D\u0442\u0440 \u043E \u0441\u043A\u0438\u0434\u043A\u0430\u0445 \u0438 \u043D\u043E\u0432\u043E\u0441\u0442\u044F\u0445 \u043F\u043E \u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u043E\u0439 \u043F\u043E\u0447\u0442\u0435.\n                            </label>\n                        </tui-loader>\n                    </div>\n\n                    <button\n                        tuiIconButton\n                        size=\"m\"\n                        type=\"button\"\n                        iconStart=\"@tui.pencil\"\n                        appearance=\"flat\"\n                        (click)=\"editProfileClick.emit()\"\n                    ></button>\n                </div>\n            </tui-loader>\n        </ng-template>\n    </sc-accordion>\n    <sc-contragents-accordion\n        (addContragentClick)=\"addContragentClick.emit()\"\n        (deleteContragentClick)=\"deleteContragentClick.emit($event)\"\n        (addContragentBankAccountClick)=\"addContragentBankAccountClick.emit($event)\"\n        (deleteContragentBankAccountClick)=\"deleteContragentBankAccountClick.emit($event)\"\n        (addContragentContactClick)=\"addContragentContactClick.emit($event)\"\n        (deleteContragentContactClick)=\"deleteContragentContactClick.emit($event)\"\n    ></sc-contragents-accordion>\n    <sc-delivery-address-accordion\n        (addDeliveryAddressClick)=\"addDeliveryAddressClick.emit()\"\n        (deleteDeliveryAddressClick)=\"deleteDeliveryAddressClick.emit($event)\"\n        (addDeliveryAddressContactClick)=\"addDeliveryAddressContactClick.emit($event)\"\n        (deleteDeliveryAddressContactClick)=\"deleteDeliveryAddressContactClick.emit($event)\"\n    ></sc-delivery-address-accordion>\n    <sc-contacts-accordion\n        *ngIf=\"user\"\n        [contacts$]=\"userContacts$\"\n        (addContactClick)=\"addUserContactClick.emit(user.id)\"\n        (deleteButtonClick)=\"deleteUserContactClick.emit($event)\"\n    ></sc-contacts-accordion>\n    <sc-accordion\n        #passwordAccordion\n        [showArrow]=\"false\"\n        [showAddButton]=\"false\"\n    >\n        \u0418\u0437\u043C\u0435\u043D\u0438\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\n        <ng-template scAccordionContent>\n            <sc-reset-user-password (successResetPassword)=\"passwordAccordion.close()\"></sc-reset-user-password>\n        </ng-template>\n    </sc-accordion>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i5$1.Observable, decorators: [{
+        }], ctorParameters: () => [{ type: i6.Observable, decorators: [{
                     type: Inject,
                     args: [SC_USER_INFO]
                 }] }, { type: i1.ScLocationsService }, { type: i1.ScUserService }, { type: i1.ScVerificationService }], propDecorators: { editProfileClick: [{
@@ -5689,5 +5760,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractScPriceCard, AuthMethod, FilesAndDocumentsComponent, FilesAndDocumentsModule, SC_LINEAR_VALUES, SC_LINEAR_VALUES_TOKEN, SC_USER_INFO, SC_USER_PROVIDERS, ScAccordionComponent, ScAccordionContentDirective, ScAccordionModule, ScAddContactDialogComponent, ScAddContragentBankAccountsDialogComponent, ScAddContragentDialogComponent, ScAddDeliveryAddressDialogComponent, ScAddressesSelectionFieldComponent, ScAskToSampleFormComponent, ScAuthModule, ScBannerComponent, ScBannerModule, ScBrandsListComponent, ScBrandsListModule, ScCartItemMobileComponent, ScCartModule, ScCatalogModule, ScCategoriesListComponent, ScCategoryCardComponent, ScContactsAccordionComponent, ScContactsModule, ScContragentsAccordionComponent, ScContragentsAccordionItemComponent, ScContragentsModule, ScDeliveryAddressAccordionComponent, ScDeliveryAddressAccordionItemComponent, ScDeliveryAddressModule, ScFavoriteBtnComponent, ScFormFieldsModule, ScFormatePhonePipe, ScInputQuantityComponent, ScNewContactFormComponent, ScNewContragentBankAccountsFormComponent, ScNewContragentFormComponent, ScNewsCardComponent, ScNewsCardSkeletonComponent, ScNewsModule, ScNextInputFocusDirective, ScNextInputFocusModule, ScOrderItemMobileComponent, ScOrderModule, ScPaymentStatusComponent, ScPreviewSampleComponent, ScPreviewSampleModule, ScPriceCardComponent, ScPriceHistoryComponent, ScPriceListPaginationComponent, ScPriceWarehouseStockComponent, ScProfileAccordionsContentComponent, ScProfileModule, ScQRCodeDialogComponent, ScQRCodeModule, ScResetUserPasswordComponent, ScShareButtonComponent, ScShareButtonModule, ScSignInFormByEmailComponent, ScSignInFormByPhoneComponent, ScSignInFormComponent, ScSignUpFormComponent, ScSuggestionFieldComponent, ScTelLinkDirective, ScTelLinkModule, ScTerminalLinkDirective, ScUpdateUserInfoDialogComponent, ScUserManagersComponent, ScUserModule, ScUserPhoneApproveDialogComponent, ScVerificationModule, ScVerificationPhoneCheckFormComponent, TreeDirective, TreeIconService, TreeLoaderService, TreeTopDirective, scBicValidator, scClientUiIconsName, scCorrespondentAccountValidator, scPasswordConfirmMatchingValidator, scUserFactory, stepValidator };
+export { AbstractScPriceCard, AuthMethod, FilesAndDocumentsComponent, FilesAndDocumentsModule, SC_USER_INFO, SC_USER_PROVIDERS, ScAccordionComponent, ScAccordionContentDirective, ScAccordionModule, ScAddContactDialogComponent, ScAddContragentBankAccountsDialogComponent, ScAddContragentDialogComponent, ScAddDeliveryAddressDialogComponent, ScAddressesSelectionFieldComponent, ScAskToSampleFormComponent, ScAuthModule, ScBannerComponent, ScBannerModule, ScBrandsListComponent, ScBrandsListModule, ScCartItemMobileComponent, ScCartModule, ScCatalogModule, ScCategoriesListComponent, ScCategoryCardComponent, ScContactsAccordionComponent, ScContactsModule, ScContragentsAccordionComponent, ScContragentsAccordionItemComponent, ScContragentsModule, ScDeliveryAddressAccordionComponent, ScDeliveryAddressAccordionItemComponent, ScDeliveryAddressModule, ScFavoriteBtnComponent, ScFormFieldsModule, ScFormatePhonePipe, ScInputQuantityComponent, ScNewContactFormComponent, ScNewContragentBankAccountsFormComponent, ScNewContragentFormComponent, ScNewsCardComponent, ScNewsCardSkeletonComponent, ScNewsModule, ScNextInputFocusDirective, ScNextInputFocusModule, ScOrderItemMobileComponent, ScOrderModule, ScPaymentStatusComponent, ScPreviewSampleComponent, ScPreviewSampleModule, ScPriceCardComponent, ScPriceHistoryComponent, ScPriceListPaginationComponent, ScPriceWarehouseStockComponent, ScProfileAccordionsContentComponent, ScProfileModule, ScQRCodeDialogComponent, ScQRCodeModule, ScResetUserPasswordComponent, ScShareButtonComponent, ScShareButtonModule, ScSignInFormByEmailComponent, ScSignInFormByPhoneComponent, ScSignInFormComponent, ScSignUpFormComponent, ScSuggestionFieldComponent, ScTelLinkDirective, ScTelLinkModule, ScTerminalLinkDirective, ScUpdateUserInfoDialogComponent, ScUserManagersComponent, ScUserModule, ScUserPhoneApproveDialogComponent, ScVerificationModule, ScVerificationPhoneCheckFormComponent, TreeDirective, TreeIconService, TreeLoaderService, TreeTopDirective, scBicValidator, scClientUiIconsName, scCorrespondentAccountValidator, scPasswordConfirmMatchingValidator, scUserFactory, stepValidator };
 //# sourceMappingURL=snabcentr-client-ui.mjs.map