@snabcentr/client-ui 3.31.2 → 3.32.0

package/esm2022/samples/sc-preview-samples-mosquito/sc-preview-samples-mosquito.component.mjs

@@ -54,10 +54,10 @@ export class ScPreviewSamplesMosquitoComponent {
         this.isShowCarouselSwitches = input(!inject(TUI_IS_MOBILE));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ScPreviewSamplesMosquitoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ScPreviewSamplesMosquitoComponent, isStandalone: true, selector: "sc-preview-samples-mosquito", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, configuratorPageUrl: { classPropertyName: "configuratorPageUrl", publicName: "configuratorPageUrl", isSignal: true, isRequired: false, transformFunction: null }, autoSlideIntervale: { classPropertyName: "autoSlideIntervale", publicName: "autoSlideIntervale", isSignal: true, isRequired: false, transformFunction: null }, isShowCarouselSwitches: { classPropertyName: "isShowCarouselSwitches", publicName: "isShowCarouselSwitches", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openConfiguratorClick: "openConfiguratorClick", openConsultationClick: "openConsultationClick" }, ngImport: i0, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <img\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                [src]=\"config().colorsIcons[image]\"\n                [alt]=\"descriptions['color'][itemIndex]\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            />\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <div\n                    *tuiItem\n                    [style.backgroundImage]=\"'url(' + item + ')'\"\n                    class=\"h-[19em] w-full bg-cover bg-right md:h-96 lg:h-[28rem]\"\n                ></div>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"], dependencies: [{ kind: "directive", type: i1.TuiItem, selector: "[tuiItem]" }, { kind: "component", type: i2.TuiCarouselComponent, selector: "tui-carousel", inputs: ["draggable", "itemsCount", "index"], outputs: ["indexChange", "shift"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "directive", type: TuiBadge, selector: "tui-badge,[tuiBadge]", inputs: ["size"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TuiHovered, selector: "[tuiHoveredChange]", outputs: ["tuiHoveredChange"] }, { kind: "directive", type: TuiCardLarge, selector: "[tuiCardLarge]", inputs: ["tuiCardLarge"] }, { kind: "directive", type: TuiHeader, selector: "[tuiHeader]", inputs: ["tuiHeader"] }, { kind: "directive", type: TuiSurface, selector: "[tuiSurface]", inputs: ["tuiSurface"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ScPreviewSamplesMosquitoComponent, isStandalone: true, selector: "sc-preview-samples-mosquito", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, configuratorPageUrl: { classPropertyName: "configuratorPageUrl", publicName: "configuratorPageUrl", isSignal: true, isRequired: false, transformFunction: null }, autoSlideIntervale: { classPropertyName: "autoSlideIntervale", publicName: "autoSlideIntervale", isSignal: true, isRequired: false, transformFunction: null }, isShowCarouselSwitches: { classPropertyName: "isShowCarouselSwitches", publicName: "isShowCarouselSwitches", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openConfiguratorClick: "openConfiguratorClick", openConsultationClick: "openConsultationClick" }, ngImport: i0, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <picture\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            >\n                <source\n                    type=\"image/webp\"\n                    [srcset]=\"config().colorsIcons[image].webp\"\n                />\n                <img\n                    [src]=\"config().colorsIcons[image].defaultFormat\"\n                    [alt]=\"config().colorsIcons[image].alt ?? descriptions['color'][itemIndex]\"\n                    class=\"size-11 rounded-xl\"\n                />\n            </picture>\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <picture *tuiItem>\n                    <source\n                        type=\"image/webp\"\n                        [srcset]=\"item.webp\"\n                    />\n                    <img\n                        [alt]=\"item.alt ?? descriptions['color'][colorIndexSelected()]\"\n                        [src]=\"item.defaultFormat\"\n                        class=\"h-[19em] w-full object-cover object-center md:h-96 lg:h-[28rem]\"\n                    />\n                </picture>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"], dependencies: [{ kind: "directive", type: i1.TuiItem, selector: "[tuiItem]" }, { kind: "component", type: i2.TuiCarouselComponent, selector: "tui-carousel", inputs: ["draggable", "itemsCount", "index"], outputs: ["indexChange", "shift"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "directive", type: TuiBadge, selector: "tui-badge,[tuiBadge]", inputs: ["size"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TuiHovered, selector: "[tuiHoveredChange]", outputs: ["tuiHoveredChange"] }, { kind: "directive", type: TuiCardLarge, selector: "[tuiCardLarge]", inputs: ["tuiCardLarge"] }, { kind: "directive", type: TuiHeader, selector: "[tuiHeader]", inputs: ["tuiHeader"] }, { kind: "directive", type: TuiSurface, selector: "[tuiSurface]", inputs: ["tuiSurface"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ScPreviewSamplesMosquitoComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'sc-preview-samples-mosquito', imports: [TuiCarousel, TuiButton, TuiIcon, TuiChip, TuiBadge, NgFor, TuiAppearance, TuiHovered, TuiCardLarge, TuiHeader, TuiIcon, TuiSurface], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <img\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                [src]=\"config().colorsIcons[image]\"\n                [alt]=\"descriptions['color'][itemIndex]\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            />\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <div\n                    *tuiItem\n                    [style.backgroundImage]=\"'url(' + item + ')'\"\n                    class=\"h-[19em] w-full bg-cover bg-right md:h-96 lg:h-[28rem]\"\n                ></div>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"] }]
+            args: [{ standalone: true, selector: 'sc-preview-samples-mosquito', imports: [TuiCarousel, TuiButton, TuiIcon, TuiChip, TuiBadge, NgFor, TuiAppearance, TuiHovered, TuiCardLarge, TuiHeader, TuiIcon, TuiSurface], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <picture\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            >\n                <source\n                    type=\"image/webp\"\n                    [srcset]=\"config().colorsIcons[image].webp\"\n                />\n                <img\n                    [src]=\"config().colorsIcons[image].defaultFormat\"\n                    [alt]=\"config().colorsIcons[image].alt ?? descriptions['color'][itemIndex]\"\n                    class=\"size-11 rounded-xl\"\n                />\n            </picture>\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <picture *tuiItem>\n                    <source\n                        type=\"image/webp\"\n                        [srcset]=\"item.webp\"\n                    />\n                    <img\n                        [alt]=\"item.alt ?? descriptions['color'][colorIndexSelected()]\"\n                        [src]=\"item.defaultFormat\"\n                        class=\"h-[19em] w-full object-cover object-center md:h-96 lg:h-[28rem]\"\n                    />\n                </picture>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"] }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NsaWVudC11aS9zYW1wbGVzL3NjLXByZXZpZXctc2FtcGxlcy1tb3NxdWl0by9zYy1wcmV2aWV3LXNhbXBsZXMtbW9zcXVpdG8uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2xpZW50LXVpL3NhbXBsZXMvc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvL3NjLXByZXZpZXctc2FtcGxlcy1tb3NxdWl0by5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDeEMsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBZSxNQUFNLEVBQTRCLE1BQU0sRUFBa0IsTUFBTSxlQUFlLENBQUM7QUFDbkssT0FBTyxFQUFFLGFBQWEsRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxTQUFTLEVBQUUsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQy9FLE9BQU8sRUFBRSxRQUFRLEVBQUUsV0FBVyxFQUFFLE9BQU8sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvRCxPQUFPLEVBQUUsWUFBWSxFQUFFLFNBQVMsRUFBRSxNQUFNLGtCQUFrQixDQUFDOzs7O0FBSTNEOztHQUVHO0FBU0gsTUFBTSxPQUFPLGlDQUFpQztJQVI5QztRQVNJOztXQUVHO1FBQ2EsZUFBVSxHQUEyQixNQUFNLENBQVMsQ0FBQyxDQUFDLENBQUM7UUFFdkU7O1dBRUc7UUFDYSxpQkFBWSxHQUEyQixNQUFNLENBQVMsQ0FBQyxDQUFDLENBQUM7UUFFekU7O1dBRUc7UUFDYSx5QkFBb0IsR0FBbUIsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDLENBQUMsQ0FBQztRQUVsSDs7V0FFRztRQUNhLHVCQUFrQixHQUFtQixRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBRTVHOztXQUVHO1FBQ2EsV0FBTSxHQUF5QyxLQUFLLENBQUMsUUFBUSxFQUEyQixDQUFDO1FBRXpHOztXQUVHO1FBQ2EsMEJBQXFCLEdBQTJCLE1BQU0sRUFBRSxDQUFDO1FBRXpFOztXQUVHO1FBQ2Esd0JBQW1CLEdBQW9DLEtBQUssRUFBc0IsQ0FBQztRQUVuRzs7V0FFRztRQUNhLDBCQUFxQixHQUEyQixNQUFNLEVBQUUsQ0FBQztRQUV6RTs7V0FFRztRQUNhLHVCQUFrQixHQUF3QixLQUFLLENBQVMsQ0FBQyxDQUFDLENBQUM7UUFFM0U7O1dBRUc7UUFDZ0IsMkJBQXNCLEdBQXlCLEtBQUssQ0FBQyxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDO0tBQ25HOytHQWxEWSxpQ0FBaUM7bUdBQWpDLGlDQUFpQyxzekJDcEI5Qyx5ME5BMklBLG0wQkQxSDJCLFNBQVMsb0lBQUUsT0FBTyxxRkFBRSxPQUFPLGlGQUFFLFFBQVEsbUZBQUUsS0FBSyxtSEFBaUIsVUFBVSw4RkFBRSxZQUFZLHFGQUFFLFNBQVMsK0VBQVcsVUFBVTs7NEZBR25JLGlDQUFpQztrQkFSN0MsU0FBUztpQ0FDTSxJQUFJLFlBQ04sNkJBQTZCLFdBRzlCLENBQUMsV0FBVyxFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQUUsU0FBUyxFQUFFLE9BQU8sRUFBRSxVQUFVLENBQUMsbUJBQzVILHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ0ZvciB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBjb21wdXRlZCwgaW5qZWN0LCBpbnB1dCwgSW5wdXRTaWduYWwsIG91dHB1dCwgT3V0cHV0RW1pdHRlclJlZiwgU2lnbmFsLCBzaWduYWwsIFdyaXRhYmxlU2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBUVUlfSVNfTU9CSUxFLCBUdWlIb3ZlcmVkIH0gZnJvbSAnQHRhaWdhLXVpL2Nkayc7XG5pbXBvcnQgeyBUdWlBcHBlYXJhbmNlLCBUdWlCdXR0b24sIFR1aUljb24sIFR1aVN1cmZhY2UgfSBmcm9tICdAdGFpZ2EtdWkvY29yZSc7XG5pbXBvcnQgeyBUdWlCYWRnZSwgVHVpQ2Fyb3VzZWwsIFR1aUNoaXAgfSBmcm9tICdAdGFpZ2EtdWkva2l0JztcbmltcG9ydCB7IFR1aUNhcmRMYXJnZSwgVHVpSGVhZGVyIH0gZnJvbSAnQHRhaWdhLXVpL2xheW91dCc7XG5cbmltcG9ydCB7IFNjUHJldmlld01vc3F1aXRvQ29uZmlnIH0gZnJvbSAnLi4vaW50ZXJmYWNlcyc7XG5cbi8qKlxuICog0JrQvtC80L/QvtC90LXQvdGCINC/0YDQtdC00YHRgtCw0LLQu9C10L3QuNGPINC80L7RgdC60LjRgtC90L7QuSDRgdC10YLQutC4LlxuICovXG5AQ29tcG9uZW50KHtcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIHNlbGVjdG9yOiAnc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybDogJy4vc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvLmNvbXBvbmVudC5zY3NzJyxcbiAgICBpbXBvcnRzOiBbVHVpQ2Fyb3VzZWwsIFR1aUJ1dHRvbiwgVHVpSWNvbiwgVHVpQ2hpcCwgVHVpQmFkZ2UsIE5nRm9yLCBUdWlBcHBlYXJhbmNlLCBUdWlIb3ZlcmVkLCBUdWlDYXJkTGFyZ2UsIFR1aUhlYWRlciwgVHVpSWNvbiwgVHVpU3VyZmFjZV0sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFNjUHJldmlld1NhbXBsZXNNb3NxdWl0b0NvbXBvbmVudCB7XG4gICAgLyoqXG4gICAgICog0JLRi9Cx0YDQsNC90L3Ri9C5INC40L3QtNC10LrRgSDRhtCy0LXRgtCwINC/0YDQvtGE0LjQu9GPLlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBjb2xvckluZGV4OiBXcml0YWJsZVNpZ25hbDxudW1iZXI+ID0gc2lnbmFsPG51bWJlcj4oMCk7XG5cbiAgICAvKipcbiAgICAgKiDQktGL0LHRgNCw0L3QvdGL0Lkg0LjQvdC00LXQutGBINGC0LjQv9CwINGB0LXRgtC60LguXG4gICAgICovXG4gICAgcHVibGljIHJlYWRvbmx5IG5ldFR5cGVJbmRleDogV3JpdGFibGVTaWduYWw8bnVtYmVyPiA9IHNpZ25hbDxudW1iZXI+KDApO1xuXG4gICAgLyoqXG4gICAgICog0JLRi9Cx0YDQsNC90L3Ri9C5INGC0LjQvyDRgdC10YLQutC4LlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBuZXRUeXBlSW5kZXhTZWxlY3RlZDogU2lnbmFsPHN0cmluZz4gPSBjb21wdXRlZCgoKSA9PiB0aGlzLmNvbmZpZygpLm5ldFR5cGVbdGhpcy5uZXRUeXBlSW5kZXgoKV0pO1xuXG4gICAgLyoqXG4gICAgICog0JLRi9Cx0YDQsNC90L3Ri9C5INGG0LLQtdGCINC/0YDQvtGE0LjQu9GPLlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBjb2xvckluZGV4U2VsZWN0ZWQ6IFNpZ25hbDxzdHJpbmc+ID0gY29tcHV0ZWQoKCkgPT4gdGhpcy5jb25maWcoKS5jb2xvclt0aGlzLmNvbG9ySW5kZXgoKV0pO1xuXG4gICAgLyoqXG4gICAgICog0JrQvtC90YTQuNCz0YPRgNCw0YbQuNGPINC00LvRjyDQvtGC0L7QsdGA0LDQttC10L3QuNGPINC+0LHRgNCw0LfRhtCwINC80L7RgdC60LjRgtC90L7QuSDRgdC10YLQutC4LlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBjb25maWc6IElucHV0U2lnbmFsPFNjUHJldmlld01vc3F1aXRvQ29uZmlnPiA9IGlucHV0LnJlcXVpcmVkPFNjUHJldmlld01vc3F1aXRvQ29uZmlnPigpO1xuXG4gICAgLyoqXG4gICAgICog0KHQvtCx0YvRgtC40LUsINC60L7RgtC+0YDQvtC1INC/0YDQvtC40YHRhdC+0LTQuNGCINC/0YDQuCDQvdCw0LbQsNGC0LjQuCDQvdCwINC60L3QvtC/0LrRgyBcItCd0LDQt9Cw0LQg0LIg0JrQvtC90YTQuNCz0YPRgNCw0YLQvtGAXCIuXG4gICAgICovXG4gICAgcHVibGljIHJlYWRvbmx5IG9wZW5Db25maWd1cmF0b3JDbGljazogT3V0cHV0RW1pdHRlclJlZjx2b2lkPiA9IG91dHB1dCgpO1xuXG4gICAgLyoqXG4gICAgICog0KHRgdGL0LvQutCwINC90LAg0YHRgtGA0LDQvdC40YbRgyDQutC+0L3RhNC40LPRg9GA0LDRgtC+0YDQsC5cbiAgICAgKi9cbiAgICBwdWJsaWMgcmVhZG9ubHkgY29uZmlndXJhdG9yUGFnZVVybDogSW5wdXRTaWduYWw8c3RyaW5nIHwgdW5kZWZpbmVkPiA9IGlucHV0PHN0cmluZyB8IHVuZGVmaW5lZD4oKTtcblxuICAgIC8qKlxuICAgICAqINCh0L7QsdGL0YLQuNC1LCDQutC+0YLQvtGA0L7QtSDQv9GA0L7QuNGB0YXQvtC00LjRgiDQv9GA0Lgg0L3QsNC20LDRgtC40Lgg0L3QsCDQutC90L7Qv9C60YMgXCLQmtC+0L3RgdGD0LvRjNGC0LDRhtC40Y9cIi5cbiAgICAgKi9cbiAgICBwdWJsaWMgcmVhZG9ubHkgb3BlbkNvbnN1bHRhdGlvbkNsaWNrOiBPdXRwdXRFbWl0dGVyUmVmPHZvaWQ+ID0gb3V0cHV0KCk7XG5cbiAgICAvKipcbiAgICAgKiDQmNC90YLQtdGA0LLQsNC7INCw0LLRgtC+0LzQsNGC0LjRh9C10YHQutC+0LPQviDQv9GA0L7Rh9C40YLRi9Cy0LDQvdC40Y8g0YHQv9C40YHQutCwINGC0L7QstCw0YDQvtCyINCyINC80LjQu9C70LjRgdC10LrRg9C90LTQsNGFLlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBhdXRvU2xpZGVJbnRlcnZhbGU6IElucHV0U2lnbmFsPG51bWJlcj4gPSBpbnB1dDxudW1iZXI+KDApO1xuXG4gICAgLyoqXG4gICAgICog0J/RgNC40LfQvdCw0LosINGH0YLQviDQvdC10L7QsdGF0L7QtNC40LzQviDQvtGC0L7QsdGA0LDQttCw0YLRjCDQv9C10YDQtdC60LvRjtGH0LDRgtC10LvQuCDQvdCwINC60LDRgNGD0YHQtdC70LguXG4gICAgICovXG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IGlzU2hvd0Nhcm91c2VsU3dpdGNoZXM6IElucHV0U2lnbmFsPGJvb2xlYW4+ID0gaW5wdXQoIWluamVjdChUVUlfSVNfTU9CSUxFKSk7XG59XG4iLCJAbGV0IGRlc2NyaXB0aW9ucyA9IGNvbmZpZygpLmRlc2NyaXB0aW9ucztcbkBsZXQgY29sb3JzID0gY29uZmlnKCkuY29sb3I7XG5AbGV0IG5ldFR5cGVzID0gY29uZmlnKCkubmV0VHlwZTtcblxuPCEtLSDQntGB0L3QvtCy0L3QvtC5INC60L7QvdGC0LXQudC90LXRgCDRgSDRgdC10YLQutC+0LkuIC0tPlxuPGRpdiBjbGFzcz1cImdyaWQgZ3JpZC1jb2xzLTEgZ2FwLTQgbGc6Z3JpZC1jb2xzLTJcIj5cbiAgICA8IS0tINCb0LXQstCw0Y8g0LrQvtC70L7QvdC60LAg0YEg0LjQvdGE0L7RgNC80LDRhtC40LXQuS4gLS0+XG4gICAgPGRpdiBjbGFzcz1cImZsZXggZmxleC1jb2wgZ2FwLTRcIj5cbiAgICAgICAgPCEtLSDQmtC90L7Qv9C60Lgg0LLRi9Cx0L7RgNCwINGC0LjQv9CwINGB0LXRgtC60LguIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBmbGV4LXdyYXAgZ2FwLTRcIj5cbiAgICAgICAgICAgIDxidXR0b25cbiAgICAgICAgICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiBuZXRUeXBlczsgbGV0IGl0ZW1JbmRleCA9IGluZGV4XCJcbiAgICAgICAgICAgICAgICB0dWlDYXJkTGFyZ2VcbiAgICAgICAgICAgICAgICB0dWlIZWFkZXJcbiAgICAgICAgICAgICAgICB0dWlTdXJmYWNlPVwiZmxvYXRpbmdcIlxuICAgICAgICAgICAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgICAgICAgICAgIChjbGljayk9XCJuZXRUeXBlSW5kZXguc2V0KGl0ZW1JbmRleClcIlxuICAgICAgICAgICAgICAgIFtjbGFzcy5hY3RpdmVdPVwibmV0VHlwZUluZGV4KCkgPT09IGl0ZW1JbmRleFwiXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJoLTEyICFpdGVtcy1jZW50ZXIgZ2FwLTIgIXJvdW5kZWQteGwgIXB4LTQgIXB5LTBcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIDxpbWdcbiAgICAgICAgICAgICAgICAgICAgW3NyY109XCJjb25maWcoKS5pY29uc1tpdGVtXVwiXG4gICAgICAgICAgICAgICAgICAgIFthbHRdPVwiZGVzY3JpcHRpb25zWyduZXRUeXBlJ11baXRlbV1cIlxuICAgICAgICAgICAgICAgICAgICBjbGFzcz1cInNpemUtOFwiXG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICA8ZGl2Pnt7IGRlc2NyaXB0aW9uc1snbmV0VHlwZSddW2l0ZW1dIH19PC9kaXY+XG4gICAgICAgICAgICA8L2J1dHRvbj5cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgPCEtLSDQntC/0LjRgdCw0L3QuNC1INCy0YvQsdGA0LDQvdC90L7Qs9C+INGC0LjQv9CwINGB0LXRgtC60LguIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwidGV4dC1ib2R5LWwtYm9sZFwiPtCh0LXRgtC60LAge3sgZGVzY3JpcHRpb25zWyduZXRUeXBlJ11bbmV0VHlwZUluZGV4U2VsZWN0ZWQoKV0gfX08L2Rpdj5cbiAgICAgICAge3sgY29uZmlnKCkuc3VidGl0bGVzW25ldFR5cGVJbmRleFNlbGVjdGVkKCldIH19XG5cbiAgICAgICAgPCEtLSDQmNC90YTQvtGA0LzQsNGG0LjQvtC90L3Ri9C1INCx0LXQudC00LbQuC4gLS0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJmbGV4IGZsZXgtd3JhcCBpdGVtcy1jZW50ZXIgZ2FwLTEgdGV4dC1ib2R5LW1cIj5cbiAgICAgICAgICAgIDx0dWktYmFkZ2VcbiAgICAgICAgICAgICAgICBhcHBlYXJhbmNlPVwiY3VzdG9tXCJcbiAgICAgICAgICAgICAgICBjbGFzcz1cInJvdW5kZWQtZnVsbCBib3JkZXItMiBib3JkZXItc29saWQgYm9yZGVyLXR1aS10ZXh0LXByaW1hcnkgYmctd2hpdGUgIXAtWzAuNHJlbV0gZm9udC1ib2xkIHRleHQtdHVpLXRleHQtcHJpbWFyeVwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3sgY29sb3JzLmxlbmd0aCB9fVxuICAgICAgICAgICAgPC90dWktYmFkZ2U+XG4gICAgICAgICAgICAtINC60L7Qu9C70LjRh9C10YHRgtCy0L4g0YbQstC10YLQvtCyINC/0YDQvtGE0LjQu9GPXG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBmbGV4LXdyYXAgaXRlbXMtY2VudGVyIGdhcC0xIHRleHQtYm9keS1tXCI+XG4gICAgICAgICAgICA8dHVpLWJhZGdlXG4gICAgICAgICAgICAgICAgYXBwZWFyYW5jZT1cImN1c3RvbVwiXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJyb3VuZGVkLWZ1bGwgYm9yZGVyLTIgYm9yZGVyLXNvbGlkIGJvcmRlci10dWktdGV4dC1wcmltYXJ5IGJnLXdoaXRlICFwLVswLjRyZW1dIGZvbnQtYm9sZCB0ZXh0LXR1aS10ZXh0LXByaW1hcnlcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHt7IG5ldFR5cGVzLmxlbmd0aCB9fVxuICAgICAgICAgICAgPC90dWktYmFkZ2U+XG4gICAgICAgICAgICAtINC60L7Qu9C70LjRh9C10YHRgtCy0L4g0YLQuNC/0L7QsiDRgdC10YLQvtC6XG4gICAgICAgIDwvZGl2PlxuXG4gICAgICAgIDwhLS0g0KDQsNC30LzQtdGA0Ysg0YHQtdGC0L7Qui4gLS0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LWJvZHktbVwiPlxuICAgICAgICAgICAgPHR1aS1pY29uIGljb249XCJAdHVpLnNjLmdyaWQtaGVpZ2h0LWFycm93XCIgLz5cbiAgICAgICAgICAgINCS0YvRgdC+0YLQsCDRgdC10YLQvtC6INC+0YIge3sgY29uZmlnKCkubWluSGVpZ2h0IH19INC00L4ge3sgY29uZmlnKCkubWF4SGVpZ2h0c1tuZXRUeXBlSW5kZXhTZWxlY3RlZCgpXSB9fSDQvNC8XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwidGV4dC1ib2R5LW1cIj5cbiAgICAgICAgICAgIDx0dWktaWNvbiBpY29uPVwiQHR1aS5zYy5ncmlkLXdpZHRoLWFycm93XCIgLz5cbiAgICAgICAgICAgINCo0LjRgNC40L3QsCDRgdC10YLQvtC6INC+0YIge3sgY29uZmlnKCkubWluV2lkdGggfX0g0LTQviB7eyBjb25maWcoKS5tYXhXaWR0aHNbbmV0VHlwZUluZGV4U2VsZWN0ZWQoKV0gfX0g0LzQvFxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8IS0tINCi0LXQs9C4INGF0LDRgNCw0LrRgtC10YDQuNGB0YLQuNC6LiAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImZsZXggZmxleC13cmFwIGdhcC0yXCI+XG4gICAgICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICAgICAgKm5nRm9yPVwibGV0IHRhZyBvZiBjb25maWcoKS50YWdzW25ldFR5cGVJbmRleFNlbGVjdGVkKCldXCJcbiAgICAgICAgICAgICAgICB0dWlDaGlwXG4gICAgICAgICAgICAgICAgYXBwZWFyYW5jZT1cIm5ldXRyYWxcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHt7IHRhZyB9fVxuICAgICAgICAgICAgPC9idXR0b24+XG4gICAgICAgIDwvZGl2PlxuXG4gICAgICAgIDwhLS0g0JLRi9Cx0L7RgCDRhtCy0LXRgtCwINC/0YDQvtGE0LjQu9GPLiAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImZsZXggZ2FwLTRcIj5cbiAgICAgICAgICAgIDxpbWdcbiAgICAgICAgICAgICAgICAqbmdGb3I9XCJsZXQgaW1hZ2Ugb2YgY29uZmlnKCkuY29sb3I7IGxldCBpdGVtSW5kZXggPSBpbmRleFwiXG4gICAgICAgICAgICAgICAgW3NyY109XCJjb25maWcoKS5jb2xvcnNJY29uc1tpbWFnZV1cIlxuICAgICAgICAgICAgICAgIFthbHRdPVwiZGVzY3JpcHRpb25zWydjb2xvciddW2l0ZW1JbmRleF1cIlxuICAgICAgICAgICAgICAgICh0dWlIb3ZlcmVkQ2hhbmdlKT1cImNvbG9ySW5kZXguc2V0KGl0ZW1JbmRleClcIlxuICAgICAgICAgICAgICAgIFtjbGFzcy5hY3RpdmVdPVwiY29sb3JJbmRleCgpID09PSBpdGVtSW5kZXhcIlxuICAgICAgICAgICAgICAgIGNsYXNzPVwic2l6ZS0xMSByb3VuZGVkLXhsXCJcbiAgICAgICAgICAgIC8+XG4gICAgICAgIDwvZGl2PlxuXG4gICAgICAgIDwhLS0g0JrQvdC+0L/QutC4INC00LXQudGB0YLQstC40LkuIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBnYXAtMlwiPlxuICAgICAgICAgICAgPGFcbiAgICAgICAgICAgICAgICB0dWlCdXR0b25cbiAgICAgICAgICAgICAgICBbYXR0ci5ocmVmXT1cImNvbmZpZ3VyYXRvclBhZ2VVcmwoKVwiXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cIiRldmVudC5wcmV2ZW50RGVmYXVsdCgpOyBvcGVuQ29uZmlndXJhdG9yQ2xpY2suZW1pdCgpXCJcbiAgICAgICAgICAgICAgICBpY29uU3RhcnQ9XCJAdHVpLnNsaWRlcnMtaG9yaXpvbnRhbFwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAg0KHQtNC10LvQsNGC0Ywg0YDQsNGB0YfQtdGCXG4gICAgICAgICAgICA8L2E+XG5cbiAgICAgICAgICAgIDxidXR0b25cbiAgICAgICAgICAgICAgICB0dWlCdXR0b25cbiAgICAgICAgICAgICAgICAoY2xpY2spPVwib3BlbkNvbnN1bHRhdGlvbkNsaWNrLmVtaXQoKVwiXG4gICAgICAgICAgICAgICAgaWNvblN0YXJ0PVwiQHR1aS5tZXNzYWdlcy1zcXVhcmVcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgINCa0L7QvdGB0YPQu9GM0YLQsNGG0LjRj1xuICAgICAgICAgICAgPC9idXR0b24+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuXG4gICAgPCEtLSDQn9GA0LDQstCw0Y8g0LrQvtC70L7QvdC60LAg0YEg0LrQsNGA0YPRgdC10LvRjNGOINC40LfQvtCx0YDQsNC20LXQvdC40LkuIC0tPlxuICAgIDxkaXYgY2xhc3M9XCJyZWxhdGl2ZSAtb3JkZXItMSBoLVsxOWVtXSBmbGV4LTEgb3ZlcmZsb3ctaGlkZGVuIHJvdW5kZWQteGwgc2hhZG93LXR1aS1zaGFkb3cgbWQ6aC05NiBsZzpvcmRlci0yIGxnOmgtWzI4cmVtXVwiPlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICB0dWlJY29uQnV0dG9uXG4gICAgICAgICAgICBpY29uU3RhcnQ9XCJAdHVpLmNoZXZyb24tbGVmdFwiXG4gICAgICAgICAgICAoY2xpY2spPVwiY2Fyb3VzZWwucHJldigpXCJcbiAgICAgICAgICAgIGFwcGVhcmFuY2U9XCJpY29uXCJcbiAgICAgICAgICAgIGNsYXNzPVwiIWFic29sdXRlIGxlZnQtMCB0b3AtMS8yIHotMTAgbWwtMiAtdHJhbnNsYXRlLXktMS8yXCJcbiAgICAgICAgPjwvYnV0dG9uPlxuXG4gICAgICAgIDx0dWktY2Fyb3VzZWxcbiAgICAgICAgICAgICNjYXJvdXNlbFxuICAgICAgICAgICAgW2R1cmF0aW9uXT1cImF1dG9TbGlkZUludGVydmFsZSgpXCJcbiAgICAgICAgICAgIGNsYXNzPVwiaC1bMTllbV0gdy1mdWxsIG1kOmgtOTYgbGc6aC1bMjhyZW1dXCJcbiAgICAgICAgPlxuICAgICAgICAgICAgQGZvciAoaXRlbSBvZiBjb25maWcoKS5pbWFnZVByZXZpZXdzQnlDb2xvcltjb2xvckluZGV4U2VsZWN0ZWQoKV07IHRyYWNrICRpbmRleCkge1xuICAgICAgICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgICAgICAgICAgKnR1aUl0ZW1cbiAgICAgICAgICAgICAgICAgICAgW3N0eWxlLmJhY2tncm91bmRJbWFnZV09XCIndXJsKCcgKyBpdGVtICsgJyknXCJcbiAgICAgICAgICAgICAgICAgICAgY2xhc3M9XCJoLVsxOWVtXSB3LWZ1bGwgYmctY292ZXIgYmctcmlnaHQgbWQ6aC05NiBsZzpoLVsyOHJlbV1cIlxuICAgICAgICAgICAgICAgID48L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgPC90dWktY2Fyb3VzZWw+XG4gICAgICAgIDxidXR0b25cbiAgICAgICAgICAgIHR1aUljb25CdXR0b25cbiAgICAgICAgICAgIGljb25TdGFydD1cIkB0dWkuY2hldnJvbi1yaWdodFwiXG4gICAgICAgICAgICAoY2xpY2spPVwiY2Fyb3VzZWwubmV4dCgpXCJcbiAgICAgICAgICAgIGFwcGVhcmFuY2U9XCJpY29uXCJcbiAgICAgICAgICAgIGNsYXNzPVwiIWFic29sdXRlIHJpZ2h0LTAgdG9wLTEvMiB6LTEwIG1yLTIgLXRyYW5zbGF0ZS15LTEvMlwiXG4gICAgICAgID48L2J1dHRvbj5cbiAgICA8L2Rpdj5cbjwvZGl2PlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NsaWVudC11aS9zYW1wbGVzL3NjLXByZXZpZXctc2FtcGxlcy1tb3NxdWl0by9zYy1wcmV2aWV3LXNhbXBsZXMtbW9zcXVpdG8uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2xpZW50LXVpL3NhbXBsZXMvc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvL3NjLXByZXZpZXctc2FtcGxlcy1tb3NxdWl0by5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDeEMsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBZSxNQUFNLEVBQTRCLE1BQU0sRUFBa0IsTUFBTSxlQUFlLENBQUM7QUFDbkssT0FBTyxFQUFFLGFBQWEsRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUQsT0FBTyxFQUFFLGFBQWEsRUFBRSxTQUFTLEVBQUUsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQy9FLE9BQU8sRUFBRSxRQUFRLEVBQUUsV0FBVyxFQUFFLE9BQU8sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvRCxPQUFPLEVBQUUsWUFBWSxFQUFFLFNBQVMsRUFBRSxNQUFNLGtCQUFrQixDQUFDOzs7O0FBSTNEOztHQUVHO0FBU0gsTUFBTSxPQUFPLGlDQUFpQztJQVI5QztRQVNJOztXQUVHO1FBQ2EsZUFBVSxHQUEyQixNQUFNLENBQVMsQ0FBQyxDQUFDLENBQUM7UUFFdkU7O1dBRUc7UUFDYSxpQkFBWSxHQUEyQixNQUFNLENBQVMsQ0FBQyxDQUFDLENBQUM7UUFFekU7O1dBRUc7UUFDYSx5QkFBb0IsR0FBbUIsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDLENBQUMsQ0FBQztRQUVsSDs7V0FFRztRQUNhLHVCQUFrQixHQUFtQixRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBRTVHOztXQUVHO1FBQ2EsV0FBTSxHQUF5QyxLQUFLLENBQUMsUUFBUSxFQUEyQixDQUFDO1FBRXpHOztXQUVHO1FBQ2EsMEJBQXFCLEdBQTJCLE1BQU0sRUFBRSxDQUFDO1FBRXpFOztXQUVHO1FBQ2Esd0JBQW1CLEdBQW9DLEtBQUssRUFBc0IsQ0FBQztRQUVuRzs7V0FFRztRQUNhLDBCQUFxQixHQUEyQixNQUFNLEVBQUUsQ0FBQztRQUV6RTs7V0FFRztRQUNhLHVCQUFrQixHQUF3QixLQUFLLENBQVMsQ0FBQyxDQUFDLENBQUM7UUFFM0U7O1dBRUc7UUFDZ0IsMkJBQXNCLEdBQXlCLEtBQUssQ0FBQyxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDO0tBQ25HOytHQWxEWSxpQ0FBaUM7bUdBQWpDLGlDQUFpQyxzekJDcEI5QyxrNk9BeUpBLG0wQkR4STJCLFNBQVMsb0lBQUUsT0FBTyxxRkFBRSxPQUFPLGlGQUFFLFFBQVEsbUZBQUUsS0FBSyxtSEFBaUIsVUFBVSw4RkFBRSxZQUFZLHFGQUFFLFNBQVMsK0VBQVcsVUFBVTs7NEZBR25JLGlDQUFpQztrQkFSN0MsU0FBUztpQ0FDTSxJQUFJLFlBQ04sNkJBQTZCLFdBRzlCLENBQUMsV0FBVyxFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQUUsU0FBUyxFQUFFLE9BQU8sRUFBRSxVQUFVLENBQUMsbUJBQzVILHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ0ZvciB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBjb21wdXRlZCwgaW5qZWN0LCBpbnB1dCwgSW5wdXRTaWduYWwsIG91dHB1dCwgT3V0cHV0RW1pdHRlclJlZiwgU2lnbmFsLCBzaWduYWwsIFdyaXRhYmxlU2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBUVUlfSVNfTU9CSUxFLCBUdWlIb3ZlcmVkIH0gZnJvbSAnQHRhaWdhLXVpL2Nkayc7XG5pbXBvcnQgeyBUdWlBcHBlYXJhbmNlLCBUdWlCdXR0b24sIFR1aUljb24sIFR1aVN1cmZhY2UgfSBmcm9tICdAdGFpZ2EtdWkvY29yZSc7XG5pbXBvcnQgeyBUdWlCYWRnZSwgVHVpQ2Fyb3VzZWwsIFR1aUNoaXAgfSBmcm9tICdAdGFpZ2EtdWkva2l0JztcbmltcG9ydCB7IFR1aUNhcmRMYXJnZSwgVHVpSGVhZGVyIH0gZnJvbSAnQHRhaWdhLXVpL2xheW91dCc7XG5cbmltcG9ydCB7IFNjUHJldmlld01vc3F1aXRvQ29uZmlnIH0gZnJvbSAnLi4vaW50ZXJmYWNlcyc7XG5cbi8qKlxuICog0JrQvtC80L/QvtC90LXQvdGCINC/0YDQtdC00YHRgtCw0LLQu9C10L3QuNGPINC80L7RgdC60LjRgtC90L7QuSDRgdC10YLQutC4LlxuICovXG5AQ29tcG9uZW50KHtcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIHNlbGVjdG9yOiAnc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybDogJy4vc2MtcHJldmlldy1zYW1wbGVzLW1vc3F1aXRvLmNvbXBvbmVudC5zY3NzJyxcbiAgICBpbXBvcnRzOiBbVHVpQ2Fyb3VzZWwsIFR1aUJ1dHRvbiwgVHVpSWNvbiwgVHVpQ2hpcCwgVHVpQmFkZ2UsIE5nRm9yLCBUdWlBcHBlYXJhbmNlLCBUdWlIb3ZlcmVkLCBUdWlDYXJkTGFyZ2UsIFR1aUhlYWRlciwgVHVpSWNvbiwgVHVpU3VyZmFjZV0sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFNjUHJldmlld1NhbXBsZXNNb3NxdWl0b0NvbXBvbmVudCB7XG4gICAgLyoqXG4gICAgICog0JLRi9Cx0YDQsNC90L3Ri9C5INC40L3QtNC10LrRgSDRhtCy0LXRgtCwINC/0YDQvtGE0LjQu9GPLlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBjb2xvckluZGV4OiBXcml0YWJsZVNpZ25hbDxudW1iZXI+ID0gc2lnbmFsPG51bWJlcj4oMCk7XG5cbiAgICAvKipcbiAgICAgKiDQktGL0LHRgNCw0L3QvdGL0Lkg0LjQvdC00LXQutGBINGC0LjQv9CwINGB0LXRgtC60LguXG4gICAgICovXG4gICAgcHVibGljIHJlYWRvbmx5IG5ldFR5cGVJbmRleDogV3JpdGFibGVTaWduYWw8bnVtYmVyPiA9IHNpZ25hbDxudW1iZXI+KDApO1xuXG4gICAgLyoqXG4gICAgICog0JLRi9Cx0YDQsNC90L3Ri9C5INGC0LjQvyDRgdC10YLQutC4LlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBuZXRUeXBlSW5kZXhTZWxlY3RlZDogU2lnbmFsPHN0cmluZz4gPSBjb21wdXRlZCgoKSA9PiB0aGlzLmNvbmZpZygpLm5ldFR5cGVbdGhpcy5uZXRUeXBlSW5kZXgoKV0pO1xuXG4gICAgLyoqXG4gICAgICog0JLRi9Cx0YDQsNC90L3Ri9C5INGG0LLQtdGCINC/0YDQvtGE0LjQu9GPLlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBjb2xvckluZGV4U2VsZWN0ZWQ6IFNpZ25hbDxzdHJpbmc+ID0gY29tcHV0ZWQoKCkgPT4gdGhpcy5jb25maWcoKS5jb2xvclt0aGlzLmNvbG9ySW5kZXgoKV0pO1xuXG4gICAgLyoqXG4gICAgICog0JrQvtC90YTQuNCz0YPRgNCw0YbQuNGPINC00LvRjyDQvtGC0L7QsdGA0LDQttC10L3QuNGPINC+0LHRgNCw0LfRhtCwINC80L7RgdC60LjRgtC90L7QuSDRgdC10YLQutC4LlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBjb25maWc6IElucHV0U2lnbmFsPFNjUHJldmlld01vc3F1aXRvQ29uZmlnPiA9IGlucHV0LnJlcXVpcmVkPFNjUHJldmlld01vc3F1aXRvQ29uZmlnPigpO1xuXG4gICAgLyoqXG4gICAgICog0KHQvtCx0YvRgtC40LUsINC60L7RgtC+0YDQvtC1INC/0YDQvtC40YHRhdC+0LTQuNGCINC/0YDQuCDQvdCw0LbQsNGC0LjQuCDQvdCwINC60L3QvtC/0LrRgyBcItCd0LDQt9Cw0LQg0LIg0JrQvtC90YTQuNCz0YPRgNCw0YLQvtGAXCIuXG4gICAgICovXG4gICAgcHVibGljIHJlYWRvbmx5IG9wZW5Db25maWd1cmF0b3JDbGljazogT3V0cHV0RW1pdHRlclJlZjx2b2lkPiA9IG91dHB1dCgpO1xuXG4gICAgLyoqXG4gICAgICog0KHRgdGL0LvQutCwINC90LAg0YHRgtGA0LDQvdC40YbRgyDQutC+0L3RhNC40LPRg9GA0LDRgtC+0YDQsC5cbiAgICAgKi9cbiAgICBwdWJsaWMgcmVhZG9ubHkgY29uZmlndXJhdG9yUGFnZVVybDogSW5wdXRTaWduYWw8c3RyaW5nIHwgdW5kZWZpbmVkPiA9IGlucHV0PHN0cmluZyB8IHVuZGVmaW5lZD4oKTtcblxuICAgIC8qKlxuICAgICAqINCh0L7QsdGL0YLQuNC1LCDQutC+0YLQvtGA0L7QtSDQv9GA0L7QuNGB0YXQvtC00LjRgiDQv9GA0Lgg0L3QsNC20LDRgtC40Lgg0L3QsCDQutC90L7Qv9C60YMgXCLQmtC+0L3RgdGD0LvRjNGC0LDRhtC40Y9cIi5cbiAgICAgKi9cbiAgICBwdWJsaWMgcmVhZG9ubHkgb3BlbkNvbnN1bHRhdGlvbkNsaWNrOiBPdXRwdXRFbWl0dGVyUmVmPHZvaWQ+ID0gb3V0cHV0KCk7XG5cbiAgICAvKipcbiAgICAgKiDQmNC90YLQtdGA0LLQsNC7INCw0LLRgtC+0LzQsNGC0LjRh9C10YHQutC+0LPQviDQv9GA0L7Rh9C40YLRi9Cy0LDQvdC40Y8g0YHQv9C40YHQutCwINGC0L7QstCw0YDQvtCyINCyINC80LjQu9C70LjRgdC10LrRg9C90LTQsNGFLlxuICAgICAqL1xuICAgIHB1YmxpYyByZWFkb25seSBhdXRvU2xpZGVJbnRlcnZhbGU6IElucHV0U2lnbmFsPG51bWJlcj4gPSBpbnB1dDxudW1iZXI+KDApO1xuXG4gICAgLyoqXG4gICAgICog0J/RgNC40LfQvdCw0LosINGH0YLQviDQvdC10L7QsdGF0L7QtNC40LzQviDQvtGC0L7QsdGA0LDQttCw0YLRjCDQv9C10YDQtdC60LvRjtGH0LDRgtC10LvQuCDQvdCwINC60LDRgNGD0YHQtdC70LguXG4gICAgICovXG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IGlzU2hvd0Nhcm91c2VsU3dpdGNoZXM6IElucHV0U2lnbmFsPGJvb2xlYW4+ID0gaW5wdXQoIWluamVjdChUVUlfSVNfTU9CSUxFKSk7XG59XG4iLCJAbGV0IGRlc2NyaXB0aW9ucyA9IGNvbmZpZygpLmRlc2NyaXB0aW9ucztcbkBsZXQgY29sb3JzID0gY29uZmlnKCkuY29sb3I7XG5AbGV0IG5ldFR5cGVzID0gY29uZmlnKCkubmV0VHlwZTtcblxuPCEtLSDQntGB0L3QvtCy0L3QvtC5INC60L7QvdGC0LXQudC90LXRgCDRgSDRgdC10YLQutC+0LkuIC0tPlxuPGRpdiBjbGFzcz1cImdyaWQgZ3JpZC1jb2xzLTEgZ2FwLTQgbGc6Z3JpZC1jb2xzLTJcIj5cbiAgICA8IS0tINCb0LXQstCw0Y8g0LrQvtC70L7QvdC60LAg0YEg0LjQvdGE0L7RgNC80LDRhtC40LXQuS4gLS0+XG4gICAgPGRpdiBjbGFzcz1cImZsZXggZmxleC1jb2wgZ2FwLTRcIj5cbiAgICAgICAgPCEtLSDQmtC90L7Qv9C60Lgg0LLRi9Cx0L7RgNCwINGC0LjQv9CwINGB0LXRgtC60LguIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBmbGV4LXdyYXAgZ2FwLTRcIj5cbiAgICAgICAgICAgIDxidXR0b25cbiAgICAgICAgICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiBuZXRUeXBlczsgbGV0IGl0ZW1JbmRleCA9IGluZGV4XCJcbiAgICAgICAgICAgICAgICB0dWlDYXJkTGFyZ2VcbiAgICAgICAgICAgICAgICB0dWlIZWFkZXJcbiAgICAgICAgICAgICAgICB0dWlTdXJmYWNlPVwiZmxvYXRpbmdcIlxuICAgICAgICAgICAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgICAgICAgICAgIChjbGljayk9XCJuZXRUeXBlSW5kZXguc2V0KGl0ZW1JbmRleClcIlxuICAgICAgICAgICAgICAgIFtjbGFzcy5hY3RpdmVdPVwibmV0VHlwZUluZGV4KCkgPT09IGl0ZW1JbmRleFwiXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJoLTEyICFpdGVtcy1jZW50ZXIgZ2FwLTIgIXJvdW5kZWQteGwgIXB4LTQgIXB5LTBcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIDxpbWdcbiAgICAgICAgICAgICAgICAgICAgW3NyY109XCJjb25maWcoKS5pY29uc1tpdGVtXVwiXG4gICAgICAgICAgICAgICAgICAgIFthbHRdPVwiZGVzY3JpcHRpb25zWyduZXRUeXBlJ11baXRlbV1cIlxuICAgICAgICAgICAgICAgICAgICBjbGFzcz1cInNpemUtOFwiXG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICA8ZGl2Pnt7IGRlc2NyaXB0aW9uc1snbmV0VHlwZSddW2l0ZW1dIH19PC9kaXY+XG4gICAgICAgICAgICA8L2J1dHRvbj5cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgPCEtLSDQntC/0LjRgdCw0L3QuNC1INCy0YvQsdGA0LDQvdC90L7Qs9C+INGC0LjQv9CwINGB0LXRgtC60LguIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwidGV4dC1ib2R5LWwtYm9sZFwiPtCh0LXRgtC60LAge3sgZGVzY3JpcHRpb25zWyduZXRUeXBlJ11bbmV0VHlwZUluZGV4U2VsZWN0ZWQoKV0gfX08L2Rpdj5cbiAgICAgICAge3sgY29uZmlnKCkuc3VidGl0bGVzW25ldFR5cGVJbmRleFNlbGVjdGVkKCldIH19XG5cbiAgICAgICAgPCEtLSDQmNC90YTQvtGA0LzQsNGG0LjQvtC90L3Ri9C1INCx0LXQudC00LbQuC4gLS0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJmbGV4IGZsZXgtd3JhcCBpdGVtcy1jZW50ZXIgZ2FwLTEgdGV4dC1ib2R5LW1cIj5cbiAgICAgICAgICAgIDx0dWktYmFkZ2VcbiAgICAgICAgICAgICAgICBhcHBlYXJhbmNlPVwiY3VzdG9tXCJcbiAgICAgICAgICAgICAgICBjbGFzcz1cInJvdW5kZWQtZnVsbCBib3JkZXItMiBib3JkZXItc29saWQgYm9yZGVyLXR1aS10ZXh0LXByaW1hcnkgYmctd2hpdGUgIXAtWzAuNHJlbV0gZm9udC1ib2xkIHRleHQtdHVpLXRleHQtcHJpbWFyeVwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3sgY29sb3JzLmxlbmd0aCB9fVxuICAgICAgICAgICAgPC90dWktYmFkZ2U+XG4gICAgICAgICAgICAtINC60L7Qu9C70LjRh9C10YHRgtCy0L4g0YbQstC10YLQvtCyINC/0YDQvtGE0LjQu9GPXG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBmbGV4LXdyYXAgaXRlbXMtY2VudGVyIGdhcC0xIHRleHQtYm9keS1tXCI+XG4gICAgICAgICAgICA8dHVpLWJhZGdlXG4gICAgICAgICAgICAgICAgYXBwZWFyYW5jZT1cImN1c3RvbVwiXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJyb3VuZGVkLWZ1bGwgYm9yZGVyLTIgYm9yZGVyLXNvbGlkIGJvcmRlci10dWktdGV4dC1wcmltYXJ5IGJnLXdoaXRlICFwLVswLjRyZW1dIGZvbnQtYm9sZCB0ZXh0LXR1aS10ZXh0LXByaW1hcnlcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHt7IG5ldFR5cGVzLmxlbmd0aCB9fVxuICAgICAgICAgICAgPC90dWktYmFkZ2U+XG4gICAgICAgICAgICAtINC60L7Qu9C70LjRh9C10YHRgtCy0L4g0YLQuNC/0L7QsiDRgdC10YLQvtC6XG4gICAgICAgIDwvZGl2PlxuXG4gICAgICAgIDwhLS0g0KDQsNC30LzQtdGA0Ysg0YHQtdGC0L7Qui4gLS0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LWJvZHktbVwiPlxuICAgICAgICAgICAgPHR1aS1pY29uIGljb249XCJAdHVpLnNjLmdyaWQtaGVpZ2h0LWFycm93XCIgLz5cbiAgICAgICAgICAgINCS0YvRgdC+0YLQsCDRgdC10YLQvtC6INC+0YIge3sgY29uZmlnKCkubWluSGVpZ2h0IH19INC00L4ge3sgY29uZmlnKCkubWF4SGVpZ2h0c1tuZXRUeXBlSW5kZXhTZWxlY3RlZCgpXSB9fSDQvNC8XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwidGV4dC1ib2R5LW1cIj5cbiAgICAgICAgICAgIDx0dWktaWNvbiBpY29uPVwiQHR1aS5zYy5ncmlkLXdpZHRoLWFycm93XCIgLz5cbiAgICAgICAgICAgINCo0LjRgNC40L3QsCDRgdC10YLQvtC6INC+0YIge3sgY29uZmlnKCkubWluV2lkdGggfX0g0LTQviB7eyBjb25maWcoKS5tYXhXaWR0aHNbbmV0VHlwZUluZGV4U2VsZWN0ZWQoKV0gfX0g0LzQvFxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8IS0tINCi0LXQs9C4INGF0LDRgNCw0LrRgtC10YDQuNGB0YLQuNC6LiAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImZsZXggZmxleC13cmFwIGdhcC0yXCI+XG4gICAgICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICAgICAgKm5nRm9yPVwibGV0IHRhZyBvZiBjb25maWcoKS50YWdzW25ldFR5cGVJbmRleFNlbGVjdGVkKCldXCJcbiAgICAgICAgICAgICAgICB0dWlDaGlwXG4gICAgICAgICAgICAgICAgYXBwZWFyYW5jZT1cIm5ldXRyYWxcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHt7IHRhZyB9fVxuICAgICAgICAgICAgPC9idXR0b24+XG4gICAgICAgIDwvZGl2PlxuXG4gICAgICAgIDwhLS0g0JLRi9Cx0L7RgCDRhtCy0LXRgtCwINC/0YDQvtGE0LjQu9GPLiAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImZsZXggZ2FwLTRcIj5cbiAgICAgICAgICAgIDxwaWN0dXJlXG4gICAgICAgICAgICAgICAgKm5nRm9yPVwibGV0IGltYWdlIG9mIGNvbmZpZygpLmNvbG9yOyBsZXQgaXRlbUluZGV4ID0gaW5kZXhcIlxuICAgICAgICAgICAgICAgICh0dWlIb3ZlcmVkQ2hhbmdlKT1cImNvbG9ySW5kZXguc2V0KGl0ZW1JbmRleClcIlxuICAgICAgICAgICAgICAgIFtjbGFzcy5hY3RpdmVdPVwiY29sb3JJbmRleCgpID09PSBpdGVtSW5kZXhcIlxuICAgICAgICAgICAgICAgIGNsYXNzPVwic2l6ZS0xMSByb3VuZGVkLXhsXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICA8c291cmNlXG4gICAgICAgICAgICAgICAgICAgIHR5cGU9XCJpbWFnZS93ZWJwXCJcbiAgICAgICAgICAgICAgICAgICAgW3NyY3NldF09XCJjb25maWcoKS5jb2xvcnNJY29uc1tpbWFnZV0ud2VicFwiXG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICA8aW1nXG4gICAgICAgICAgICAgICAgICAgIFtzcmNdPVwiY29uZmlnKCkuY29sb3JzSWNvbnNbaW1hZ2VdLmRlZmF1bHRGb3JtYXRcIlxuICAgICAgICAgICAgICAgICAgICBbYWx0XT1cImNvbmZpZygpLmNvbG9yc0ljb25zW2ltYWdlXS5hbHQgPz8gZGVzY3JpcHRpb25zWydjb2xvciddW2l0ZW1JbmRleF1cIlxuICAgICAgICAgICAgICAgICAgICBjbGFzcz1cInNpemUtMTEgcm91bmRlZC14bFwiXG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgIDwvcGljdHVyZT5cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgPCEtLSDQmtC90L7Qv9C60Lgg0LTQtdC50YHRgtCy0LjQuS4gLS0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJmbGV4IGdhcC0yXCI+XG4gICAgICAgICAgICA8YVxuICAgICAgICAgICAgICAgIHR1aUJ1dHRvblxuICAgICAgICAgICAgICAgIFthdHRyLmhyZWZdPVwiY29uZmlndXJhdG9yUGFnZVVybCgpXCJcbiAgICAgICAgICAgICAgICAoY2xpY2spPVwiJGV2ZW50LnByZXZlbnREZWZhdWx0KCk7IG9wZW5Db25maWd1cmF0b3JDbGljay5lbWl0KClcIlxuICAgICAgICAgICAgICAgIGljb25TdGFydD1cIkB0dWkuc2xpZGVycy1ob3Jpem9udGFsXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICDQodC00LXQu9Cw0YLRjCDRgNCw0YHRh9C10YJcbiAgICAgICAgICAgIDwvYT5cblxuICAgICAgICAgICAgPGJ1dHRvblxuICAgICAgICAgICAgICAgIHR1aUJ1dHRvblxuICAgICAgICAgICAgICAgIChjbGljayk9XCJvcGVuQ29uc3VsdGF0aW9uQ2xpY2suZW1pdCgpXCJcbiAgICAgICAgICAgICAgICBpY29uU3RhcnQ9XCJAdHVpLm1lc3NhZ2VzLXNxdWFyZVwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAg0JrQvtC90YHRg9C70YzRgtCw0YbQuNGPXG4gICAgICAgICAgICA8L2J1dHRvbj5cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG5cbiAgICA8IS0tINCf0YDQsNCy0LDRjyDQutC+0LvQvtC90LrQsCDRgSDQutCw0YDRg9GB0LXQu9GM0Y4g0LjQt9C+0LHRgNCw0LbQtdC90LjQuS4gLS0+XG4gICAgPGRpdiBjbGFzcz1cInJlbGF0aXZlIC1vcmRlci0xIGgtWzE5ZW1dIGZsZXgtMSBvdmVyZmxvdy1oaWRkZW4gcm91bmRlZC14bCBzaGFkb3ctdHVpLXNoYWRvdyBtZDpoLTk2IGxnOm9yZGVyLTIgbGc6aC1bMjhyZW1dXCI+XG4gICAgICAgIDxidXR0b25cbiAgICAgICAgICAgIHR1aUljb25CdXR0b25cbiAgICAgICAgICAgIGljb25TdGFydD1cIkB0dWkuY2hldnJvbi1sZWZ0XCJcbiAgICAgICAgICAgIChjbGljayk9XCJjYXJvdXNlbC5wcmV2KClcIlxuICAgICAgICAgICAgYXBwZWFyYW5jZT1cImljb25cIlxuICAgICAgICAgICAgY2xhc3M9XCIhYWJzb2x1dGUgbGVmdC0wIHRvcC0xLzIgei0xMCBtbC0yIC10cmFuc2xhdGUteS0xLzJcIlxuICAgICAgICA+PC9idXR0b24+XG5cbiAgICAgICAgPHR1aS1jYXJvdXNlbFxuICAgICAgICAgICAgI2Nhcm91c2VsXG4gICAgICAgICAgICBbZHVyYXRpb25dPVwiYXV0b1NsaWRlSW50ZXJ2YWxlKClcIlxuICAgICAgICAgICAgY2xhc3M9XCJoLVsxOWVtXSB3LWZ1bGwgbWQ6aC05NiBsZzpoLVsyOHJlbV1cIlxuICAgICAgICA+XG4gICAgICAgICAgICBAZm9yIChpdGVtIG9mIGNvbmZpZygpLmltYWdlUHJldmlld3NCeUNvbG9yW2NvbG9ySW5kZXhTZWxlY3RlZCgpXTsgdHJhY2sgJGluZGV4KSB7XG4gICAgICAgICAgICAgICAgPHBpY3R1cmUgKnR1aUl0ZW0+XG4gICAgICAgICAgICAgICAgICAgIDxzb3VyY2VcbiAgICAgICAgICAgICAgICAgICAgICAgIHR5cGU9XCJpbWFnZS93ZWJwXCJcbiAgICAgICAgICAgICAgICAgICAgICAgIFtzcmNzZXRdPVwiaXRlbS53ZWJwXCJcbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgICAgPGltZ1xuICAgICAgICAgICAgICAgICAgICAgICAgW2FsdF09XCJpdGVtLmFsdCA/PyBkZXNjcmlwdGlvbnNbJ2NvbG9yJ11bY29sb3JJbmRleFNlbGVjdGVkKCldXCJcbiAgICAgICAgICAgICAgICAgICAgICAgIFtzcmNdPVwiaXRlbS5kZWZhdWx0Rm9ybWF0XCJcbiAgICAgICAgICAgICAgICAgICAgICAgIGNsYXNzPVwiaC1bMTllbV0gdy1mdWxsIG9iamVjdC1jb3ZlciBvYmplY3QtY2VudGVyIG1kOmgtOTYgbGc6aC1bMjhyZW1dXCJcbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICA8L3BpY3R1cmU+XG4gICAgICAgICAgICB9XG4gICAgICAgIDwvdHVpLWNhcm91c2VsPlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICB0dWlJY29uQnV0dG9uXG4gICAgICAgICAgICBpY29uU3RhcnQ9XCJAdHVpLmNoZXZyb24tcmlnaHRcIlxuICAgICAgICAgICAgKGNsaWNrKT1cImNhcm91c2VsLm5leHQoKVwiXG4gICAgICAgICAgICBhcHBlYXJhbmNlPVwiaWNvblwiXG4gICAgICAgICAgICBjbGFzcz1cIiFhYnNvbHV0ZSByaWdodC0wIHRvcC0xLzIgei0xMCBtci0yIC10cmFuc2xhdGUteS0xLzJcIlxuICAgICAgICA+PC9idXR0b24+XG4gICAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==

package/fesm2022/snabcentr-client-ui.mjs

@@ -4323,7 +4323,7 @@ class ScAddOrEditingCartItemFormComponent {
         /**
          * Минимальный метраж для товара.
          */
-        this.minLength = computed(() => this.product().properties?.minLength ?? (this.product().ignoreMinCountCheck ? 0 : this.product().minCount));
+        this.minLength = computed(() => this.product().properties?.minLength ?? (this.product().ignoreMinCountCheck ? 0 : this.product().minCount) ?? 1);
         /**
          * Максимальный метраж для товара.
          */
@@ -4338,8 +4338,8 @@ class ScAddOrEditingCartItemFormComponent {
         this.lengthHint = computed(() => {
             const min = this.minLength();
             const max = this.maxLength();
-            // eslint-disable-next-line sonarjs/no-nested-conditional, sonarjs/prefer-nullish-coalescing
-            return min || max ? `(${min ? `от ${min}` : ''}${min && max ? ' ' : ''}${max ? `до ${max}` : ''} ${this.product().unit})` : '';
+            // eslint-disable-next-line sonarjs/no-nested-conditional, @typescript-eslint/no-unnecessary-condition
+            return (min ?? max) ? `(${min ? `от ${min}` : ''}${min && max ? ' ' : ''}${max ? `до ${max}` : ''} ${this.product().unit})` : '';
         });
         /**
          * {@link Output} события добавления товара в корзину.
@@ -4370,13 +4370,10 @@ class ScAddOrEditingCartItemFormComponent {
         });
         if (this.productIsMeasurable()) {
             // Добавляем поле ввода длины, если товар измеряемый.
-            this.form.addControl('length', new FormControl(this.cartItem()?.length ?? this.minLength() ?? 0.01, [Validators.required, Validators.min(0.01)]));
+            this.form.addControl('length', new FormControl(this.cartItem()?.length ?? this.minLength(), [Validators.required, Validators.min(0.01)]));
         }
         // Устанавливаем количество из корзины или кратности товара.
-        this.form.patchValue({
-            quantity: this.cartItem()?.quantity ?? this.unitsHelper.productMultiplicity(this.product()),
-            marker: this.cartItem()?.marker ?? '',
-        });
+        this.form.controls.quantity.patchValue(this.cartItem()?.quantity ?? this.unitsHelper.productMultiplicity(this.product()));
         const step = this.lengthStep();
         if (this.isLengthConfigurator() && this.lengthStep() && this.form.controls.quantity.value && step) {
             // Если есть конфигуратор длины, рассчитываем начально значение длины.
@@ -4423,7 +4420,7 @@ class ScAddOrEditingCartItemFormComponent {
             return;
         }
         const length = lengthControl.value ?? 0;
-        let newLength = Math.max(this.minLength() ?? step, length + step);
+        let newLength = Math.max(this.minLength(), length + step);
         // Округляем до ближайшего кратного числа.
         newLength = Math.round(newLength / step) * step;
         lengthControl.setValue(Number(newLength.toFixed(2)));
@@ -6749,11 +6746,11 @@ class ScPreviewSampleComponent {
         this.isReverse = input(false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ScPreviewSampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ScPreviewSampleComponent, selector: "sc-preview-sample", inputs: { index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, sample: { classPropertyName: "sample", publicName: "sample", isSignal: true, isRequired: true, transformFunction: null }, isShowCarouselSwitches: { classPropertyName: "isShowCarouselSwitches", publicName: "isShowCarouselSwitches", isSignal: true, isRequired: false, transformFunction: null }, isReverse: { classPropertyName: "isReverse", publicName: "isReverse", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { index: "indexChange" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<div\n    *ngIf=\"sample() as sample\"\n    class=\"mb-4 flex flex-col-reverse gap-4 md:mb-0 md:flex-row md:gap-8\"\n    [class.md:!flex-row-reverse]=\"isReverse()\"\n>\n    @let isShownSwitches = sample.items && sample.items.length > 1;\n\n    <div class=\"flex max-w-96 flex-1 flex-col justify-center self-center md:max-w-none md:gap-4\">\n        <div class=\"flex w-full flex-col gap-3 md:gap-4 md:px-8\">\n            <div class=\"text-body-l-bold\">{{ sample.title }}</div>\n            <div\n                *ngIf=\"isShownSwitches\"\n                class=\"flex gap-4\"\n            >\n                <tui-avatar\n                    [src]=\"item.buttonImageUrl\"\n                    [round]=\"false\"\n                    *ngFor=\"let item of sample.items; let itemIndex = index\"\n                    (tuiHoveredChange)=\"index.set(itemIndex)\"\n                    [class.active]=\"index() === itemIndex\"\n                ></tui-avatar>\n            </div>\n            <div\n                *ngIf=\"sample.items as items\"\n                class=\"text-body-m-bold\"\n            >\n                {{ items[index()].color }}\n            </div>\n            <div>{{ sample.description }}</div>\n            <img\n                *ngIf=\"sample.descriptionImageUrl\"\n                [src]=\"sample.descriptionImageUrl\"\n                alt=\"\u041A\u043E\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F \u043E\u0431\u0440\u0430\u0437\u0446\u0430 {{ sample.title }}\"\n                class=\"w-fit\"\n            />\n            <div\n                *ngIf=\"sample.items && sample.items[index()].actions?.length\"\n                class=\"flex flex-wrap gap-3 md:gap-4\"\n            >\n                <a\n                    *ngFor=\"let action of sample.items[index()].actions\"\n                    tuiButton\n                    [attr.href]=\"action.href\"\n                    (click)=\"action.handler ? $event.preventDefault() : {}; action.handler?.()\"\n                    [iconStart]=\"action.icon\"\n                    appearance=\"secondary\"\n                >\n                    {{ action.label }}\n                </a>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"relative h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:h-[28rem]\">\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.prev()\"\n            iconStart=\"@tui.chevron-left\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [(index)]=\"index\"\n            [duration]=\"duration()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            <ng-container *ngFor=\"let item of sample.items\">\n                <div\n                    *tuiItem\n                    [style.backgroundImage]=\"'url(' + item.carouselItemImage + ')'\"\n                    class=\"h-[19em] w-full bg-cover bg-right md:h-96 lg:h-[28rem]\"\n                ></div>\n            </ng-container>\n        </tui-carousel>\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.next()\"\n            iconStart=\"@tui.chevron-right\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}tui-avatar.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}\n"], dependencies: [{ kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "component", type: i2$1.TuiCarouselComponent, selector: "tui-carousel", inputs: ["draggable", "itemsCount", "index"], outputs: ["indexChange", "shift"] }, { kind: "component", type: i2$1.TuiAvatar, selector: "tui-avatar,button[tuiAvatar],a[tuiAvatar]", inputs: ["size", "round", "src"] }, { kind: "directive", type: i7.TuiHovered, selector: "[tuiHoveredChange]", outputs: ["tuiHoveredChange"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ScPreviewSampleComponent, selector: "sc-preview-sample", inputs: { index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, sample: { classPropertyName: "sample", publicName: "sample", isSignal: true, isRequired: true, transformFunction: null }, isShowCarouselSwitches: { classPropertyName: "isShowCarouselSwitches", publicName: "isShowCarouselSwitches", isSignal: true, isRequired: false, transformFunction: null }, isReverse: { classPropertyName: "isReverse", publicName: "isReverse", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { index: "indexChange" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<div\n    *ngIf=\"sample() as sample\"\n    class=\"mb-4 flex flex-col-reverse gap-4 md:mb-0 md:flex-row md:gap-8\"\n    [class.md:!flex-row-reverse]=\"isReverse()\"\n>\n    @let isShownSwitches = sample.items && sample.items.length > 1;\n\n    <div class=\"flex max-w-96 flex-1 flex-col justify-center self-center md:max-w-none md:gap-4\">\n        <div class=\"flex w-full flex-col gap-3 md:gap-4 md:px-8\">\n            <div class=\"text-body-l-bold\">{{ sample.title }}</div>\n            <div\n                *ngIf=\"isShownSwitches\"\n                class=\"flex gap-4\"\n            >\n                <tui-avatar\n                    [round]=\"false\"\n                    *ngFor=\"let item of sample.items; let itemIndex = index\"\n                    (tuiHoveredChange)=\"index.set(itemIndex)\"\n                    [class.active]=\"index() === itemIndex\"\n                >\n                    <picture>\n                        <source\n                            type=\"image/webp\"\n                            [srcset]=\"item.buttonImageUrl.webp\"\n                        />\n                        <img\n                            [src]=\"item.buttonImageUrl.defaultFormat\"\n                            [alt]=\"item.buttonImageUrl.alt ?? '\u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u043A\u043D\u043E\u043F\u043A\u0438 \u043F\u0435\u0440\u0435\u043A\u043B\u044E\u0447\u0430\u0442\u0435\u043B\u044F ' + sample.title\"\n                        />\n                    </picture>\n                </tui-avatar>\n            </div>\n            <div\n                *ngIf=\"sample.items as items\"\n                class=\"text-body-m-bold\"\n            >\n                {{ items[index()].color }}\n            </div>\n            <div>{{ sample.description }}</div>\n            <img\n                *ngIf=\"sample.descriptionImageUrl\"\n                [src]=\"sample.descriptionImageUrl\"\n                alt=\"\u041A\u043E\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F \u043E\u0431\u0440\u0430\u0437\u0446\u0430 {{ sample.title }}\"\n                class=\"w-fit\"\n            />\n            <div\n                *ngIf=\"sample.items && sample.items[index()].actions?.length\"\n                class=\"flex flex-wrap gap-3 md:gap-4\"\n            >\n                <a\n                    *ngFor=\"let action of sample.items[index()].actions\"\n                    tuiButton\n                    [attr.href]=\"action.href\"\n                    (click)=\"action.handler ? $event.preventDefault() : {}; action.handler?.()\"\n                    [iconStart]=\"action.icon\"\n                    appearance=\"secondary\"\n                >\n                    {{ action.label }}\n                </a>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"relative h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:h-[28rem]\">\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.prev()\"\n            iconStart=\"@tui.chevron-left\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [(index)]=\"index\"\n            [duration]=\"duration()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            <ng-container *ngFor=\"let item of sample.items\">\n                <picture *tuiItem>\n                    <source\n                        type=\"image/webp\"\n                        [srcset]=\"item.carouselItemImage.webp\"\n                    />\n                    <img\n                        [src]=\"item.carouselItemImage.defaultFormat\"\n                        [alt]=\"item.carouselItemImage.alt ?? '\u041A\u043E\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F \u043E\u0431\u0440\u0430\u0437\u0446\u0430 ' + sample.title\"\n                        class=\"h-[19em] w-full object-cover object-right md:h-96 lg:h-[28rem]\"\n                    />\n                </picture>\n            </ng-container>\n        </tui-carousel>\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.next()\"\n            iconStart=\"@tui.chevron-right\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}tui-avatar.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}\n"], dependencies: [{ kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "component", type: i2$1.TuiCarouselComponent, selector: "tui-carousel", inputs: ["draggable", "itemsCount", "index"], outputs: ["indexChange", "shift"] }, { kind: "component", type: i2$1.TuiAvatar, selector: "tui-avatar,button[tuiAvatar],a[tuiAvatar]", inputs: ["size", "round", "src"] }, { kind: "directive", type: i7.TuiHovered, selector: "[tuiHoveredChange]", outputs: ["tuiHoveredChange"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ScPreviewSampleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-preview-sample', host: { ngSkipHydration: 'true' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    *ngIf=\"sample() as sample\"\n    class=\"mb-4 flex flex-col-reverse gap-4 md:mb-0 md:flex-row md:gap-8\"\n    [class.md:!flex-row-reverse]=\"isReverse()\"\n>\n    @let isShownSwitches = sample.items && sample.items.length > 1;\n\n    <div class=\"flex max-w-96 flex-1 flex-col justify-center self-center md:max-w-none md:gap-4\">\n        <div class=\"flex w-full flex-col gap-3 md:gap-4 md:px-8\">\n            <div class=\"text-body-l-bold\">{{ sample.title }}</div>\n            <div\n                *ngIf=\"isShownSwitches\"\n                class=\"flex gap-4\"\n            >\n                <tui-avatar\n                    [src]=\"item.buttonImageUrl\"\n                    [round]=\"false\"\n                    *ngFor=\"let item of sample.items; let itemIndex = index\"\n                    (tuiHoveredChange)=\"index.set(itemIndex)\"\n                    [class.active]=\"index() === itemIndex\"\n                ></tui-avatar>\n            </div>\n            <div\n                *ngIf=\"sample.items as items\"\n                class=\"text-body-m-bold\"\n            >\n                {{ items[index()].color }}\n            </div>\n            <div>{{ sample.description }}</div>\n            <img\n                *ngIf=\"sample.descriptionImageUrl\"\n                [src]=\"sample.descriptionImageUrl\"\n                alt=\"\u041A\u043E\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F \u043E\u0431\u0440\u0430\u0437\u0446\u0430 {{ sample.title }}\"\n                class=\"w-fit\"\n            />\n            <div\n                *ngIf=\"sample.items && sample.items[index()].actions?.length\"\n                class=\"flex flex-wrap gap-3 md:gap-4\"\n            >\n                <a\n                    *ngFor=\"let action of sample.items[index()].actions\"\n                    tuiButton\n                    [attr.href]=\"action.href\"\n                    (click)=\"action.handler ? $event.preventDefault() : {}; action.handler?.()\"\n                    [iconStart]=\"action.icon\"\n                    appearance=\"secondary\"\n                >\n                    {{ action.label }}\n                </a>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"relative h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:h-[28rem]\">\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.prev()\"\n            iconStart=\"@tui.chevron-left\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [(index)]=\"index\"\n            [duration]=\"duration()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            <ng-container *ngFor=\"let item of sample.items\">\n                <div\n                    *tuiItem\n                    [style.backgroundImage]=\"'url(' + item.carouselItemImage + ')'\"\n                    class=\"h-[19em] w-full bg-cover bg-right md:h-96 lg:h-[28rem]\"\n                ></div>\n            </ng-container>\n        </tui-carousel>\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.next()\"\n            iconStart=\"@tui.chevron-right\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}tui-avatar.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}\n"] }]
+            args: [{ selector: 'sc-preview-sample', host: { ngSkipHydration: 'true' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    *ngIf=\"sample() as sample\"\n    class=\"mb-4 flex flex-col-reverse gap-4 md:mb-0 md:flex-row md:gap-8\"\n    [class.md:!flex-row-reverse]=\"isReverse()\"\n>\n    @let isShownSwitches = sample.items && sample.items.length > 1;\n\n    <div class=\"flex max-w-96 flex-1 flex-col justify-center self-center md:max-w-none md:gap-4\">\n        <div class=\"flex w-full flex-col gap-3 md:gap-4 md:px-8\">\n            <div class=\"text-body-l-bold\">{{ sample.title }}</div>\n            <div\n                *ngIf=\"isShownSwitches\"\n                class=\"flex gap-4\"\n            >\n                <tui-avatar\n                    [round]=\"false\"\n                    *ngFor=\"let item of sample.items; let itemIndex = index\"\n                    (tuiHoveredChange)=\"index.set(itemIndex)\"\n                    [class.active]=\"index() === itemIndex\"\n                >\n                    <picture>\n                        <source\n                            type=\"image/webp\"\n                            [srcset]=\"item.buttonImageUrl.webp\"\n                        />\n                        <img\n                            [src]=\"item.buttonImageUrl.defaultFormat\"\n                            [alt]=\"item.buttonImageUrl.alt ?? '\u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u043A\u043D\u043E\u043F\u043A\u0438 \u043F\u0435\u0440\u0435\u043A\u043B\u044E\u0447\u0430\u0442\u0435\u043B\u044F ' + sample.title\"\n                        />\n                    </picture>\n                </tui-avatar>\n            </div>\n            <div\n                *ngIf=\"sample.items as items\"\n                class=\"text-body-m-bold\"\n            >\n                {{ items[index()].color }}\n            </div>\n            <div>{{ sample.description }}</div>\n            <img\n                *ngIf=\"sample.descriptionImageUrl\"\n                [src]=\"sample.descriptionImageUrl\"\n                alt=\"\u041A\u043E\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F \u043E\u0431\u0440\u0430\u0437\u0446\u0430 {{ sample.title }}\"\n                class=\"w-fit\"\n            />\n            <div\n                *ngIf=\"sample.items && sample.items[index()].actions?.length\"\n                class=\"flex flex-wrap gap-3 md:gap-4\"\n            >\n                <a\n                    *ngFor=\"let action of sample.items[index()].actions\"\n                    tuiButton\n                    [attr.href]=\"action.href\"\n                    (click)=\"action.handler ? $event.preventDefault() : {}; action.handler?.()\"\n                    [iconStart]=\"action.icon\"\n                    appearance=\"secondary\"\n                >\n                    {{ action.label }}\n                </a>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"relative h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:h-[28rem]\">\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.prev()\"\n            iconStart=\"@tui.chevron-left\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [(index)]=\"index\"\n            [duration]=\"duration()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            <ng-container *ngFor=\"let item of sample.items\">\n                <picture *tuiItem>\n                    <source\n                        type=\"image/webp\"\n                        [srcset]=\"item.carouselItemImage.webp\"\n                    />\n                    <img\n                        [src]=\"item.carouselItemImage.defaultFormat\"\n                        [alt]=\"item.carouselItemImage.alt ?? '\u041A\u043E\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u044F \u043E\u0431\u0440\u0430\u0437\u0446\u0430 ' + sample.title\"\n                        class=\"h-[19em] w-full object-cover object-right md:h-96 lg:h-[28rem]\"\n                    />\n                </picture>\n            </ng-container>\n        </tui-carousel>\n        <button\n            *ngIf=\"isShownSwitches && isShowCarouselSwitches()\"\n            tuiIconButton\n            (click)=\"carousel.next()\"\n            iconStart=\"@tui.chevron-right\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}tui-avatar.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}\n"] }]
         }] });
 
 /**
@@ -6803,11 +6800,11 @@ class ScPreviewSamplesMosquitoComponent {
         this.isShowCarouselSwitches = input(!inject(TUI_IS_MOBILE));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ScPreviewSamplesMosquitoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ScPreviewSamplesMosquitoComponent, isStandalone: true, selector: "sc-preview-samples-mosquito", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, configuratorPageUrl: { classPropertyName: "configuratorPageUrl", publicName: "configuratorPageUrl", isSignal: true, isRequired: false, transformFunction: null }, autoSlideIntervale: { classPropertyName: "autoSlideIntervale", publicName: "autoSlideIntervale", isSignal: true, isRequired: false, transformFunction: null }, isShowCarouselSwitches: { classPropertyName: "isShowCarouselSwitches", publicName: "isShowCarouselSwitches", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openConfiguratorClick: "openConfiguratorClick", openConsultationClick: "openConsultationClick" }, ngImport: i0, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <img\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                [src]=\"config().colorsIcons[image]\"\n                [alt]=\"descriptions['color'][itemIndex]\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            />\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <div\n                    *tuiItem\n                    [style.backgroundImage]=\"'url(' + item + ')'\"\n                    class=\"h-[19em] w-full bg-cover bg-right md:h-96 lg:h-[28rem]\"\n                ></div>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"], dependencies: [{ kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "component", type: i2$1.TuiCarouselComponent, selector: "tui-carousel", inputs: ["draggable", "itemsCount", "index"], outputs: ["indexChange", "shift"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "directive", type: TuiBadge, selector: "tui-badge,[tuiBadge]", inputs: ["size"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TuiHovered, selector: "[tuiHoveredChange]", outputs: ["tuiHoveredChange"] }, { kind: "directive", type: TuiCardLarge, selector: "[tuiCardLarge]", inputs: ["tuiCardLarge"] }, { kind: "directive", type: TuiHeader, selector: "[tuiHeader]", inputs: ["tuiHeader"] }, { kind: "directive", type: TuiSurface, selector: "[tuiSurface]", inputs: ["tuiSurface"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ScPreviewSamplesMosquitoComponent, isStandalone: true, selector: "sc-preview-samples-mosquito", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, configuratorPageUrl: { classPropertyName: "configuratorPageUrl", publicName: "configuratorPageUrl", isSignal: true, isRequired: false, transformFunction: null }, autoSlideIntervale: { classPropertyName: "autoSlideIntervale", publicName: "autoSlideIntervale", isSignal: true, isRequired: false, transformFunction: null }, isShowCarouselSwitches: { classPropertyName: "isShowCarouselSwitches", publicName: "isShowCarouselSwitches", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openConfiguratorClick: "openConfiguratorClick", openConsultationClick: "openConsultationClick" }, ngImport: i0, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <picture\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            >\n                <source\n                    type=\"image/webp\"\n                    [srcset]=\"config().colorsIcons[image].webp\"\n                />\n                <img\n                    [src]=\"config().colorsIcons[image].defaultFormat\"\n                    [alt]=\"config().colorsIcons[image].alt ?? descriptions['color'][itemIndex]\"\n                    class=\"size-11 rounded-xl\"\n                />\n            </picture>\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <picture *tuiItem>\n                    <source\n                        type=\"image/webp\"\n                        [srcset]=\"item.webp\"\n                    />\n                    <img\n                        [alt]=\"item.alt ?? descriptions['color'][colorIndexSelected()]\"\n                        [src]=\"item.defaultFormat\"\n                        class=\"h-[19em] w-full object-cover object-center md:h-96 lg:h-[28rem]\"\n                    />\n                </picture>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"], dependencies: [{ kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "component", type: i2$1.TuiCarouselComponent, selector: "tui-carousel", inputs: ["draggable", "itemsCount", "index"], outputs: ["indexChange", "shift"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "directive", type: TuiBadge, selector: "tui-badge,[tuiBadge]", inputs: ["size"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: TuiHovered, selector: "[tuiHoveredChange]", outputs: ["tuiHoveredChange"] }, { kind: "directive", type: TuiCardLarge, selector: "[tuiCardLarge]", inputs: ["tuiCardLarge"] }, { kind: "directive", type: TuiHeader, selector: "[tuiHeader]", inputs: ["tuiHeader"] }, { kind: "directive", type: TuiSurface, selector: "[tuiSurface]", inputs: ["tuiSurface"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ScPreviewSamplesMosquitoComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'sc-preview-samples-mosquito', imports: [TuiCarousel, TuiButton, TuiIcon, TuiChip, TuiBadge, NgFor, TuiAppearance, TuiHovered, TuiCardLarge, TuiHeader, TuiIcon, TuiSurface], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <img\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                [src]=\"config().colorsIcons[image]\"\n                [alt]=\"descriptions['color'][itemIndex]\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            />\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <div\n                    *tuiItem\n                    [style.backgroundImage]=\"'url(' + item + ')'\"\n                    class=\"h-[19em] w-full bg-cover bg-right md:h-96 lg:h-[28rem]\"\n                ></div>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"] }]
+            args: [{ standalone: true, selector: 'sc-preview-samples-mosquito', imports: [TuiCarousel, TuiButton, TuiIcon, TuiChip, TuiBadge, NgFor, TuiAppearance, TuiHovered, TuiCardLarge, TuiHeader, TuiIcon, TuiSurface], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let descriptions = config().descriptions;\n@let colors = config().color;\n@let netTypes = config().netType;\n\n<!-- \u041E\u0441\u043D\u043E\u0432\u043D\u043E\u0439 \u043A\u043E\u043D\u0442\u0435\u0439\u043D\u0435\u0440 \u0441 \u0441\u0435\u0442\u043A\u043E\u0439. -->\n<div class=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n    <!-- \u041B\u0435\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0435\u0439. -->\n    <div class=\"flex flex-col gap-4\">\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0432\u044B\u0431\u043E\u0440\u0430 \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"flex flex-wrap gap-4\">\n            <button\n                *ngFor=\"let item of netTypes; let itemIndex = index\"\n                tuiCardLarge\n                tuiHeader\n                tuiSurface=\"floating\"\n                type=\"button\"\n                (click)=\"netTypeIndex.set(itemIndex)\"\n                [class.active]=\"netTypeIndex() === itemIndex\"\n                class=\"h-12 !items-center gap-2 !rounded-xl !px-4 !py-0\"\n            >\n                <img\n                    [src]=\"config().icons[item]\"\n                    [alt]=\"descriptions['netType'][item]\"\n                    class=\"size-8\"\n                />\n                <div>{{ descriptions['netType'][item] }}</div>\n            </button>\n        </div>\n\n        <!-- \u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043D\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0441\u0435\u0442\u043A\u0438. -->\n        <div class=\"text-body-l-bold\">\u0421\u0435\u0442\u043A\u0430 {{ descriptions['netType'][netTypeIndexSelected()] }}</div>\n        {{ config().subtitles[netTypeIndexSelected()] }}\n\n        <!-- \u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u043E\u043D\u043D\u044B\u0435 \u0431\u0435\u0439\u0434\u0436\u0438. -->\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ colors.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0446\u0432\u0435\u0442\u043E\u0432 \u043F\u0440\u043E\u0444\u0438\u043B\u044F\n        </div>\n        <div class=\"flex flex-wrap items-center gap-1 text-body-m\">\n            <tui-badge\n                appearance=\"custom\"\n                class=\"rounded-full border-2 border-solid border-tui-text-primary bg-white !p-[0.4rem] font-bold text-tui-text-primary\"\n            >\n                {{ netTypes.length }}\n            </tui-badge>\n            - \u043A\u043E\u043B\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0442\u0438\u043F\u043E\u0432 \u0441\u0435\u0442\u043E\u043A\n        </div>\n\n        <!-- \u0420\u0430\u0437\u043C\u0435\u0440\u044B \u0441\u0435\u0442\u043E\u043A. -->\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-height-arrow\" />\n            \u0412\u044B\u0441\u043E\u0442\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minHeight }} \u0434\u043E {{ config().maxHeights[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n        <div class=\"text-body-m\">\n            <tui-icon icon=\"@tui.sc.grid-width-arrow\" />\n            \u0428\u0438\u0440\u0438\u043D\u0430 \u0441\u0435\u0442\u043E\u043A \u043E\u0442 {{ config().minWidth }} \u0434\u043E {{ config().maxWidths[netTypeIndexSelected()] }} \u043C\u043C\n        </div>\n\n        <!-- \u0422\u0435\u0433\u0438 \u0445\u0430\u0440\u0430\u043A\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043A. -->\n        <div class=\"flex flex-wrap gap-2\">\n            <button\n                *ngFor=\"let tag of config().tags[netTypeIndexSelected()]\"\n                tuiChip\n                appearance=\"neutral\"\n            >\n                {{ tag }}\n            </button>\n        </div>\n\n        <!-- \u0412\u044B\u0431\u043E\u0440 \u0446\u0432\u0435\u0442\u0430 \u043F\u0440\u043E\u0444\u0438\u043B\u044F. -->\n        <div class=\"flex gap-4\">\n            <picture\n                *ngFor=\"let image of config().color; let itemIndex = index\"\n                (tuiHoveredChange)=\"colorIndex.set(itemIndex)\"\n                [class.active]=\"colorIndex() === itemIndex\"\n                class=\"size-11 rounded-xl\"\n            >\n                <source\n                    type=\"image/webp\"\n                    [srcset]=\"config().colorsIcons[image].webp\"\n                />\n                <img\n                    [src]=\"config().colorsIcons[image].defaultFormat\"\n                    [alt]=\"config().colorsIcons[image].alt ?? descriptions['color'][itemIndex]\"\n                    class=\"size-11 rounded-xl\"\n                />\n            </picture>\n        </div>\n\n        <!-- \u041A\u043D\u043E\u043F\u043A\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439. -->\n        <div class=\"flex gap-2\">\n            <a\n                tuiButton\n                [attr.href]=\"configuratorPageUrl()\"\n                (click)=\"$event.preventDefault(); openConfiguratorClick.emit()\"\n                iconStart=\"@tui.sliders-horizontal\"\n            >\n                \u0421\u0434\u0435\u043B\u0430\u0442\u044C \u0440\u0430\u0441\u0447\u0435\u0442\n            </a>\n\n            <button\n                tuiButton\n                (click)=\"openConsultationClick.emit()\"\n                iconStart=\"@tui.messages-square\"\n            >\n                \u041A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u044F\n            </button>\n        </div>\n    </div>\n\n    <!-- \u041F\u0440\u0430\u0432\u0430\u044F \u043A\u043E\u043B\u043E\u043D\u043A\u0430 \u0441 \u043A\u0430\u0440\u0443\u0441\u0435\u043B\u044C\u044E \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0439. -->\n    <div class=\"relative -order-1 h-[19em] flex-1 overflow-hidden rounded-xl shadow-tui-shadow md:h-96 lg:order-2 lg:h-[28rem]\">\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-left\"\n            (click)=\"carousel.prev()\"\n            appearance=\"icon\"\n            class=\"!absolute left-0 top-1/2 z-10 ml-2 -translate-y-1/2\"\n        ></button>\n\n        <tui-carousel\n            #carousel\n            [duration]=\"autoSlideIntervale()\"\n            class=\"h-[19em] w-full md:h-96 lg:h-[28rem]\"\n        >\n            @for (item of config().imagePreviewsByColor[colorIndexSelected()]; track $index) {\n                <picture *tuiItem>\n                    <source\n                        type=\"image/webp\"\n                        [srcset]=\"item.webp\"\n                    />\n                    <img\n                        [alt]=\"item.alt ?? descriptions['color'][colorIndexSelected()]\"\n                        [src]=\"item.defaultFormat\"\n                        class=\"h-[19em] w-full object-cover object-center md:h-96 lg:h-[28rem]\"\n                    />\n                </picture>\n            }\n        </tui-carousel>\n        <button\n            tuiIconButton\n            iconStart=\"@tui.chevron-right\"\n            (click)=\"carousel.next()\"\n            appearance=\"icon\"\n            class=\"!absolute right-0 top-1/2 z-10 mr-2 -translate-y-1/2\"\n        ></button>\n    </div>\n</div>\n", styles: [":host{--tui-carousel-padding: 0}img.active{--tw-ring-color: var(--tui-background-accent-1);--tw-ring-offset-width: 2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}button[tuicardlarge]{border:solid 2px white}button[tuicardlarge].active{border-color:var(--tui-background-accent-1)}\n"] }]
         }] });
 
 /**