@colijnit/product 258.1.0 → 258.1.2

package/fesm2015/colijnit-product.js

@@ -1,7 +1,10 @@
 import * as i0 from '@angular/core';
-import { Injectable, Directive, EventEmitter, Component, ViewEncapsulation, ChangeDetectorRef, Input, Output, Renderer2, ViewChild, ElementRef, Pipe, NgModule, ChangeDetectionStrategy, HostListener, HostBinding, SecurityContext, CUSTOM_ELEMENTS_SCHEMA, Inject, PLATFORM_ID, NO_ERRORS_SCHEMA } from '@angular/core';
+import { Directive, Injectable, EventEmitter, Component, ViewEncapsulation, Input, Output, Renderer2, ChangeDetectorRef, ViewChild, ElementRef, Pipe, NgModule, ChangeDetectionStrategy, HostListener, HostBinding, SecurityContext, CUSTOM_ELEMENTS_SCHEMA, Inject, PLATFORM_ID, NO_ERRORS_SCHEMA } from '@angular/core';
 import { __awaiter } from 'tslib';
 import { Subject, BehaviorSubject } from 'rxjs';
+import * as i1 from '@angular/common/http';
+import { HttpClient } from '@angular/common/http';
+import { StringUtils } from '@colijnit/ioneconnector/build/utils/string-utils';
 import { Options } from '@colijnit/ioneconnector/build/model/options';
 import { ArticleFullObject } from '@colijnit/articleapi/build/model/article-full-object';
 import { SuperArticle } from '@colijnit/articleapi/build/model/super-article';
@@ -13,9 +16,6 @@ import { Transaction } from '@colijnit/transactionapi/build/transaction';
 import { MainApi } from '@colijnit/mainapi';
 import { TransactionInfoResponse } from '@colijnit/transactionapi/build/model/transaction-info-response.bo';
 import { ArticleListObjectExtended } from '@colijnit/articleapi/build/model/article-list-object-extended.bo';
-import * as i1 from '@angular/common/http';
-import { HttpClient } from '@angular/common/http';
-import { StringUtils } from '@colijnit/ioneconnector/build/utils/string-utils';
 import { CommonModule, isPlatformBrowser } from '@angular/common';
 import { trigger, state, style, transition, animate } from '@angular/animations';
 import * as i1$1 from '@angular/platform-browser';
@@ -23,84 +23,15 @@ import { DomSanitizer } from '@angular/platform-browser';
 import { IconModule, LoaderModule, ScrollContainerModule, PriceDisplayPipeModule, NumberPickerModule, ButtonModule, FilesUploadModule, TileModule } from '@colijnit/corecomponents';
 import { CoDocument } from '@colijnit/mainapi/build/model/co-document';
 import { ConfiguratorStatisticsEnvironment } from '@colijnit/articleapi/build/model/configurator-statistics-environment';
-import { LoaderModule as LoaderModule$1, ArticleTileModule, ButtonModule as ButtonModule$1 } from '@colijnit/corecomponents_v12';
+import { LoaderModule as LoaderModule$1, ArticleTileModule, IconCollapseHandleModule, ButtonModule as ButtonModule$1 } from '@colijnit/corecomponents_v12';
 
 // this file is dynamically created, do not change this
 class Version {
     constructor() {
         this.name = "@colijnit/product";
         this.description = "Product detail page project for iOne";
-        this.symVer = "258.1.0";
-        this.publishDate = "4/10/2025, 1:56:55 PM";
-    }
-}
-
-class JsonUtilsService {
-    readJsonFile(filePath) {
-        return __awaiter(this, void 0, void 0, function* () {
-            try {
-                const response = yield fetch(filePath);
-                if (!response.ok) {
-                    return null;
-                }
-                else {
-                    return response.json();
-                }
-            }
-            catch (e) {
-                console.error('Error getting file:', e.message);
-                return '';
-            }
-        });
-    }
-}
-JsonUtilsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function JsonUtilsService_Factory() { return new JsonUtilsService(); }, token: JsonUtilsService, providedIn: "root" });
-JsonUtilsService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root'
-            },] }
-];
-
-class SettingsOptions {
-    constructor() {
-        this.showStockStatus = false;
-        this.showZoomButton = false;
-        this.showTagFilter = false;
-        this.showAsConfigured = false;
-        this.inlineAnswers = false;
-        this.showArButton = false;
-        this.arEnabled = false;
-        this.vrEnabled = false;
-    }
-}
-
-var RenderModes;
-(function (RenderModes) {
-    RenderModes["RenderRoom"] = "render_room";
-    RenderModes["RenderShop"] = "render_shop";
-    RenderModes["RenderIone"] = "render_ione";
-})(RenderModes || (RenderModes = {}));
-
-class RenderParameters {
-    constructor() {
-        this.host = "";
-        this.port = 0;
-        this.secure = false;
-        this.renderMode = RenderModes.RenderShop;
-    }
-}
-
-class ProductSettings {
-    constructor() {
-        this.session = undefined;
-        this.useGroups = true;
-        this.useRenders = false;
-        this.useLoginEncryption = true;
-        this.createWebOrder = true;
-        this.useMatch = false;
-        this.currencySymbol = '€';
-        this.options = new SettingsOptions();
-        this.renderParameters = new RenderParameters();
+        this.symVer = "258.1.2";
+        this.publishDate = "13-6-2025 16:41:13";
     }
 }
 
@@ -118,8 +49,10 @@ class ProductEventService {
         this.onDraftRenderImageReceived = new Subject();
         this.onArticleInfoReceived = new Subject();
         this.onAnswersAvailable = new Subject();
+        this.onReadyToRender = new Subject();
         this.onUpdateProductInfoTab = new Subject();
         this.errorMessage = new Subject();
+        this.onGetRenderForRenderCarousel = new Subject();
     }
 }
 ProductEventService.decorators = [
@@ -127,170 +60,30 @@ ProductEventService.decorators = [
     { type: Injectable }
 ];
 
-// Sole responsibility is simply to wrap around a colijn.Connector to create a stable inner interface to the library in a 1:1 method way.
-// Only to be used by the IOneControllerService.
-class ProductConnectorAdapterService {
-    constructor(_eventService) {
-        this._eventService = _eventService;
-        this.showLoader = new Subject();
-        this._boFactory = new BusinessObjectFactory();
-        this._subs = [];
-    }
-    ngOnDestroy() {
-        this._subs.forEach(s => s.unsubscribe());
-    }
-    initConnector(options) {
-        return __awaiter(this, void 0, void 0, function* () {
-            this.articleConnector = new Articles(options);
-            yield this.articleConnector.connect();
-            this.transactionConnector = new Transaction(options);
-            this._subs.push(
-            // @ts-ignore
-            this.articleConnector.showLoader.subscribe(value => this.showLoader.next(value)));
-        });
-    }
-    setInstance(instanceId) {
-        // this.articleConnector.setInstanceToConfigure(instanceId, false);
-    }
-    getProductBundleSettings(url, upId) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const tempSettings = new ProductSettings();
-            tempSettings.url = url;
-            tempSettings.schema = upId.toString();
-            const tempMainConnector = new MainApi(tempSettings);
-            const response = yield tempMainConnector.getPublicParams(upId);
-            if (response) {
-                return response.productSettings;
-            }
-            return "";
-        });
-    }
-    convertArticleFullObjectToArticleExtended(article) {
-        if (article) {
-            return this._boFactory.makeWithRawBackendData(ArticleListObjectExtended, article);
-        }
-    }
-    getDeliveryPrognosis(goodId, branchNr) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const deliveryPrognosis = yield this.getSelectorDeliveryDate();
-            if (!deliveryPrognosis || !deliveryPrognosis.returnValue) {
-                return this.getDeliveryDate2(goodId);
-            }
-            return deliveryPrognosis;
-        });
-    }
-    getSelectorDeliveryDate() {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getSelectorDeliveryDate();
-            if (response && response.validationResult && response.validationResult.success) {
-                return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    getArtStockStatus(goodId) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getArtStockStatus(goodId);
-            if (response && response.validationResult && response.validationResult.success) {
-                return response.resultObject;
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    getDeliveryDate2(goodId) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getDeliveryDate2(goodId);
-            if (response && response.validationResult && response.validationResult.success) {
-                return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    getJsonConfiguredArticles(configuratorStatistics) {
+class JsonUtilsService {
+    readJsonFile(filePath) {
         return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getJsonConfiguredArticles(configuratorStatistics);
-            if (response && response.validationResult && response.validationResult.success) {
-                return response.resultObject;
+            try {
+                const response = yield fetch(filePath);
+                if (!response.ok) {
+                    return null;
+                }
+                else {
+                    return response.json();
+                }
             }
-            else {
+            catch (e) {
+                console.error('Error getting file:', e.message);
                 return '';
             }
         });
     }
-    getJsonArticleFlatTree(goodId, goodType, quantity, externalSource = false, showLoader = true, instanceId, configuratorStatistics) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.articleConnector.getJsonArticleFlatTree(goodId, goodType, quantity, externalSource, showLoader, instanceId, configuratorStatistics).catch((messages) => {
-                this._eventService.errorMessage.next(messages);
-                return null;
-            });
-        });
-    }
-    getGoodIdFromArticleNr(sku) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getGoodIdFromArticleNr(sku);
-            if (response && response.validationResult && response.validationResult.success) {
-                return response.resultObject;
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    getArticleFullObject(goodId, showLoader = true) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getArticleFullObject(goodId, showLoader);
-            if (response && response.validationResult && response.validationResult.success) {
-                return this._boFactory.makeWithRawBackendData(ArticleFullObject, response.resultObject);
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    getSuperArticle(id, branch) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getSuperArticleQuickSel(id, branch);
-            if (response && response.validationResult && response.validationResult.success) {
-                return this._boFactory.makeWithRawBackendData(SuperArticle, response.resultObject);
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    getDocumentContent(docId, thumbnail = true) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.articleConnector.getDocumentContent(docId, thumbnail);
-            if (response && response.validationResult && response.validationResult.success) {
-                return this._boFactory.makeWithRawBackendData(DocumentContent, response.resultObject);
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    addWebSessionTransactionLine(transactionUuid, sku, quantity) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield this.transactionConnector.addWebSessionTransactionLine(transactionUuid, sku, quantity);
-            if (response && response.validationResult && response.validationResult.success) {
-                const infoResponse = this._boFactory.makeWithRawBackendData(TransactionInfoResponse, response.resultObject);
-                return infoResponse.transactionInfo.uuid;
-            }
-            return "";
-        });
-    }
 }
-ProductConnectorAdapterService.decorators = [
-    { type: Injectable }
-];
-ProductConnectorAdapterService.ctorParameters = () => [
-    { type: ProductEventService }
+JsonUtilsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function JsonUtilsService_Factory() { return new JsonUtilsService(); }, token: JsonUtilsService, providedIn: "root" });
+JsonUtilsService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root'
+            },] }
 ];
 
 var LanguageCode;
@@ -475,95 +268,301 @@ class DictionaryService {
         }
         return text;
     }
-}
-DictionaryService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DictionaryService_Factory() { return new DictionaryService(i0.ɵɵinject(i1.HttpClient), i0.ɵɵinject(JsonUtilsService)); }, token: DictionaryService, providedIn: "root" });
-DictionaryService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root'
-            },] }
-];
-DictionaryService.ctorParameters = () => [
-    { type: HttpClient },
-    { type: JsonUtilsService }
-];
-
-class ProductSettingsService {
-    constructor(_jsonUtilsService, _dictionaryService) {
-        this._jsonUtilsService = _jsonUtilsService;
-        this._dictionaryService = _dictionaryService;
-        this.settingsLoaded = new BehaviorSubject(false);
+}
+DictionaryService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DictionaryService_Factory() { return new DictionaryService(i0.ɵɵinject(i1.HttpClient), i0.ɵɵinject(JsonUtilsService)); }, token: DictionaryService, providedIn: "root" });
+DictionaryService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root'
+            },] }
+];
+DictionaryService.ctorParameters = () => [
+    { type: HttpClient },
+    { type: JsonUtilsService }
+];
+
+class SettingsOptions {
+    constructor() {
+        this.showStockStatus = false;
+        this.showZoomButton = false;
+        this.showTagFilter = false;
+        this.showAsConfigured = false;
+        this.inlineAnswers = false;
+        this.showArButton = false;
+        this.arEnabled = false;
+        this.vrEnabled = false;
+    }
+}
+
+var RenderModes;
+(function (RenderModes) {
+    RenderModes["RenderRoom"] = "render_room";
+    RenderModes["RenderShop"] = "render_shop";
+    RenderModes["RenderIone"] = "render_ione";
+})(RenderModes || (RenderModes = {}));
+
+class RenderParameters$1 {
+    constructor() {
+        this.host = "";
+        this.port = 0;
+        this.secure = false;
+        this.renderMode = RenderModes.RenderShop;
+    }
+}
+
+class ProductSettings extends Options {
+    constructor() {
+        super(...arguments);
+        this.session = undefined;
+        this.createWebOrder = true;
+        this.currencySymbol = '€';
+        this.options = new SettingsOptions();
+        this.renderParameters = new RenderParameters$1();
+    }
+}
+
+class ProductSettingsService {
+    constructor(_jsonUtilsService, _dictionaryService) {
+        this._jsonUtilsService = _jsonUtilsService;
+        this._dictionaryService = _dictionaryService;
+        this.settingsLoaded = new BehaviorSubject(false);
+    }
+    set settings(value) {
+        this._settings = value;
+    }
+    get settings() {
+        return this._settings;
+    }
+    initializeSettings(finish = true) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // see if there's a json file for application settings
+            if (typeof settings === 'undefined') {
+                const jsonSettings = yield this._jsonUtilsService.readJsonFile('product-settings.json');
+                if (jsonSettings) {
+                    this.settings = Object.assign(new ProductSettings(), jsonSettings);
+                    this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
+                    if (finish) {
+                        this.settingsFinished();
+                    }
+                }
+            }
+            else {
+                this.settings = Object.assign(new ProductSettings(), settings);
+                this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
+                if (finish) {
+                    this.settingsFinished();
+                }
+            }
+        });
+    }
+    createSettingsFromObject(obj) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this.settings) {
+                this.settings = new ProductSettings();
+            }
+            const ownOptions = Object.assign({}, this.settings.options);
+            const ownRenderParameters = Object.assign({}, this.settings.renderParameters);
+            this.settings = Object.assign({}, this.settings, obj);
+            if (obj.renderParameters) {
+                this.settings.renderParameters = Object.assign({}, ownRenderParameters, obj.renderParameters);
+            }
+            if (obj.options) {
+                this.settings.options = Object.assign({}, ownOptions, obj.options);
+            }
+            if (obj.hasOwnProperty('assetPath')) {
+                this.settings.assetPath = obj['assetPath'];
+                if (this.settings.assetPath[this.settings.assetPath.length - 1] !== '/') {
+                    this.settings.assetPath += '/';
+                }
+                this.settings.threeDAssetPath = this.settings.assetPath;
+            }
+            if (obj.hasOwnProperty('threeDAssetPath')) {
+                this.settings.threeDAssetPath = obj['threeDAssetPath'];
+                if (this.settings.threeDAssetPath[this.settings.threeDAssetPath.length - 1] !== '/') {
+                    this.settings.threeDAssetPath += '/';
+                }
+            }
+            this.settingsFinished();
+        });
+    }
+    settingsFinished() {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this._dictionaryService.setDictionary(this.settings.languageCode);
+            this.settingsLoaded.next(true);
+        });
+    }
+}
+ProductSettingsService.decorators = [
+    { type: Injectable }
+];
+ProductSettingsService.ctorParameters = () => [
+    { type: JsonUtilsService },
+    { type: DictionaryService }
+];
+
+// Sole responsibility is simply to wrap around a colijn.Connector to create a stable inner interface to the library in a 1:1 method way.
+// Only to be used by the IOneControllerService.
+class ProductConnectorAdapterService {
+    constructor(_eventService) {
+        this._eventService = _eventService;
+        this.showLoader = new Subject();
+        this._boFactory = new BusinessObjectFactory();
+        this._subs = [];
+    }
+    ngOnDestroy() {
+        this._subs.forEach(s => s.unsubscribe());
+    }
+    initConnector(options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.articleConnector = new Articles(options);
+            yield this.articleConnector.connect();
+            this.transactionConnector = new Transaction(options);
+            this._subs.push(
+            // @ts-ignore
+            this.articleConnector.showLoader.subscribe(value => this.showLoader.next(value)));
+        });
+    }
+    setInstance(instanceId) {
+        // this.articleConnector.setInstanceToConfigure(instanceId, false);
+    }
+    getProductBundleSettings(url, upId) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const tempSettings = new ProductSettings();
+            tempSettings.url = url;
+            tempSettings.schema = upId.toString();
+            const tempMainConnector = new MainApi(tempSettings);
+            const response = yield tempMainConnector.getPublicParams(upId);
+            if (response) {
+                return response.productSettings;
+            }
+            return "";
+        });
+    }
+    convertArticleFullObjectToArticleExtended(article) {
+        if (article) {
+            return this._boFactory.makeWithRawBackendData(ArticleListObjectExtended, article);
+        }
+    }
+    getDeliveryPrognosis(goodId, branchNr) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const deliveryPrognosis = yield this.getSelectorDeliveryDate();
+            if (!deliveryPrognosis || !deliveryPrognosis.returnValue) {
+                return this.getDeliveryDate2(goodId);
+            }
+            return deliveryPrognosis;
+        });
+    }
+    getSelectorDeliveryDate() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getSelectorDeliveryDate();
+            if (response && response.validationResult && response.validationResult.success) {
+                return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
+            }
+            else {
+                return null;
+            }
+        });
+    }
+    getArtStockStatus(goodId) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getArtStockStatus(goodId);
+            if (response && response.validationResult && response.validationResult.success) {
+                return response.resultObject;
+            }
+            else {
+                return null;
+            }
+        });
     }
-    set settings(value) {
-        this._settings = value;
+    getDeliveryDate2(goodId) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getDeliveryDate2(goodId);
+            if (response && response.validationResult && response.validationResult.success) {
+                return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
+            }
+            else {
+                return null;
+            }
+        });
     }
-    get settings() {
-        return this._settings;
+    getJsonConfiguredArticles(configuratorStatistics) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getJsonConfiguredArticles(configuratorStatistics);
+            if (response && response.validationResult && response.validationResult.success) {
+                return response.resultObject;
+            }
+            else {
+                return '';
+            }
+        });
     }
-    initializeSettings(finish = true) {
+    getJsonArticleFlatTree(goodId, goodType, quantity, externalSource = false, showLoader = true, instanceId, configuratorStatistics) {
         return __awaiter(this, void 0, void 0, function* () {
-            // see if there's a json file for application settings
-            if (typeof settings === 'undefined') {
-                const jsonSettings = yield this._jsonUtilsService.readJsonFile('product-settings.json');
-                if (jsonSettings) {
-                    this.settings = Object.assign(new ProductSettings(), jsonSettings);
-                    this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
-                    if (finish) {
-                        this.settingsFinished();
-                    }
-                }
+            return this.articleConnector.getJsonArticleFlatTree(goodId, goodType, quantity, externalSource, showLoader, instanceId, configuratorStatistics).catch((messages) => {
+                this._eventService.errorMessage.next(messages);
+                return null;
+            });
+        });
+    }
+    getGoodIdFromArticleNr(sku) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getGoodIdFromArticleNr(sku);
+            if (response && response.validationResult && response.validationResult.success) {
+                return response.resultObject;
             }
             else {
-                this.settings = Object.assign(new ProductSettings(), settings);
-                this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
-                if (finish) {
-                    this.settingsFinished();
-                }
+                return null;
             }
         });
     }
-    createSettingsFromObject(obj) {
+    getArticleFullObject(goodId, showLoader = true) {
         return __awaiter(this, void 0, void 0, function* () {
-            if (!this.settings) {
-                this.settings = new ProductSettings();
+            const response = yield this.articleConnector.getArticleFullObject(goodId, showLoader);
+            if (response && response.validationResult && response.validationResult.success) {
+                return this._boFactory.makeWithRawBackendData(ArticleFullObject, response.resultObject);
             }
-            const ownOptions = Object.assign({}, this.settings.options);
-            const ownRenderParameters = Object.assign({}, this.settings.renderParameters);
-            this.settings = Object.assign({}, this.settings, obj);
-            if (obj.renderParameters) {
-                this.settings.renderParameters = Object.assign({}, ownRenderParameters, obj.renderParameters);
+            else {
+                return null;
             }
-            if (obj.options) {
-                this.settings.options = Object.assign({}, ownOptions, obj.options);
+        });
+    }
+    getSuperArticle(id, branch) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getSuperArticleQuickSel(id, branch);
+            if (response && response.validationResult && response.validationResult.success) {
+                return this._boFactory.makeWithRawBackendData(SuperArticle, response.resultObject);
             }
-            if (obj.hasOwnProperty('assetPath')) {
-                this.settings.assetPath = obj['assetPath'];
-                if (this.settings.assetPath[this.settings.assetPath.length - 1] !== '/') {
-                    this.settings.assetPath += '/';
-                }
-                this.settings.threeDAssetPath = this.settings.assetPath;
+            else {
+                return null;
             }
-            if (obj.hasOwnProperty('threeDAssetPath')) {
-                this.settings.threeDAssetPath = obj['threeDAssetPath'];
-                if (this.settings.threeDAssetPath[this.settings.threeDAssetPath.length - 1] !== '/') {
-                    this.settings.threeDAssetPath += '/';
-                }
+        });
+    }
+    getDocumentContent(docId, thumbnail = true) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.articleConnector.getDocumentContent(docId, thumbnail);
+            if (response && response.validationResult && response.validationResult.success) {
+                return this._boFactory.makeWithRawBackendData(DocumentContent, response.resultObject);
+            }
+            else {
+                return null;
             }
-            this.settingsFinished();
         });
     }
-    settingsFinished() {
+    addWebSessionTransactionLine(transactionUuid, sku, quantity) {
         return __awaiter(this, void 0, void 0, function* () {
-            yield this._dictionaryService.setDictionary(this.settings.languageCode);
-            this.settingsLoaded.next(true);
+            const response = yield this.transactionConnector.addWebSessionTransactionLine(transactionUuid, sku, quantity);
+            if (response && response.validationResult && response.validationResult.success) {
+                const infoResponse = this._boFactory.makeWithRawBackendData(TransactionInfoResponse, response.resultObject);
+                return infoResponse.transactionInfo.uuid;
+            }
+            return "";
         });
     }
 }
-ProductSettingsService.decorators = [
+ProductConnectorAdapterService.decorators = [
     { type: Injectable }
 ];
-ProductSettingsService.ctorParameters = () => [
-    { type: JsonUtilsService },
-    { type: DictionaryService }
+ProductConnectorAdapterService.ctorParameters = () => [
+    { type: ProductEventService }
 ];
 
 // Holds all iONE backend related state and methods for a running HomeDecorator. To be used anywhere internally.
@@ -667,7 +666,7 @@ ProductConnectorService.ctorParameters = () => [
 ];
 
 class IoneProductComponent {
-    constructor(_dictionary, _jsonUtils, _ione, _changeDetector, _appEventService, _settingsService) {
+    constructor(_appEventService, _settingsService) {
         // this.sku = 'CF-HILL';
         // this.sku = 'CF-ALMADA';
         // this.sku = 'CF-39904ANT';
@@ -680,15 +679,15 @@ class IoneProductComponent {
         // this.sku = '104';
         // this.sku = "70000107";
         // this.sku = "grover";
-        this._dictionary = _dictionary;
-        this._jsonUtils = _jsonUtils;
-        this._ione = _ione;
-        this._changeDetector = _changeDetector;
+        // this.sku = "1000610952";
+        // this.sku = "4387";
         this._appEventService = _appEventService;
         this._settingsService = _settingsService;
+        this.enableRenderCarousel = false;
         this.handleAddArticleInternally = true;
         this.onAddToCart = new EventEmitter();
         this.forceRenderImage = new EventEmitter();
+        this.getRenderForRenderCarousel = new EventEmitter();
         this.onAlternativeClick = new EventEmitter();
         this.onArticleInfoReceived = new EventEmitter();
         this.onArticleReceived = new EventEmitter();
@@ -699,9 +698,7 @@ class IoneProductComponent {
         this.settingsLoaded = false;
         this.showHD = false;
         this._subs = [];
-        this._subs.push(
-        // this._dictionary.dictionaryLoaded.subscribe(d => this.upAndLoaded = true),
-        this._appEventService.onAddToCart.subscribe((data) => {
+        this._subs.push(this._appEventService.onAddToCart.subscribe((data) => {
             this._handleAddToCart(data);
         }), this._appEventService.onAddToQuote.subscribe(json => this.onAddToQuote.emit(json)), this._appEventService.onAlternativeClick.subscribe(article => this.onAlternativeClick.emit(article)), this._appEventService.onArticleInfoReceived.subscribe(info => this._handleAnswerInfoReceived(info)), this._appEventService.onArticleReceived.subscribe(article => this.onArticleReceived.emit(article)), this._appEventService.onSelectionsReceived.subscribe(selections => this.onSelectionsReceived.emit(selections)), this._appEventService.onAnswersAvailable.subscribe(answers => this._handleAnswersAvailable(answers)), this._settingsService.settingsLoaded.subscribe(loaded => {
             this.settingsLoaded = loaded;
@@ -728,9 +725,6 @@ class IoneProductComponent {
             }
         });
     }
-    ngOnChanges(changes) {
-        this._changeDetector.detectChanges();
-    }
     ngOnDestroy() {
         this._subs.forEach(s => s.unsubscribe());
     }
@@ -753,25 +747,28 @@ IoneProductComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-ione-product',
                 template: `
-     <app-product-page *ngIf="settingsLoaded"
-                        [createFrozenArticle]="handleAddArticleInternally"
-                        [isReturn]="isReturn"
-                        (openStockEvent)="openStock()"
-                        [sku]="sku"
-                        [showRelatedProductsPopup]="showRelatedProductsPopup"
-      ></app-product-page>
+    <app-product-page *ngIf="settingsLoaded"
+                      [createFrozenArticle]="handleAddArticleInternally"
+                      [isReturn]="isReturn"
+                      [sku]="sku"
+                      [showRelatedProductsPopup]="showRelatedProductsPopup"
+                      [enableRenderCarousel]="enableRenderCarousel"
+                      (openStockEvent)="openStock()"
+    ></app-product-page>
     <!--  <co-button [label]="'click'" (click)="showHD = !showHD"></co-button>
       <co-product-hd [sku]="'657946ca-e1e1-41fd-7ae0-08dbf7df0cef'" *ngIf="showHD"></co-product-hd>-->
   `,
+                providers: [
+                    ProductSettingsService,
+                    ProductConnectorService,
+                    ProductEventService,
+                    ProductConnectorAdapterService
+                ],
                 encapsulation: ViewEncapsulation.Emulated,
                 styles: [""]
             },] }
 ];
 IoneProductComponent.ctorParameters = () => [
-    { type: DictionaryService },
-    { type: JsonUtilsService },
-    { type: ProductConnectorService },
-    { type: ChangeDetectorRef },
     { type: ProductEventService },
     { type: ProductSettingsService }
 ];
@@ -779,10 +776,12 @@ IoneProductComponent.propDecorators = {
     sku: [{ type: Input }],
     isReturn: [{ type: Input }],
     showRelatedProductsPopup: [{ type: Input }],
+    enableRenderCarousel: [{ type: Input }],
     settings: [{ type: Input }],
     handleAddArticleInternally: [{ type: Input }],
     onAddToCart: [{ type: Output }],
     forceRenderImage: [{ type: Output }],
+    getRenderForRenderCarousel: [{ type: Output }],
     onAlternativeClick: [{ type: Output }],
     onArticleInfoReceived: [{ type: Output }],
     onArticleReceived: [{ type: Output }],
@@ -811,6 +810,8 @@ var SelectorType;
 var IconEnum;
 (function (IconEnum) {
     IconEnum["AddToCartDrop"] = "add_to_cart_drop";
+    IconEnum["ArrowPointLeft"] = "arrow_point_left";
+    IconEnum["ArrowPointRight"] = "arrow_point_right";
     IconEnum["CrossSkinny"] = "cross_skinny";
     IconEnum["DeliveryTruck"] = "delivery_truck";
     IconEnum["Download"] = "download";
@@ -832,6 +833,8 @@ var IconEnum;
 /** AUTO GENERATED FILE. DO NOT CHANGE.. **/
 const IconSvg = {
     "add_to_cart_drop": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M16.58,34.84a1.8,1.8,0,1,0,1.8,1.8A1.79,1.79,0,0,0,16.58,34.84Z\" fill=\"#484f60\"/><path d=\"M31.49,34.84a1.8,1.8,0,1,0,1.8,1.8A1.79,1.79,0,0,0,31.49,34.84Z\" fill=\"#484f60\"/><path d=\"M35.6,17.9l-1.51.18L31.88,20.3l1.31-.17a.88.88,0,0,1,1,1.08L32.35,29.5a1.52,1.52,0,0,1-1.44,1.2H16.51a1.75,1.75,0,0,1-1.57-1.17l-2.31-5.6a1,1,0,0,1,.85-1.29l4.43-.56-1.86-1.86-5.13.61a1,1,0,0,0-.87,1.28l3.34,9.44A1.73,1.73,0,0,0,15,32.72H32.64a1.51,1.51,0,0,0,1.43-1.2L36.6,19A.89.89,0,0,0,35.6,17.9Z\" fill=\"#484f60\"/><path d=\"M39,17a1.87,1.87,0,0,0-1.36,1.46l-.42,2.89c-.1.67.31,1,.9.7a2.75,2.75,0,0,0,1.33-1.7L40,18A.73.73,0,0,0,39,17Z\" fill=\"#484f60\"/><polygon points=\"24 25.35 32.04 17.3 27.04 17.3 27.04 10 20.95 10 20.95 17.3 15.96 17.3 24 25.35\" fill=\"#484f60\"/></svg>",
+    "arrow_point_left": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\" ><path fill=\"#484F5F\" d=\"M31.9,36.7l-14.7-9.6C17.1,27,17,26.9,17,26.7v-2.4c0-0.2,0.1-0.3,0.2-0.4l14.7-9.6c0.2-0.2,0.5-0.1,0.7,0.1l1.4,2.1c0.2,0.2,0.1,0.5-0.1,0.7l-12,7.8c-0.3,0.2-0.3,0.6,0,0.8l12,7.8c0.2,0.2,0.3,0.5,0.1,0.7l-1.4,2.1C32.4,36.8,32.1,36.8,31.9,36.7z\"/></svg>",
+    "arrow_point_right": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\" ><path fill=\"#484F5F\" d=\"M19.1,14.3l14.7,9.6c0.1,0.1,0.2,0.2,0.2,0.4v2.4c0,0.2-0.1,0.3-0.2,0.4l-14.7,9.6c-0.2,0.2-0.5,0.1-0.7-0.1l-1.4-2.1c-0.2-0.2-0.1-0.5,0.1-0.7l12-7.8c0.3-0.2,0.3-0.6,0-0.8l-12-7.8c-0.2-0.2-0.3-0.5-0.1-0.7l1.4-2.1C18.6,14.2,18.9,14.2,19.1,14.3z\"/></svg>",
     "cross_skinny": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 30 30\"><g ><polygon points=\"25.35 5.52 24.65 4.81 15 14.46 5.35 4.81 4.65 5.52 14.29 15.17 4.65 24.81 5.35 25.52 15 15.87 24.65 25.52 25.35 24.81 15.71 15.17 25.35 5.52\" fill=\"#484f60\"/></g></svg>",
     "delivery_truck": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M25,45A20,20,0,1,1,45,25,20,20,0,0,1,25,45ZM25,6.29A18.71,18.71,0,1,0,43.71,25,18.73,18.73,0,0,0,25,6.29Z\" fill=\"#484f60\"/><path d=\"M21.86,24.09a7.14,7.14,0,0,1,.72-3.24,6.94,6.94,0,0,1,1.18-1.66H13v10.1h8.51a3.25,3.25,0,0,1,3.27-3.07A3.33,3.33,0,0,1,27,27V25.75H21.9Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M21.65,30.47h-.48a3.51,3.51,0,0,1,1.13,2.19h1.57a3.22,3.22,0,0,1-1.41-.83A3.13,3.13,0,0,1,21.65,30.47Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M34.63,21.89H28.87c-.3.25-.5.43-.63.56v8H28a3.19,3.19,0,0,1-.82,1.37,3.3,3.3,0,0,1-1.41.82H29a3.53,3.53,0,0,1,7,0h1V27.1Zm-.2,5.38H30.8a.47.47,0,0,1-.46-.46V23.36a.46.46,0,0,1,.46-.46h2.1a.45.45,0,0,1,.42.27l1.53,3.45A.46.46,0,0,1,34.43,27.27Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M16.42,30.47a3.51,3.51,0,0,0-1.13,2.19H14.6l-1.6-1V30.47Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M30,33.08a2.53,2.53,0,1,0,2.53-2.53A2.52,2.52,0,0,0,30,33.08Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M16.27,33.08a2.53,2.53,0,1,0,2.53-2.53A2.52,2.52,0,0,0,16.27,33.08Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M22.45,17.27h-3.2a4.29,4.29,0,0,1,1.61-3.49,6.45,6.45,0,0,1,4.31-1.38,6.79,6.79,0,0,1,2.92.57A4.72,4.72,0,0,1,30,14.62a4,4,0,0,1,.72,2.26,3.74,3.74,0,0,1-.23,1.27,5.31,5.31,0,0,1-.73,1.29,12,12,0,0,1-1.4,1.29A8.74,8.74,0,0,0,27.06,22a3.17,3.17,0,0,0-.46.94,7.56,7.56,0,0,0-.23,1.65h-3.3v-.49a6,6,0,0,1,.59-2.68,6.8,6.8,0,0,1,1.94-2.25,9.44,9.44,0,0,0,1.56-1.41,1.5,1.5,0,0,0,.27-.9,1.47,1.47,0,0,0-.65-1.19A2.9,2.9,0,0,0,25,15.14a2.77,2.77,0,0,0-1.84.6A1.91,1.91,0,0,0,22.45,17.27Z\" fill=\"#484f60\"/><path d=\"M24.78,27.42a2.06,2.06,0,0,1,1.51.61,2,2,0,0,1,.63,1.47A2,2,0,0,1,26.3,31a2.08,2.08,0,0,1-1.5.62A2,2,0,0,1,23.31,31a2.08,2.08,0,0,1,0-2.95A2,2,0,0,1,24.78,27.42Z\" fill=\"#484f60\"/></svg>",
     "download": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" version=\"1.1\" sodipodi:docname=\"download.svg\" inkscape:version=\"0.92.4 (5da689c313, 2019-01-14)\"><metadata ><rdf:RDF><cc:Work rdf:about=\"\"><dc:format>image/svg+xml</dc:format><dc:type rdf:resource=\"http://purl.org/dc/dcmitype/StillImage\" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs /><sodipodi:namedview pagecolor=\"#ffffff\" bordercolor=\"#666666\" borderopacity=\"1\" objecttolerance=\"10\" gridtolerance=\"10\" guidetolerance=\"10\" inkscape:pageopacity=\"0\" inkscape:pageshadow=\"2\" inkscape:window-width=\"1920\" inkscape:window-height=\"1017\" showgr inkscape:zoom=\"6.675088\" inkscape:cx=\"-14.056273\" inkscape:cy=\"29.806579\" inkscape:window-x=\"-8\" inkscape:window-y=\"-8\" inkscape:window-maximized=\"1\" inkscape:current-layer=\"svg8\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\"><g style=\"fill:#484f60;fill-opacity:1\"><path inkscape:connector-curvature=\"0\" d=\"m 498.966,339.946 c -7.197,0 -13.034,5.837 -13.034,13.034 v 49.804 c 0,28.747 -23.388,52.135 -52.135,52.135 H 78.203 c -28.747,0 -52.135,-23.388 -52.135,-52.135 V 352.98 c 0,-7.197 -5.835,-13.034 -13.034,-13.034 C 5.835,339.946 0,345.782 0,352.98 v 49.804 c 0,43.121 35.082,78.203 78.203,78.203 h 355.594 c 43.121,0 78.203,-35.082 78.203,-78.203 V 352.98 c 0,-7.198 -5.835,-13.034 -13.034,-13.034 z\" style=\"fill:#484f60;fill-opacity:1\" /></g></g><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\"><g style=\"fill:#484f60;fill-opacity:1\"><path inkscape:connector-curvature=\"0\" d=\"M 419.833,391.3 H 92.167 c -7.197,0 -13.034,5.837 -13.034,13.034 0,7.197 5.835,13.034 13.034,13.034 h 327.665 c 7.199,0 13.034,-5.835 13.034,-13.034 0,-7.197 -5.835,-13.034 -13.033,-13.034 z\" style=\"fill:#484f60;fill-opacity:1\" /></g></g><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\"><g style=\"fill:#484f60;fill-opacity:1\"><path inkscape:connector-curvature=\"0\" d=\"m 387.919,207.93 c -4.795,-5.367 -13.034,-5.834 -18.404,-1.038 L 269.033,296.657 V 44.048 c 0,-7.197 -5.835,-13.034 -13.034,-13.034 -7.197,0 -13.034,5.835 -13.034,13.034 V 296.657 L 142.483,206.893 c -5.367,-4.796 -13.607,-4.328 -18.404,1.038 -4.794,5.369 -4.331,13.609 1.037,18.404 l 109.174,97.527 c 6.187,5.529 13.946,8.292 21.708,8.292 7.759,0 15.519,-2.763 21.708,-8.289 l 109.174,-97.53 c 5.37,-4.798 5.834,-13.038 1.039,-18.405 z\" style=\"fill:#484f60;fill-opacity:1\" /></g></g><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /></svg>",
@@ -921,6 +924,10 @@ class ProductPageComponent {
             else {
                 this.showAddToCart = true;
             }
+        }), this.appEventService.onGetRenderForRenderCarousel.subscribe((renderParameters) => {
+            if (this.selections.nativeElement) {
+                this.selections.nativeElement.getRenderForRenderCarousel(renderParameters);
+            }
         }));
     }
     set sku(value) {
@@ -1054,7 +1061,7 @@ class ProductPageComponent {
 ProductPageComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-product-page',
-                template: "<ng-container *ngIf=\"settingsLoaded\">\r\n  <div class=\"page-wrapper\">\r\n    <div class=\"page-wrapper-content\">\r\n      <div class=\"page-wrapper-left\">\r\n        <div class=\"product-image-container\">\r\n          <div class=\"product-page-block-selector-type\">\r\n            <app-product-selector-type class=\"default-padding\"\r\n              [(currentType)]=\"currentView\"\r\n              [show2D]=\"configurable\"\r\n              [show3D]=\"threeD\"\r\n            ></app-product-selector-type>\r\n          </div>\r\n          <div class=\"product-page-block-image default-padding\" [class.full]=\"fullScreen\">\r\n            <app-image-carousel [@toggleVisibilityByState]=\"show2D ? 'show' : 'hide'\" [images]=\"article?.images\" [showRefresh]=\"configurable && threeD\"></app-image-carousel>\r\n            <ng-container *ngIf=\"settingsLoaded\">\r\n              <threed-configurator #configurator class=\"threed-configurator\"\r\n                                   [class.configurator-full-screen]=\"fullScreen\"\r\n                                   [@toggleVisibilityByState]=\"show3D ? 'show' : 'hide'\"\r\n                                   [@toggleFullScreen]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n              ></threed-configurator>\r\n            </ng-container>\r\n            <co-icon #fullscreenbutton class=\"fullscreen-button\" *ngIf=\"show3D\"\r\n                     [@toggleTopLeft]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n                     [iconData]=\"iconCache.getIcon(fullScreenIcon)\"\r\n                     (click)=\"showFullScreen()\"></co-icon>\r\n            <co-icon class=\"threed-watermark\" *ngIf=\"show3D && fullScreen\"\r\n                     [iconData]=\"iconCache.getIcon(icon.Logo)\"></co-icon>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"page-wrapper-right\">\r\n        <div class=\"product-page-block-description\">\r\n          <app-product-description class=\"default-padding\" [article]=\"article\"></app-product-description>\r\n        </div>\r\n        <div class=\"product-page-block-additional\">\r\n          <div class=\"product-page-block-additional-description\">\r\n            <app-product-additional-description class=\"default-padding\" [article]=\"article\"></app-product-additional-description>\r\n          </div>\r\n          <div class=\"product-page-block-price\" [class.full]=\"configuring\">\r\n            <app-product-price class=\"s-padding\" *ngIf=\"!configuring\"\r\n                               [pricing]=\"article?.pricing\"\r\n                               [configurable]=\"configurable\"\r\n            ></app-product-price>\r\n            <ng-container *ngIf=\"settingsLoaded\">\r\n              <threed-selections #selections class=\"threed-selections\" [class.show-selections]=\"configuring\" [@toggleFullScreenRight]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n                                 [class.default-padding]=\"!fullScreen\"\r\n                                 [class.show-full-screen]=\"fullScreen\"\r\n                                 [class.mini-scrollbar]=\"fullScreen\"\r\n                                 [sku]=\"sku\"\r\n                                 [settings]=\"settings\"\r\n                                 (onUserActionFromThreeD)=\"configuring = true\"\r\n                                 (instanceSet)=\"setInstance($event)\"\r\n                                 (onImageReceived)=\"appEventService.onImageReceived.next($event)\"\r\n                                 (onRenderStarted)=\"appEventService.onRenderStarted.next()\"\r\n                                 (onDraftRenderImageReceived)=\"appEventService.onDraftRenderImageReceived.next($event)\"\r\n                                 (onArticleReceived)=\"appEventService.onArticleReceived.next($event.detail)\"\r\n                                 (onSelectionsReceived)=\"appEventService.onSelectionsReceived.next($event.detail)\"\r\n                                 (onArticleInfoReceived)=\"appEventService.onArticleInfoReceived.next($event.detail)\"\r\n                                 (onAnswersAvailable)=\"appEventService.onAnswersAvailable.next($event.detail)\"\r\n              ></threed-selections>\r\n            </ng-container>\r\n          </div>\r\n          <div class=\"product-page-block-addtocart no-padding product-action-buttons\" *ngIf=\"!configuring\" [@toggleTopRight]=\"fullScreen ? 'fullscreen' : 'halfscreen'\">\r\n            <app-product-addtocart\r\n                                   [configurable]=\"configurable\"\r\n                                   [createFrozenArticle]=\"createFrozenArticle\"\r\n                                   [configuring]=\"configuring\"\r\n                                   [showAddToCart]=\"showAddToCart\"\r\n                                   [article]=\"article\"\r\n                                   [externalSource]=\"externalSource\"\r\n                                   [isReturn]=\"isReturn\"\r\n                                   (startConfiguration)=\"handleStartConfiguration()\"\r\n                                   (showRelatedPopup)=\"handlePopUpChange($event)\"\r\n            ></app-product-addtocart>\r\n          </div>\r\n          <div class=\"addtocart-reserved product-action-buttons\" *ngIf=\"configuring\" [class.full-screen]=\"fullScreen\">\r\n            <app-product-addtocart class=\"default-padding\"\r\n                                   [configurable]=\"false\"\r\n                                   [fullscreen]=\"fullScreen\"\r\n                                   [showAddToCart]=\"showAddToCart\"\r\n                                   [configuring]=\"configuring\"\r\n                                   [article]=\"article\"\r\n                                   [externalSource]=\"externalSource\"\r\n                                   [isReturn]=\"isReturn\"\r\n                                   (startConfiguration)=\"handleStartConfiguration()\"\r\n            ></app-product-addtocart>\r\n          </div>\r\n          <div class=\"product-page-block-variants\">\r\n            <app-product-related class=\"no-padding\" *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n                                 [externalSource]=\"externalSource\"\r\n                                 [articles]=\"article?.relatedArticles\" [refType]=\"64\" [label]=\"'VARIANTS' | localize\"></app-product-related>\r\n          </div>\r\n          <div class=\"product-page-block-stock\">\r\n            <app-product-stock class=\"no-padding\" [goodId]=\"article?.goodId\" (openStockEvent)=\"openStock()\"></app-product-stock>\r\n          </div>\r\n          <div class=\"product-page-block-delivery\">\r\n            <app-product-delivery class=\"no-padding\" [stockAndDelivery]=\"stockAndDelivery\"></app-product-delivery>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"page-wrapper-content\">\r\n      <div class=\"page-wrapper-left\">\r\n        <app-product-info-tabs class=\"no-padding\" [article]=\"article\"></app-product-info-tabs>\r\n      </div>\r\n      <div class=\"page-wrapper-right\">\r\n        <div class=\"product-page-block-related s-padding\">\r\n            <app-product-related\r\n              *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n              [externalSource]=\"externalSource\"\r\n              [articles]=\"article?.relatedArticles\"\r\n              [refType]=\"1\"\r\n              [label]=\"'RELATED_PRODUCTS' | localize\">\r\n            </app-product-related>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"page-wrapper-content no-top-margin\">\r\n      <div class=\"page-wrapper-full\">\r\n        <div class=\"product-page-block-alternatives s-padding\">\r\n          <app-product-related\r\n            *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n            [externalSource]=\"externalSource\"\r\n            [articles]=\"article?.relatedArticles\"\r\n            [refType]=\"4\"\r\n            [isSmallModus]=\"false\"\r\n            [label]=\"'ALTERNATIVE_PRODUCTS' | localize\">\r\n          </app-product-related>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n\r\n    <div *ngIf=\"showRelatedProductsPopup\">\r\n      <co-product-dialog\r\n        [mainArticle]=\"article\"\r\n        [articles]=\"article?.relatedArticles\"\r\n        [refType]=\"1\"\r\n        (closeRelatedPopup)=\"handlePopUpChange($event)\"\r\n      >\r\n      </co-product-dialog>\r\n\r\n<!--      <app-product-related class=\"no-padding\" *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"-->\r\n<!--                           [articles]=\"article?.relatedArticles\" [refType]=\"64\" [label]=\"'VARIANTS' | localize\"></app-product-related>-->\r\n    </div>\r\n\r\n\r\n  </div>\r\n</ng-container>\r\n",
+                template: "<ng-container *ngIf=\"settingsLoaded\">\r\n  <div class=\"page-wrapper\">\r\n    <div class=\"page-wrapper-content\">\r\n      <div class=\"page-wrapper-left\">\r\n        <div class=\"product-image-container\">\r\n          <div class=\"product-page-block-selector-type\">\r\n            <app-product-selector-type class=\"default-padding\"\r\n                                       [(currentType)]=\"currentView\"\r\n                                       [show2D]=\"configurable\"\r\n                                       [show3D]=\"threeD\"\r\n            ></app-product-selector-type>\r\n          </div>\r\n          <div class=\"product-page-block-image default-padding\" [class.full]=\"fullScreen\">\r\n\r\n            <app-image-carousel\r\n              *ngIf=\"!enableRenderCarousel\"\r\n              [@toggleVisibilityByState]=\"show2D ? 'show' : 'hide'\"\r\n              [images]=\"article?.images\"\r\n              [showRefresh]=\"configurable && threeD\">\r\n            </app-image-carousel>\r\n\r\n            <app-render-carousel\r\n              *ngIf=\"enableRenderCarousel\"\r\n              [@toggleVisibilityByState]=\"show2D ? 'show' : 'hide'\"\r\n              [article]=\"article\">\r\n            </app-render-carousel>\r\n\r\n            <ng-container *ngIf=\"settingsLoaded\">\r\n              <threed-configurator\r\n                #configurator\r\n                class=\"threed-configurator\"\r\n                [class.configurator-full-screen]=\"fullScreen\"\r\n                [@toggleVisibilityByState]=\"show3D ? 'show' : 'hide'\"\r\n                [@toggleFullScreen]=\"fullScreen ? 'fullscreen' : 'halfscreen'\">\r\n              </threed-configurator>\r\n            </ng-container>\r\n\r\n            <co-icon #fullscreenbutton class=\"fullscreen-button\" *ngIf=\"show3D\"\r\n                     [@toggleTopLeft]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n                     [iconData]=\"iconCache.getIcon(fullScreenIcon)\"\r\n                     (click)=\"showFullScreen()\"></co-icon>\r\n            <co-icon class=\"threed-watermark\" *ngIf=\"show3D && fullScreen\"\r\n                     [iconData]=\"iconCache.getIcon(icon.Logo)\"></co-icon>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"page-wrapper-right\">\r\n        <div class=\"product-page-block-description\">\r\n          <app-product-description class=\"default-padding\" [article]=\"article\"></app-product-description>\r\n        </div>\r\n        <div class=\"product-page-block-additional\">\r\n          <div class=\"product-page-block-additional-description\">\r\n            <app-product-additional-description class=\"default-padding\" [article]=\"article\"></app-product-additional-description>\r\n          </div>\r\n          <div class=\"product-page-block-price\" [class.full]=\"configuring\">\r\n            <app-product-price class=\"s-padding\" *ngIf=\"!configuring\"\r\n                               [pricing]=\"article?.pricing\"\r\n                               [configurable]=\"configurable\"\r\n            ></app-product-price>\r\n            <ng-container *ngIf=\"settingsLoaded\">\r\n              <threed-selections #selections class=\"threed-selections\"\r\n                                 [class.show-selections]=\"configuring\"\r\n                                 [@toggleFullScreenRight]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n                                 [class.default-padding]=\"!fullScreen\"\r\n                                 [class.show-full-screen]=\"fullScreen\"\r\n                                 [class.mini-scrollbar]=\"fullScreen\"\r\n                                 [sku]=\"sku\"\r\n                                 [settings]=\"settings\"\r\n                                 (onUserActionFromThreeD)=\"configuring = true\"\r\n                                 (instanceSet)=\"setInstance($event)\"\r\n                                 (onImageReceived)=\"appEventService.onImageReceived.next($event)\"\r\n                                 (onRenderStarted)=\"appEventService.onRenderStarted.next()\"\r\n                                 (onDraftRenderImageReceived)=\"appEventService.onDraftRenderImageReceived.next($event)\"\r\n                                 (onArticleReceived)=\"appEventService.onArticleReceived.next($event.detail)\"\r\n                                 (onSelectionsReceived)=\"appEventService.onSelectionsReceived.next($event.detail)\"\r\n                                 (onArticleInfoReceived)=\"appEventService.onArticleInfoReceived.next($event.detail)\"\r\n                                 (onAnswersAvailable)=\"appEventService.onAnswersAvailable.next($event.detail)\"\r\n                                 (onReadyToRender)=\"appEventService.onReadyToRender.next($event.detail)\"\r\n                                 (onRenderImageReceived)=\"appEventService.onRenderImageReceived.next($event.detail)\"\r\n              ></threed-selections>\r\n            </ng-container>\r\n          </div>\r\n          <div class=\"product-page-block-addtocart no-padding product-action-buttons\" *ngIf=\"!configuring\" [@toggleTopRight]=\"fullScreen ? 'fullscreen' : 'halfscreen'\">\r\n            <app-product-addtocart\r\n              [configurable]=\"configurable\"\r\n              [createFrozenArticle]=\"createFrozenArticle\"\r\n              [configuring]=\"configuring\"\r\n              [showAddToCart]=\"showAddToCart\"\r\n              [article]=\"article\"\r\n              [externalSource]=\"externalSource\"\r\n              [isReturn]=\"isReturn\"\r\n              (startConfiguration)=\"handleStartConfiguration()\"\r\n              (showRelatedPopup)=\"handlePopUpChange($event)\"\r\n            ></app-product-addtocart>\r\n          </div>\r\n          <div class=\"addtocart-reserved product-action-buttons\" *ngIf=\"configuring\" [class.full-screen]=\"fullScreen\">\r\n            <app-product-addtocart class=\"default-padding\"\r\n                                   [configurable]=\"false\"\r\n                                   [fullscreen]=\"fullScreen\"\r\n                                   [showAddToCart]=\"showAddToCart\"\r\n                                   [configuring]=\"configuring\"\r\n                                   [article]=\"article\"\r\n                                   [externalSource]=\"externalSource\"\r\n                                   [isReturn]=\"isReturn\"\r\n                                   (startConfiguration)=\"handleStartConfiguration()\"\r\n            ></app-product-addtocart>\r\n          </div>\r\n          <div class=\"product-page-block-variants\">\r\n            <app-product-related class=\"no-padding\" *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n                                 [externalSource]=\"externalSource\"\r\n                                 [articles]=\"article?.relatedArticles\" [refType]=\"64\" [label]=\"'VARIANTS' | localize\"></app-product-related>\r\n          </div>\r\n          <div class=\"product-page-block-stock\">\r\n            <app-product-stock class=\"no-padding\" [goodId]=\"article?.goodId\" (openStockEvent)=\"openStock()\"></app-product-stock>\r\n          </div>\r\n          <div class=\"product-page-block-delivery\">\r\n            <app-product-delivery class=\"no-padding\" [stockAndDelivery]=\"stockAndDelivery\"></app-product-delivery>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"page-wrapper-content\">\r\n      <div class=\"page-wrapper-left\">\r\n        <app-product-info-tabs class=\"no-padding\" [article]=\"article\"></app-product-info-tabs>\r\n      </div>\r\n      <div class=\"page-wrapper-right\">\r\n        <div class=\"product-page-block-related s-padding\">\r\n          <app-product-related\r\n            *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n            [externalSource]=\"externalSource\"\r\n            [articles]=\"article?.relatedArticles\"\r\n            [refType]=\"1\"\r\n            [label]=\"'RELATED_PRODUCTS' | localize\">\r\n          </app-product-related>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"page-wrapper-content no-top-margin\">\r\n      <div class=\"page-wrapper-full\">\r\n        <div class=\"product-page-block-alternatives s-padding\">\r\n          <app-product-related\r\n            *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n            [externalSource]=\"externalSource\"\r\n            [articles]=\"article?.relatedArticles\"\r\n            [refType]=\"4\"\r\n            [isSmallModus]=\"false\"\r\n            [label]=\"'ALTERNATIVE_PRODUCTS' | localize\">\r\n          </app-product-related>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n\r\n    <div *ngIf=\"showRelatedProductsPopup\">\r\n      <co-product-dialog\r\n        [mainArticle]=\"article\"\r\n        [articles]=\"article?.relatedArticles\"\r\n        [refType]=\"1\"\r\n        (closeRelatedPopup)=\"handlePopUpChange($event)\"\r\n      >\r\n      </co-product-dialog>\r\n\r\n      <!--      <app-product-related class=\"no-padding\" *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"-->\r\n      <!--                           [articles]=\"article?.relatedArticles\" [refType]=\"64\" [label]=\"'VARIANTS' | localize\"></app-product-related>-->\r\n    </div>\r\n\r\n\r\n  </div>\r\n</ng-container>\r\n",
                 animations: [
                     trigger('toggleFullScreen', [
                         state('fullscreen', style({ 'position': 'fixed', 'top': '0', 'left': '0', 'width': '100%', 'height': '100%' })),
@@ -1087,7 +1094,7 @@ ProductPageComponent.decorators = [
                         transition('void => *', animate('200ms ease-in-out')),
                     ])
                 ],
-                styles: [".page-wrapper{font-family:iOneMontserrat;font-size:12px;display:flex;flex-direction:column;max-width:1400px;padding:0 15px;margin:0 auto}.page-wrapper-content{display:flex;flex-direction:row;margin:40px 0}.page-wrapper-content:first-child{margin-top:0}.page-wrapper-content.no-top-margin{margin-top:0}.page-wrapper-left{display:flex;width:55%;flex-direction:column}.page-wrapper-right{display:flex;width:45%;flex-direction:column}.page-wrapper-full{display:flex;width:100%;flex-direction:column}.page-wrapper-66{display:flex;width:60%;flex-direction:column}.page-wrapper-33{display:flex;width:40%;flex-direction:column}.threed-selections{display:none}.threed-selections.show-selections{display:block}.threed-selections ::ng-deep .rp-lite-selector .rp-answers-slideout ::ng-deep co-slideout{width:480px;z-index:3}.threed-selections ::ng-deep .co-summary-line{cursor:pointer}.product-action-buttons{position:relative}.product-action-buttons.full-screen{z-index:10}.product-image-container{grid-column:1/7;grid-row:1/6;position:relative}.product-page-block-selector-type{width:auto;position:absolute;top:10px;right:10px;z-index:2}.product-page-block-image{box-sizing:border-box;width:100%;z-index:1;position:relative}.product-page-block-image .threed-configurator{border:1px solid #efefef}.product-page-block-image .threed-configurator .layer .viewer canvas{height:100%;width:100%}.product-page-block-image .threed-configurator ::ng-deep .rp-element-toolbar{top:30px}.product-page-block-image app-image-carousel.show-animated,.product-page-block-image threed-configurator.show-animated{opacity:1;z-index:0;transition:all .2s ease-in-out}.product-page-block-image .fullscreen-button{cursor:pointer;height:50px;width:50px;position:absolute;left:30px;z-index:100;top:30px}.product-page-block-image.full{grid-column:1/11;grid-row:2/span 10;z-index:3}.product-page-block-description{grid-column:7/12;grid-row:1/1}.product-page-block-additional{width:100%}.product-page-block-additional-description{width:100%}.product-page-block-price{grid-column:1/3;grid-row:2/2;align-self:center}.product-page-block-price.full{grid-column:1/5}.product-page-block-addtocart{grid-column:3/5;grid-row:2/2;align-self:center;padding-top:30px!important}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button:hover div.rippler{background:#f6f5f4}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button ::ng-deep co-icon{position:relative;z-index:2}.product-page-block-addtocart ::ng-deep co-button.cart-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-button.cart-button:hover{background:#74B77F}.addtocart-reserved{grid-column:1/3;grid-row:3/3}.product-page-block-stock{grid-column:1/3;grid-row:4/4}.product-page-block-delivery{grid-column:3/5;grid-row:4/4}::ng-deep co-scroll-container{overflow:hidden;position:relative}::ng-deep co-scroll-container .content-wrapper{padding:0}::ng-deep co-scroll-container .scroll-layer{left:0;top:0}::ng-deep co-scroll-container .scroll-layer .scroller{width:34px;height:34px;border-radius:36px;background:#fff;cursor:pointer;box-shadow:0 0 5px #0003}::ng-deep co-scroll-container .scroll-layer .scroller:hover{background:#f6f5f4}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll{left:5px}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll:before{border-width:0 3px 3px 0;padding:4px;margin-left:13px;margin-top:11px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll{right:5px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll:after{border-width:0 3px 3px 0;padding:4px;margin-left:9px;margin-top:11px}.product-page-block-variants{margin:20px 0 0}.product-page-block-variants ::ng-deep app-product-related>div{display:flex;grid-gap:15px;gap:15px;align-items:center;border-top:1px solid #f6f5f4;padding:5px 0 7px 15px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep app-header h3{font-size:14px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container{width:320px;max-width:100%;padding:0 16px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller{width:26px;height:26px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll{left:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll:before{border-width:0 2px 2px 0;margin-left:9px;margin-top:9px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll{right:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll:after{border-width:0 2px 2px 0;margin-left:6px;margin-top:9px}.product-page-block-variants ::ng-deep co-tile.small{min-width:50px!important;max-width:50px!important;border:1px solid #f6f5f4;margin:0 10px 0 0;border-radius:4px}.product-page-block-variants ::ng-deep co-tile.small:hover{border-color:#22313c}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper{padding:0}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-top{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image{height:40px!important;padding:5px;margin-bottom:10px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper .no-image{width:40px;height:40px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper span{display:none!important}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-bottom{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-extra-bottom{display:none}.product-page-block-alternatives ::ng-deep .article-wrapper{margin:0 20px 0 0}.product-page-block-alternatives ::ng-deep .article-wrapper:last-child{margin:0}.product-page-block-alternatives ::ng-deep co-tile{cursor:pointer;transition:all .14s ease-out;border:1px solid transparent;border-bottom-color:#f6f5f4;padding:15px 10px 0;width:319px;max-width:none;min-width:0;box-sizing:border-box}.product-page-block-alternatives ::ng-deep co-tile:hover{box-shadow:none;border-color:#f6f5f4}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper div.image co-image{transform:scale(1.05)}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper .tile-bottom{margin:0}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-extra-bottom .main .description{text-decoration:underline}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper{padding:0;position:relative;outline:none;overflow:hidden}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-top{position:absolute;left:0;top:0;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image{position:relative;padding:1px;display:flex;align-items:center;justify-content:center;overflow:hidden;max-width:250px;margin:0 auto 10px;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image:after{content:\"\";padding:100% 0 0;float:left;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image co-image{position:absolute;left:0;top:0;overflow:hidden;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;z-index:-1;transition:all .2s ease}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image .no-image-wrapper{position:absolute;display:flex;left:50%;top:50%;margin:-48px 0 0 -54px;flex-direction:column;align-items:center;opacity:.25}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom{transition:all .2s ease;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button{margin:0 0 5px!important;width:36px;height:36px;border:1px solid #22313C;cursor:pointer;border-radius:4px;padding:0!important;font-size:0}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button co-icon{width:32px;height:32px;margin:0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom{outline:none;padding:15px 0;background:transparent!important;min-height:60px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main{padding:0 10px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .description{font-size:15px;font-weight:bold;margin:0 0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .price{font-size:16px;margin:15px 0 0;font-weight:bold;color:#2b60a7}.product-page-block-additional-information{grid-column:1/6;grid-row:4/4}.product-page-block-properties{grid-column:7/10;grid-row:3/3}.product-page-block-related-articles{grid-column:2/6;grid-row:4/4}.product-page-block-alternative-articles{grid-column:6/10;grid-row:4/4}.product-page-block-documents{grid-column:2/6;grid-row:5/5}.product-page-block-symbols{grid-column:6/10;grid-row:5/5}@media screen and (max-width: 950px){.default-padding{padding-top:20px;padding-bottom:20px}.m-padding{padding-top:15px;padding-bottom:15px}.s-padding{padding-top:5px;padding-bottom:5px}.page-wrapper{max-width:650px}.page-wrapper .page-wrapper-content{flex-direction:column;margin:30px 0}.page-wrapper .page-wrapper-content .page-wrapper-left{width:100%}.page-wrapper .page-wrapper-content .page-wrapper-right{width:100%}.product-page-block-alternatives ::ng-deep co-tile{width:284px!important}}@media screen and (max-width: 650px){[class*=-padding]{padding-left:0!important;padding-right:0!important}.product-page-block-addtocart ::ng-deep co-number-picker co-button{height:38px!important}.product-page-block-addtocart ::ng-deep co-number-picker co-input-text{height:38px!important;width:36px!important}.product-page-block-addtocart ::ng-deep co-button.cart-button{height:40px;font-size:13px}}\n"]
+                styles: [".page-wrapper{font-family:iOneMontserrat;font-size:12px;display:flex;flex-direction:column;max-width:100%;padding:0 15px;margin:0 auto}.page-wrapper-content{display:flex;flex-direction:row;margin:40px 0}.page-wrapper-content:first-child{margin-top:0}.page-wrapper-content.no-top-margin{margin-top:0}.page-wrapper-left{display:flex;width:65%;flex-direction:column}.page-wrapper-right{display:flex;width:35%;flex-direction:column}.page-wrapper-full{display:flex;width:100%;flex-direction:column}.page-wrapper-66{display:flex;width:60%;flex-direction:column}.page-wrapper-33{display:flex;width:40%;flex-direction:column}.threed-selections{display:none}.threed-selections.show-selections{display:block}.threed-selections ::ng-deep .rp-lite-selector .rp-answers-slideout ::ng-deep co-slideout{width:480px;z-index:3}.threed-selections ::ng-deep .co-summary-line{cursor:pointer}.product-action-buttons{position:relative}.product-action-buttons.full-screen{z-index:10}.product-image-container{grid-column:1/7;grid-row:1/6;position:relative}.product-page-block-selector-type{width:auto;position:absolute;top:10px;right:10px;z-index:2}.product-page-block-image{box-sizing:border-box;width:100%;z-index:1;position:relative}.product-page-block-image .threed-configurator{border:none}.product-page-block-image .threed-configurator .layer .viewer canvas{height:100%;width:100%}.product-page-block-image .threed-configurator ::ng-deep .rp-element-toolbar{top:30px}.product-page-block-image app-image-carousel.show-animated,.product-page-block-image threed-configurator.show-animated{opacity:1;z-index:0;transition:all .2s ease-in-out}.product-page-block-image .fullscreen-button{cursor:pointer;height:50px;width:50px;position:absolute;left:30px;z-index:100;top:30px}.product-page-block-image.full{grid-column:1/11;grid-row:2/span 10;z-index:3}.product-page-block-description{grid-column:7/12;grid-row:1/1}.product-page-block-additional{width:100%}.product-page-block-additional-description{width:100%}.product-page-block-price{grid-column:1/3;grid-row:2/2;align-self:center}.product-page-block-price.full{grid-column:1/5}.product-page-block-addtocart{grid-column:3/5;grid-row:2/2;align-self:center;padding-top:30px!important}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button:hover div.rippler{background:#f6f5f4}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button ::ng-deep co-icon{position:relative;z-index:2}.product-page-block-addtocart ::ng-deep co-button.cart-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-button.cart-button:hover{background:#74B77F}.addtocart-reserved{grid-column:1/3;grid-row:3/3}.product-page-block-stock{grid-column:1/3;grid-row:4/4}.product-page-block-delivery{grid-column:3/5;grid-row:4/4}::ng-deep co-scroll-container{overflow:hidden;position:relative}::ng-deep co-scroll-container .content-wrapper{padding:0}::ng-deep co-scroll-container .scroll-layer{left:0;top:0}::ng-deep co-scroll-container .scroll-layer .scroller{width:34px;height:34px;border-radius:36px;background:#fff;cursor:pointer;box-shadow:0 0 5px #0003}::ng-deep co-scroll-container .scroll-layer .scroller:hover{background:#f6f5f4}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll{left:5px}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll:before{border-width:0 3px 3px 0;padding:4px;margin-left:13px;margin-top:11px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll{right:5px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll:after{border-width:0 3px 3px 0;padding:4px;margin-left:9px;margin-top:11px}.product-page-block-variants{margin:20px 0 0}.product-page-block-variants ::ng-deep app-product-related>div{display:flex;grid-gap:15px;gap:15px;align-items:center;border-top:1px solid #f6f5f4;padding:5px 0 7px 15px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep app-header h3{font-size:14px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container{width:320px;max-width:100%;padding:0 16px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller{width:26px;height:26px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll{left:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll:before{border-width:0 2px 2px 0;margin-left:9px;margin-top:9px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll{right:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll:after{border-width:0 2px 2px 0;margin-left:6px;margin-top:9px}.product-page-block-variants ::ng-deep co-tile.small{min-width:50px!important;max-width:50px!important;border:1px solid #f6f5f4;margin:0 10px 0 0;border-radius:4px}.product-page-block-variants ::ng-deep co-tile.small:hover{border-color:#22313c}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper{padding:0}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-top{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image{height:40px!important;padding:5px;margin-bottom:10px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper .no-image{width:40px;height:40px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper span{display:none!important}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-bottom{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-extra-bottom{display:none}.product-page-block-alternatives ::ng-deep .article-wrapper{margin:0 20px 0 0}.product-page-block-alternatives ::ng-deep .article-wrapper:last-child{margin:0}.product-page-block-alternatives ::ng-deep co-tile{cursor:pointer;transition:all .14s ease-out;border:1px solid transparent;border-bottom-color:#f6f5f4;padding:15px 10px 0;width:319px;max-width:none;min-width:0;box-sizing:border-box}.product-page-block-alternatives ::ng-deep co-tile:hover{box-shadow:none;border-color:#f6f5f4}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper div.image co-image{transform:scale(1.05)}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper .tile-bottom{margin:0}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-extra-bottom .main .description{text-decoration:underline}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper{padding:0;position:relative;outline:none;overflow:hidden}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-top{position:absolute;left:0;top:0;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image{position:relative;padding:1px;display:flex;align-items:center;justify-content:center;overflow:hidden;max-width:250px;margin:0 auto 10px;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image:after{content:\"\";padding:100% 0 0;float:left;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image co-image{position:absolute;left:0;top:0;overflow:hidden;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;z-index:-1;transition:all .2s ease}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image .no-image-wrapper{position:absolute;display:flex;left:50%;top:50%;margin:-48px 0 0 -54px;flex-direction:column;align-items:center;opacity:.25}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom{transition:all .2s ease;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button{margin:0 0 5px!important;width:36px;height:36px;border:1px solid #22313C;cursor:pointer;border-radius:4px;padding:0!important;font-size:0}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button co-icon{width:32px;height:32px;margin:0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom{outline:none;padding:15px 0;background:transparent!important;min-height:60px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main{padding:0 10px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .description{font-size:15px;font-weight:bold;margin:0 0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .price{font-size:16px;margin:15px 0 0;font-weight:bold;color:#2b60a7}.product-page-block-additional-information{grid-column:1/6;grid-row:4/4}.product-page-block-properties{grid-column:7/10;grid-row:3/3}.product-page-block-related-articles{grid-column:2/6;grid-row:4/4}.product-page-block-alternative-articles{grid-column:6/10;grid-row:4/4}.product-page-block-documents{grid-column:2/6;grid-row:5/5}.product-page-block-symbols{grid-column:6/10;grid-row:5/5}@media screen and (max-width: 950px){.default-padding{padding-top:20px;padding-bottom:20px}.m-padding{padding-top:15px;padding-bottom:15px}.s-padding{padding-top:5px;padding-bottom:5px}.page-wrapper{max-width:650px}.page-wrapper .page-wrapper-content{flex-direction:column;margin:30px 0}.page-wrapper .page-wrapper-content .page-wrapper-left{width:100%}.page-wrapper .page-wrapper-content .page-wrapper-right{width:100%}.product-page-block-alternatives ::ng-deep co-tile{width:284px!important}}@media screen and (max-width: 650px){[class*=-padding]{padding-left:0!important;padding-right:0!important}.product-page-block-addtocart ::ng-deep co-number-picker co-button{height:38px!important}.product-page-block-addtocart ::ng-deep co-number-picker co-input-text{height:38px!important;width:36px!important}.product-page-block-addtocart ::ng-deep co-button.cart-button{height:40px;font-size:13px}}\n"]
             },] }
 ];
 ProductPageComponent.ctorParameters = () => [
@@ -1108,6 +1115,7 @@ ProductPageComponent.propDecorators = {
     createFrozenArticle: [{ type: Input }],
     isReturn: [{ type: Input }],
     showRelatedProductsPopup: [{ type: Input }],
+    enableRenderCarousel: [{ type: Input }],
     openStockEvent: [{ type: Output }]
 };
 
@@ -1136,11 +1144,18 @@ ProductSelectorTypeComponent.decorators = [
                 selector: 'app-product-selector-type',
                 template: `
         <div *ngIf="show2D || show3D" class="show-in" [textContent]="'SHOW_IN' | localize"></div>
-        <co-icon *ngIf="show2D" class="selector-type-icon"
+        <co-icon *ngIf="show2D && !showRenderCarousel" class="selector-type-icon"
+                 [class.active]="currentType === type.TwoD"
+                 [iconData]="twoDIcon"
+                 (click)="handleIconClick(type.TwoD)"
+        ></co-icon>
+
+        <co-icon *ngIf="show2D && showRenderCarousel" class="selector-type-icon"
                  [class.active]="currentType === type.TwoD"
                  [iconData]="twoDIcon"
                  (click)="handleIconClick(type.TwoD)"
         ></co-icon>
+
         <co-icon *ngIf="show3D" class="selector-type-icon"
                  [class.active]="currentType === type.ThreeD"
                  [iconData]="threeDIcon"
@@ -1157,6 +1172,7 @@ ProductSelectorTypeComponent.ctorParameters = () => [
 ProductSelectorTypeComponent.propDecorators = {
     show2D: [{ type: Input }],
     show3D: [{ type: Input }],
+    showRenderCarousel: [{ type: Input }],
     currentType: [{ type: Input }],
     onIconClick: [{ type: Output }],
     currentTypeChange: [{ type: Output }]
@@ -1360,6 +1376,7 @@ class ImageCarouselComponent {
         const resizeCanvas = document.createElement('canvas');
         const resizeCanvasContext = resizeCanvas.getContext('2d');
         const resizeImage = document.createElement('img');
+        resizeImage.crossOrigin = 'anonymous';
         resizeImage.onload = () => __awaiter(this, void 0, void 0, function* () {
             resizeCanvasContext.imageSmoothingEnabled = true;
             resizeCanvasContext.imageSmoothingQuality = 'high';
@@ -2698,6 +2715,149 @@ ProductDialogModule.decorators = [
             },] }
 ];
 
+class VectorObject {
+}
+class RenderParameters {
+}
+class RenderCarouselComponent {
+    constructor(iconCache, _appEventService, _changeDetector) {
+        this.iconCache = iconCache;
+        this._appEventService = _appEventService;
+        this._changeDetector = _changeDetector;
+        this.showRefresh = false;
+        this.resizing = false;
+        this.showLoader = true;
+        this.renderedImageLoaded = false;
+        // For now we will just use mock data
+        this.renderAngles = [0, -45, -90, -135, -180, -225, -270, -315];
+        this.currentRenderAngleIndex = 0;
+        this.icon = IconEnum;
+        this._subs = [];
+        this._subs.push(this._appEventService.onReadyToRender.subscribe((readyToRender) => {
+            if (readyToRender) {
+                this.showLoader = true;
+                this._createNewRender();
+            }
+        }), this._appEventService.onRenderStarted.subscribe(() => {
+            this.showLoader = true;
+            this._changeDetector.detectChanges();
+        }), this._appEventService.onRenderImageReceived.subscribe((image) => {
+            this.renderedImage = image;
+            this.showLoader = false;
+            this._changeDetector.detectChanges();
+        }));
+    }
+    handleWindowResize() {
+        this.resizing = true;
+        clearTimeout(this._resizeTimer);
+        this._resizeTimer = setTimeout(() => {
+            this.resizing = false;
+        }, 200);
+    }
+    gotoNextSlide() {
+        this.showLoader = true;
+        this.currentRenderAngleIndex = (this.currentRenderAngleIndex + 1) % this.renderAngles.length;
+        this._createNewRender();
+    }
+    gotoPrevSlide() {
+        this.showLoader = true;
+        this.currentRenderAngleIndex = (this.currentRenderAngleIndex - 1 + this.renderAngles.length) % this.renderAngles.length;
+        this._createNewRender();
+    }
+    ngOnDestroy() {
+        this.carousel = undefined;
+        this._subs.forEach(s => s.unsubscribe());
+    }
+    ngOnChanges() {
+        this.renderedImageLoaded = false;
+    }
+    onRenderLoaded() {
+        this.renderedImageLoaded = true;
+    }
+    _getRenderSettings() {
+        const settings = new RenderParameters();
+        const rotation = new VectorObject();
+        rotation.x = 0;
+        rotation.y = this.renderAngles[this.currentRenderAngleIndex];
+        rotation.z = 0;
+        settings.objectRotation = rotation;
+        settings.margin = 15;
+        return settings;
+    }
+    _createNewRender() {
+        this.showLoader = true;
+        this.renderedImageLoaded = false;
+        const renderParams = this._getRenderSettings();
+        this._appEventService.onGetRenderForRenderCarousel.next(renderParams);
+    }
+}
+RenderCarouselComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'app-render-carousel',
+                template: `
+    <div id="product_page_carousel">
+      <div id="product_page_carousel_render_items">
+        <co-loader [isShown]="showLoader"></co-loader>
+        <div #carousel class="inner-carousel">
+          <div class="inner-carousel-render">
+            <img
+              [src]="renderedImage"
+              [class.loaded]="renderedImageLoaded"
+              (load)="onRenderLoaded()"
+              class="fade-image"
+              alt="">
+          </div>
+          <div class="carousel-scroller-layer">
+            <div class="carousel-item-scroller prev" (click)="gotoPrevSlide()">
+              <co-icon [iconData]="iconCache.getIcon(icon.ArrowPointLeft)"></co-icon>
+            </div>
+            <div class="carousel-item-scroller next" (click)="gotoNextSlide()">
+              <co-icon [iconData]="iconCache.getIcon(icon.ArrowPointRight)"></co-icon>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  `,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [":host{max-height:540px;height:100%;position:relative}:host:not(.resizing) .inner-carousel{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}#product_page_carousel{position:relative}#product_page_carousel .refresh-button{position:absolute;bottom:10px;right:10px;background:#fff}#product_page_carousel .refresh-button.loading{animation:spin 1s linear infinite}#product_page_carousel .refresh-button:hover{box-shadow:none;background:#74B77F;transition:all .2s ease-in-out}#product_page_carousel .refresh-button:hover ::ng-deep svg path{fill:#fff!important}#product_page_carousel #product_page_carousel_render_items{position:relative;margin-bottom:10px;min-height:400px}#product_page_carousel #product_page_carousel_render_items ::ng-deep co-loader{position:absolute}#product_page_carousel .inner-carousel{display:flex;flex-direction:row;align-items:center;overflow:hidden;max-height:700px}#product_page_carousel .inner-carousel .inner-carousel-render img{width:100%;height:auto;-o-object-fit:contain;object-fit:contain}#product_page_carousel .carousel-scroller-layer{height:100%;width:100%;position:absolute;top:0;left:0;z-index:100}#product_page_carousel .carousel-scroller-layer .carousel-item-scroller{opacity:0;position:absolute;border-radius:50%;z-index:100;background:rgba(255,255,255,.4);color:#fff;width:30px;height:30px;top:calc(50% - 15px);cursor:pointer;transition:opacity .3s}#product_page_carousel .carousel-scroller-layer .carousel-item-scroller co-icon{color:#fff}#product_page_carousel .carousel-scroller-layer .prev{left:15px}#product_page_carousel .carousel-scroller-layer .next{right:15px}#product_page_carousel .carousel-scroller-layer:hover .carousel-item-scroller{opacity:1}#product_page_carousel #product_page_carousel_thumbs{display:flex;justify-content:flex-start;height:80px;margin-left:auto;margin-right:auto}#product_page_carousel #product_page_carousel_thumbs ::ng-deep co-scroll-container{padding:0 22px}#product_page_carousel #product_page_carousel_thumbs ::ng-deep co-scroll-container .content-wrapper{padding:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fade-image{opacity:0;transition:opacity 1.5s ease-in-out}.fade-image.loaded{opacity:1}\n"]
+            },] }
+];
+RenderCarouselComponent.ctorParameters = () => [
+    { type: IconCacheService },
+    { type: ProductEventService },
+    { type: ChangeDetectorRef }
+];
+RenderCarouselComponent.propDecorators = {
+    carousel: [{ type: ViewChild, args: ['carousel', { read: ElementRef },] }],
+    showRefresh: [{ type: Input }],
+    article: [{ type: Input }],
+    handleWindowResize: [{ type: HostListener, args: ['window:resize',] }],
+    gotoNextSlide: [{ type: HostListener, args: ['swipeleft',] }],
+    gotoPrevSlide: [{ type: HostListener, args: ['swiperight',] }],
+    resizing: [{ type: HostBinding, args: ['class.resizing',] }]
+};
+
+class RenderCarouselModule {
+}
+RenderCarouselModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    LoaderModule,
+                    ScrollContainerModule,
+                    IconModule,
+                    IconCollapseHandleModule
+                ],
+                declarations: [
+                    RenderCarouselComponent
+                ],
+                exports: [
+                    RenderCarouselComponent
+                ]
+            },] }
+];
+
 class ProductPageModule {
 }
 ProductPageModule.decorators = [
@@ -2717,7 +2877,8 @@ ProductPageModule.decorators = [
                     ProductInfoTabsModule,
                     PipeModule,
                     ProductDialogModule,
-                    LoaderModule$1
+                    LoaderModule$1,
+                    RenderCarouselModule
                 ],
                 schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 declarations: [
@@ -3143,7 +3304,7 @@ class IoneProductModule {
 IoneProductModule.decorators = [
     { type: NgModule, args: [{
                 imports: [
-                    //BrowserAnimationsModule,
+                    // BrowserAnimationsModule,
                     CommonModule,
                     ProductPageModule,
                     ProductHdModule,
@@ -3162,12 +3323,6 @@ IoneProductModule.decorators = [
                 ],
                 bootstrap: [
                     IoneProductComponent
-                ],
-                providers: [
-                    ProductSettingsService,
-                    ProductConnectorService,
-                    ProductEventService,
-                    ProductConnectorAdapterService
                 ]
             },] }
 ];
@@ -3176,5 +3331,5 @@ IoneProductModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { IoneProductComponent, IoneProductModule, ProductConnectorAdapterService, ProductConnectorService, ProductEventService, ProductExternalSourceComponent, ProductExternalSourceModule, ProductSettingsService, Version, ProductPageModule as ɵa, ProductSelectorTypeModule as ɵb, ProductInfoTabsModule as ɵba, ProductAdditionalInfoModule as ɵbb, ProductAdditionalInfoComponent as ɵbc, ProductPropertiesModule as ɵbd, ProductPropertiesComponent as ɵbe, ProductDocumentModule as ɵbf, ProductDocumentsComponent as ɵbg, ProductSymbolsModule as ɵbh, ProductSymbolsComponent as ɵbi, ProductInfoTabsComponent as ɵbj, ProductDialogModule as ɵbk, ProductDialogComponent as ɵbl, ProductPageComponent as ɵbm, ProductHdModule as ɵbn, ProductHdComponent as ɵbo, ProductScriptLoaderService as ɵbp, PipeModule as ɵc, LocalizePipe as ɵd, DictionaryService as ɵe, JsonUtilsService as ɵf, ProductSelectorTypeComponent as ɵg, IconCacheService as ɵh, ImageCarouselModule as ɵi, ImageCarouselComponent as ɵj, ProductDescriptionModule as ɵk, ProductDescriptionComponent as ɵl, ProductAdditionalDescriptionModule as ɵm, ProductAdditionalDescriptionComponent as ɵn, ProductPriceModule as ɵo, ProductPriceComponent as ɵp, ProductAddtocartModule as ɵq, ProductAddtocartComponent as ɵr, ProductRelatedModule as ɵs, HeaderModule as ɵt, HeaderComponent as ɵu, ProductRelatedComponent as ɵv, ProductStockModule as ɵw, ProductStockComponent as ɵx, ProductDeliveryModule as ɵy, ProductDeliveryComponent as ɵz };
+export { IoneProductComponent, IoneProductModule, ProductConnectorAdapterService, ProductConnectorService, ProductEventService, ProductExternalSourceComponent, ProductExternalSourceModule, ProductSettingsService, Version, ProductPageModule as ɵa, ProductSelectorTypeModule as ɵb, ProductInfoTabsModule as ɵba, ProductAdditionalInfoModule as ɵbb, ProductAdditionalInfoComponent as ɵbc, ProductPropertiesModule as ɵbd, ProductPropertiesComponent as ɵbe, ProductDocumentModule as ɵbf, ProductDocumentsComponent as ɵbg, ProductSymbolsModule as ɵbh, ProductSymbolsComponent as ɵbi, ProductInfoTabsComponent as ɵbj, ProductDialogModule as ɵbk, ProductDialogComponent as ɵbl, RenderCarouselModule as ɵbm, RenderCarouselComponent as ɵbn, ProductPageComponent as ɵbo, ProductHdModule as ɵbp, ProductHdComponent as ɵbq, ProductScriptLoaderService as ɵbr, PipeModule as ɵc, LocalizePipe as ɵd, DictionaryService as ɵe, JsonUtilsService as ɵf, ProductSelectorTypeComponent as ɵg, IconCacheService as ɵh, ImageCarouselModule as ɵi, ImageCarouselComponent as ɵj, ProductDescriptionModule as ɵk, ProductDescriptionComponent as ɵl, ProductAdditionalDescriptionModule as ɵm, ProductAdditionalDescriptionComponent as ɵn, ProductPriceModule as ɵo, ProductPriceComponent as ɵp, ProductAddtocartModule as ɵq, ProductAddtocartComponent as ɵr, ProductRelatedModule as ɵs, HeaderModule as ɵt, HeaderComponent as ɵu, ProductRelatedComponent as ɵv, ProductStockModule as ɵw, ProductStockComponent as ɵx, ProductDeliveryModule as ɵy, ProductDeliveryComponent as ɵz };
 //# sourceMappingURL=colijnit-product.js.map