@colijnit/configurator 259.1.1 → 259.1.2

package/configurator/main.js

@@ -0,0 +1,3555 @@
+(self["webpackChunk_colijnit_configurator"] = self["webpackChunk_colijnit_configurator"] || []).push([["main"],{
+
+/***/ 98255:
+/*!*******************************************************!*\
+  !*** ./$_lazy_route_resources/ lazy namespace object ***!
+  \*******************************************************/
+/***/ ((module) => {
+
+function webpackEmptyAsyncContext(req) {
+	// Here Promise.resolve().then() is used instead of new Promise() to prevent
+	// uncaught exception popping up in devtools
+	return Promise.resolve().then(() => {
+		var e = new Error("Cannot find module '" + req + "'");
+		e.code = 'MODULE_NOT_FOUND';
+		throw e;
+	});
+}
+webpackEmptyAsyncContext.keys = () => ([]);
+webpackEmptyAsyncContext.resolve = webpackEmptyAsyncContext;
+webpackEmptyAsyncContext.id = 98255;
+module.exports = webpackEmptyAsyncContext;
+
+/***/ }),
+
+/***/ 55041:
+/*!**********************************!*\
+  !*** ./src/app/app.component.ts ***!
+  \**********************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.AppComponent = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const core_1 = __webpack_require__(/*! @angular/core */ 2316);
+const OrbitControls_1 = __webpack_require__(/*! three/examples/jsm/controls/OrbitControls */ 36668);
+const axios_1 = tslib_1.__importDefault(__webpack_require__(/*! axios */ 61172));
+const GLTFLoader_1 = __webpack_require__(/*! three/examples/jsm/loaders/GLTFLoader */ 43022);
+const three_1 = __webpack_require__(/*! three */ 30712);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+const i1 = tslib_1.__importStar(__webpack_require__(/*! ./builder */ 24529));
+const i2 = tslib_1.__importStar(__webpack_require__(/*! @angular/common */ 54364));
+const i3 = tslib_1.__importStar(__webpack_require__(/*! ./components/selections/selections.component */ 42226));
+const i4 = tslib_1.__importStar(__webpack_require__(/*! ./components/answers/answers.component */ 84780));
+const _c0 = ["canvas"];
+function AppComponent_selections_3_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "selections", 5);
+    i0.ɵɵlistener("selectionClick", function AppComponent_selections_3_Template_selections_selectionClick_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r3 = i0.ɵɵnextContext(); return ctx_r3.selectSelection($event); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("selections", ctx_r1.selections);
+} }
+function AppComponent_answers_4_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "answers", 6);
+    i0.ɵɵlistener("answerClick", function AppComponent_answers_4_Template_answers_answerClick_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r5 = i0.ɵɵnextContext(); return ctx_r5.selectAnswer($event); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("selectionTitle", ctx_r2.selectionTitle)("answers", ctx_r2.answers);
+} }
+// @ts-ignore
+window.loadGLTF = (file, isFile = true) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+    const gltfLoader = new GLTFLoader_1.GLTFLoader();
+    try {
+        return new Promise((resolve) => {
+            if (isFile) {
+                gltfLoader.load(file, (obj) => {
+                    resolve(obj.scene);
+                });
+            }
+            else {
+                gltfLoader.parse(file, null, (obj) => {
+                    resolve(obj.scene);
+                });
+            }
+        });
+    }
+    catch (e) {
+        console.error(e);
+        return null;
+    }
+});
+// @ts-ignore
+window.downloadVariation = (fileName) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+    try {
+        const hqFileName = fileName.replace('/variation/', '/variation/HQ/');
+        const response = yield axios_1.default({
+            method: "get",
+            url: `${hqFileName}`,
+            responseType: "arraybuffer"
+        });
+        return yield response.data;
+    }
+    catch (e) {
+        try {
+            const response = yield axios_1.default({
+                method: "get",
+                url: `${fileName}`,
+                responseType: "arraybuffer"
+            });
+            if (response.status !== 200) {
+                console.error(response.statusText);
+            }
+            return yield response.data;
+        }
+        catch (e) {
+            console.error(`Error downloading: ${fileName}`);
+        }
+    }
+});
+class AppComponent {
+    // private _goodId: number = 39221;
+    // private _instanceId: string = '96423';
+    // private _sku: string = '6373';
+    // private _goodId: number = 300868;
+    // private _instanceId: string = '321560';
+    // private _sku: string = '4358';
+    constructor(_builder) {
+        this._builder = _builder;
+        this.selections = [];
+        this.decos = [];
+        this.answers = [];
+        this.showAnswers = false;
+        this.showSelections = true;
+        this.scene = new three_1.Scene();
+        this._subs = [];
+        this._options = {
+            url: "https://3dmrp.ionecloud.nl/ione/",
+            version: "252",
+            schema: "134974"
+        };
+        // private _options: Options = {
+        //     url: "https://ione.simonealbani.com:8443/ione",
+        //     version: "250",
+        //     schema: "31416"
+        // };
+        // private _options: Options = {
+        //   url: "https://3dshared.ionecloud.nl/ione/",
+        //   version: "250",
+        //   schema: "67325"
+        // };
+        this._goodId = 238702;
+        this._instanceId = '184141';
+        this._sku = '1523';
+    }
+    ngAfterViewInit() {
+        // this._builder = new Builder();
+        this._builder.init(this.scene, this._options);
+        this._subs.push(this._builder.selectionsReceived.subscribe((selections) => {
+            this.selections = selections;
+        }), this._builder.decosReceived.subscribe((decos) => {
+            this.decos = decos;
+        }), this._builder.articleLoaded.subscribe((article) => {
+            if (article) {
+                this.article = article;
+            }
+        }), this._builder.answersReceived.subscribe((answers) => {
+            this.answers = answers;
+            this.showAnswers = this.answers.length > 0;
+        }), this._builder.modelLoaded.subscribe((object) => {
+            if (object && this.answers.length === 0) {
+                this._loadModel(object);
+            }
+        }));
+        this._initScene();
+        this._initRenderer();
+        this._initCameraAndControls();
+        this._initLights();
+        // this._test();
+        this._animate();
+        this._builder.buildModel(this._sku, this._instanceId, this._goodId);
+    }
+    ngOnDestroy() {
+        this._subs.forEach(s => s.unsubscribe());
+    }
+    disableControls() {
+        this.controls.enabled = false;
+    }
+    enableControls() {
+        this.controls.enabled = true;
+    }
+    selectSelection(selection) {
+        this._builder.selectSelection(selection);
+        this.selectionTitle = selection.commercialQuestion;
+        this.showSelections = false;
+    }
+    selectAnswer(answer) {
+        this._builder.selectAnswer(answer);
+        this.selectionTitle = ' . . / ' + answer.answer;
+    }
+    render() {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const data = {
+                selections: this.selections,
+                decos: this.decos,
+                assetUrl: this.article.assetUrl,
+                cdnUrl: this.article.contentDeliveryUrl,
+                schema: this.article.distSchema
+            };
+            const result = yield axios_1.default({
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                method: 'POST',
+                data: JSON.stringify(data),
+                url: 'http://localhost:3000/getRenderFromData',
+                responseType: "json"
+            });
+            if (result.status === 200) {
+                console.log('success!');
+            }
+        });
+    }
+    _initScene() {
+        this.scene = new three_1.Scene();
+    }
+    _initRenderer() {
+        this.renderer = new three_1.WebGLRenderer({
+            alpha: true,
+            antialias: true,
+            preserveDrawingBuffer: true
+        });
+        this.renderer.setClearColor(0xfafafa);
+        this.renderer.autoClear = true;
+        this.renderer.setPixelRatio(window.devicePixelRatio);
+        this.renderer.shadowMap.enabled = true;
+        // Use PCFShadowMap to enable radius else use PCFSoftShadowMap
+        this.renderer.shadowMap.type = three_1.PCFSoftShadowMap;
+        // this.renderer.outputEncoding = THREE.sRGBEncoding;
+        // this.renderer.gammaFactor = 2.2;
+        // this.renderer.toneMappingExposure = 1.1;
+        this.canvasElement.nativeElement.appendChild(this.renderer.domElement);
+    }
+    _initCameraAndControls() {
+        this.camera = new three_1.PerspectiveCamera(45, 1, 0.01, 100);
+        this.controls = new OrbitControls_1.OrbitControls(this.camera, this.renderer.domElement);
+        this.camera.position.set(0, 3, 1.5);
+        this.controls.update();
+    }
+    _animate() {
+        this.renderer.setAnimationLoop(() => this._render());
+    }
+    _render() {
+        this._checkCanvasResize();
+        this.renderer.render(this.scene, this.camera);
+    }
+    _checkCanvasResize() {
+        const canvas = this.renderer.domElement;
+        if (this.canvasElement.nativeElement.clientWidth !== canvas.width || this.canvasElement.nativeElement.clientHeight !== canvas.height) {
+            this._updateWindowSize();
+        }
+    }
+    _updateWindowSize() {
+        this._resizeRendererToDisplaySize();
+        const canvas = this.renderer.domElement;
+        const aspect = canvas.width / canvas.height;
+        this.camera.aspect = aspect;
+        this.camera.updateProjectionMatrix();
+    }
+    _resizeRendererToDisplaySize() {
+        this.renderer.setSize(this.canvasElement.nativeElement.clientWidth, this.canvasElement.nativeElement.clientHeight, false);
+    }
+    _test() {
+        const mat = new three_1.MeshBasicMaterial({ color: 'blue' });
+        const geo = new three_1.BoxGeometry(1, 1, 1);
+        const mesh = new three_1.Mesh(geo, mat);
+        this.scene.add(mesh);
+    }
+    _loadModel(object) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            object.name = this._sku;
+            object.visible = true;
+            const objectFromScene = this.scene.getObjectByName(this._sku);
+            if (objectFromScene) {
+                this.scene.remove(objectFromScene);
+            }
+            this.scene.add(object);
+        });
+    }
+    _initLights() {
+        const ambientLight = new three_1.AmbientLight('#595959', 1.2);
+        ambientLight.name = 'ambientLight';
+        const directional = new three_1.DirectionalLight('white', 1);
+        directional.position.set(0, 2, 0);
+        directional.castShadow = true;
+        const spotLight1 = new three_1.SpotLight('white');
+        spotLight1.power = 400;
+        spotLight1.decay = 2;
+        spotLight1.position.set(-3, 8, -3);
+        spotLight1.castShadow = true;
+        const spotLight2 = new three_1.SpotLight('white');
+        spotLight2.power = 400;
+        spotLight2.decay = 2;
+        spotLight2.position.set(3, 8, -3);
+        spotLight2.castShadow = true;
+        const spotLight3 = new three_1.SpotLight('white');
+        spotLight3.power = 400;
+        spotLight3.decay = 2;
+        spotLight3.position.set(-3, 8, 3);
+        spotLight3.castShadow = true;
+        const spotLight4 = new three_1.SpotLight('white');
+        spotLight4.power = 400;
+        spotLight4.decay = 2;
+        spotLight4.position.set(3, 8, 3);
+        spotLight4.castShadow = true;
+        const hemiSphere = new three_1.HemisphereLight('white', 'green', 0.15);
+        this.scene.add(ambientLight, directional, spotLight1, spotLight2, spotLight3, spotLight4, hemiSphere);
+    }
+}
+exports.AppComponent = AppComponent;
+AppComponent.ɵfac = function AppComponent_Factory(t) { return new (t || AppComponent)(i0.ɵɵdirectiveInject(i1.Builder)); };
+AppComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AppComponent, selectors: [["app-root"]], viewQuery: function AppComponent_Query(rf, ctx) { if (rf & 1) {
+        i0.ɵɵviewQuery(_c0, 5, core_1.ElementRef);
+    } if (rf & 2) {
+        let _t;
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.canvasElement = _t.first);
+    } }, decls: 5, vars: 2, consts: [["type", "button", "value", "Render", 2, "position", "fixed", "top", "10px", "left", "10px", "background-color", "blue", "color", "white", 3, "click"], [1, "canvas"], ["canvas", ""], [3, "selections", "selectionClick", 4, "ngIf"], [3, "selectionTitle", "answers", "answerClick", 4, "ngIf"], [3, "selections", "selectionClick"], [3, "selectionTitle", "answers", "answerClick"]], template: function AppComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "input", 0);
+        i0.ɵɵlistener("click", function AppComponent_Template_input_click_0_listener() { return ctx.render(); });
+        i0.ɵɵelementEnd();
+        i0.ɵɵelement(1, "div", 1, 2);
+        i0.ɵɵtemplate(3, AppComponent_selections_3_Template, 1, 1, "selections", 3);
+        i0.ɵɵtemplate(4, AppComponent_answers_4_Template, 1, 2, "answers", 4);
+    } if (rf & 2) {
+        i0.ɵɵadvance(3);
+        i0.ɵɵproperty("ngIf", !ctx.showAnswers);
+        i0.ɵɵadvance(1);
+        i0.ɵɵproperty("ngIf", ctx.showAnswers);
+    } }, directives: [i2.NgIf, i3.SelectionsComponent, i4.AnswersComponent], encapsulation: 2 });
+
+
+/***/ }),
+
+/***/ 36747:
+/*!*******************************!*\
+  !*** ./src/app/app.module.ts ***!
+  \*******************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.AppModule = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const app_component_1 = __webpack_require__(/*! ./app.component */ 55041);
+const common_1 = __webpack_require__(/*! @angular/common */ 54364);
+const animations_1 = __webpack_require__(/*! @angular/platform-browser/animations */ 20718);
+const selections_module_1 = __webpack_require__(/*! ./components/selections/selections.module */ 715);
+const answers_module_1 = __webpack_require__(/*! ./components/answers/answers.module */ 8852);
+const builder_1 = __webpack_require__(/*! ./builder */ 24529);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class AppModule {
+}
+exports.AppModule = AppModule;
+AppModule.ɵfac = function AppModule_Factory(t) { return new (t || AppModule)(); };
+AppModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: AppModule, bootstrap: [app_component_1.AppComponent] });
+AppModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
+        builder_1.Builder
+    ], imports: [[
+            animations_1.BrowserAnimationsModule,
+            common_1.CommonModule,
+            selections_module_1.SelectionsModule,
+            answers_module_1.AnswersModule
+        ]] });
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(AppModule, { declarations: [app_component_1.AppComponent], imports: [animations_1.BrowserAnimationsModule,
+        common_1.CommonModule,
+        selections_module_1.SelectionsModule,
+        answers_module_1.AnswersModule], exports: [app_component_1.AppComponent] }); })();
+
+
+/***/ }),
+
+/***/ 24529:
+/*!****************************!*\
+  !*** ./src/app/builder.ts ***!
+  \****************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.Builder = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const THREE = tslib_1.__importStar(__webpack_require__(/*! three */ 30712));
+const deco_node_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/model/deco-node */ 67938);
+const selection_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/model/selection */ 58427);
+const deco_node_type_enum_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/enum/deco-node-type.enum */ 63447);
+const threed_utils_1 = __webpack_require__(/*! ../utils/threed.utils */ 22674);
+const deco_node_kind_enum_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/enum/deco-node-kind.enum */ 92348);
+const scene_utils_1 = __webpack_require__(/*! ../utils/scene-utils */ 78606);
+const variation_helper_1 = __webpack_require__(/*! ../helper/variation-helper */ 41086);
+const article_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/model/article */ 64578);
+const configurator_service_1 = __webpack_require__(/*! ./services/configurator.service */ 13965);
+const rxjs_1 = __webpack_require__(/*! rxjs */ 67740);
+const image_utils_1 = __webpack_require__(/*! ../utils/image.utils */ 22700);
+const object_utils_1 = __webpack_require__(/*! ./utils/object.utils */ 30609);
+const node_type_enum_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/enum/node-type.enum */ 3085);
+const business_object_factory_1 = __webpack_require__(/*! @colijnit/ioneconnector/build/service/business-object-factory */ 47124);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class Builder {
+    constructor() {
+        this.selectionsReceived = new rxjs_1.BehaviorSubject([]);
+        this.articleLoaded = new rxjs_1.BehaviorSubject(undefined);
+        this.decosReceived = new rxjs_1.BehaviorSubject([]);
+        this.answersReceived = new rxjs_1.BehaviorSubject([]);
+        this.modelLoaded = new rxjs_1.BehaviorSubject(null);
+        this._selections = [];
+        this._answers = [];
+        this._decos = [];
+        this._placedAdjustables = [];
+        this._placedAddables = [];
+        this._adjustables = [];
+        this._addables = [];
+        this._imageCache = new Map();
+        this._articleCache = new Map();
+    }
+    set debug(value) {
+        if (value) {
+            this._debug = value;
+            if (this._variationHelper) {
+                this._variationHelper.debug = this._debug;
+            }
+        }
+    }
+    get debug() {
+        return this._debug;
+    }
+    init(scene, options) {
+        this._boFactory = new business_object_factory_1.BusinessObjectFactory();
+        this._threedUtils = new threed_utils_1.ThreedUtils();
+        this._variationHelper = new variation_helper_1.VariationHelper();
+        this._variationHelper.debug = this._debug;
+        if (!scene) {
+            throw 'No scene object provided!';
+        }
+        this._configuratorService = new configurator_service_1.ConfiguratorService();
+        // this._imageCacheService = new ImageCacheService();
+        if (options) {
+            this._configuratorService.initApi(options);
+        }
+        this._scene = scene;
+    }
+    buildModel(sku, instanceId, goodId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!this._scene) {
+                return;
+            }
+            try {
+                yield this._setInstanceId(sku, instanceId, goodId);
+                yield this._prepareConfiguration(this._sku, this._goodId);
+                if (this._source) {
+                    yield this._configuratorService.setInstanceToConfigure(this._instanceId);
+                    const promises = [];
+                    this._reset();
+                    promises.push(this.getQuestionAndAnswers());
+                    promises.push(this._getSelections(this._instanceId));
+                    promises.push(this._getDecos());
+                    yield Promise.all(promises);
+                    if (this._answers.length > 0) {
+                        return;
+                    }
+                    this._linkSelectionsAndDecos();
+                    this._prepareTheSelections();
+                    this._preloadMaterials();
+                    const build = yield this._build();
+                    return build;
+                }
+                else {
+                    throw 'GLB source not found!';
+                }
+            }
+            catch (e) {
+                throw e;
+            }
+        });
+    }
+    buildModelFromData(selections, decos, assetUrl, cdnUrl, schema) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                if (!this._scene) {
+                    reject('no scene provided!');
+                }
+                try {
+                    this._log('start build');
+                    yield this._downloadAsset(assetUrl, cdnUrl, schema);
+                    if (selections && selections.length > 1 && decos && decos.length > 0 && this._source) {
+                        this._reset();
+                        this._selections = selections;
+                        this._decos = decos;
+                        this._linkSelectionsAndDecos();
+                        this._prepareTheSelections();
+                        this._preloadMaterials();
+                        const build = yield this._build();
+                        this._cleanUp();
+                        this._log('finish build');
+                        resolve(build);
+                    }
+                    else {
+                        reject('Unsufficient data provided!');
+                    }
+                }
+                catch (e) {
+                    reject(e);
+                }
+            }));
+        });
+    }
+    initNodeInstance(goodId) {
+        return this._configuratorService.initNodeInstance(goodId);
+    }
+    destroy() {
+        this._threedUtils.clearCache();
+        this._variationHelper.clearCache();
+    }
+    selectSelection(selection) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            yield this._configuratorService.selectSelection(selection, false);
+            yield this.getQuestionAndAnswers();
+        });
+    }
+    getQuestionAndAnswers(publicationCode) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const questionsAndAnswers = yield this._configuratorService.getQuestionAndAnswers(false, publicationCode);
+            this._answers = questionsAndAnswers.answers;
+            this.answersReceived.next(questionsAndAnswers.answers);
+        });
+    }
+    selectAnswer(answer) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            yield this._configuratorService.selectAnswer(answer, false);
+            yield this.getQuestionAndAnswers();
+            if (this._answers.length === 0) {
+                this._build();
+            }
+        });
+    }
+    getImageForSelectionOrAnswer(object) {
+        const includeMimeType = true, thumb = true;
+        return new Promise((resolve, reject) => {
+            if (object && object.nodeId) {
+                if (!this._imageCache.has(object.nodeId)) {
+                    return this._configuratorService.getSingleImage(object.nodeId, 4, includeMimeType, thumb, true)
+                        .then((responseData) => {
+                        const base64 = this._handleResponseData(includeMimeType, thumb, responseData);
+                        this._imageCache.set(object.nodeId, base64);
+                        resolve(base64);
+                    }).catch(() => {
+                        reject();
+                    });
+                }
+                else {
+                    resolve(this._imageCache.get(object.nodeId));
+                }
+            }
+            else {
+                reject();
+            }
+        });
+    }
+    _cleanUp() {
+        this._sku = undefined;
+        this._goodId = undefined;
+        this._instanceId = undefined;
+        this._variationHelper.clearCache();
+    }
+    _handleResponseData(includeMimetype, thumb, responseData) {
+        if (responseData && responseData.resultObject) {
+            if (responseData.resultObject.filePath !== null && responseData.resultObject.filePath !== "") {
+                return image_utils_1.ImageUtils.getFixedImageFilepathUrl(responseData.resultObject.filePath);
+            }
+            else {
+                if (includeMimetype) {
+                    return image_utils_1.ImageUtils.getDocBodyWithMimeTypeDefinition(responseData.resultObject.fileName, thumb ? responseData.resultObject.thumbnailBody : responseData.resultObject.documentBody);
+                }
+                else {
+                    return thumb ? responseData.resultObject.thumbnailBody : responseData.resultObject.documentBody;
+                }
+            }
+        }
+        else {
+            return '';
+        }
+    }
+    _preloadMaterials() {
+        this._variationHelper.preloadVariations(this._decos
+            .filter(d => d.gameObjectName && d.type === deco_node_type_enum_1.DecoNodeType.Variation)
+            .map(d => d.gameObjectName));
+    }
+    _setInstanceId(sku, instanceId, goodId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!instanceId && !this._instanceId) {
+                if (!goodId) {
+                    goodId = yield this._getGoodIdFromSku(sku);
+                }
+                this._goodId = goodId;
+                const result = yield this.initNodeInstance(this._goodId);
+                if (result && result.resultObject) {
+                    this._instanceId = result.resultObject;
+                }
+                else {
+                    throw 'Failed to initialize node instance';
+                }
+            }
+            else if (!this._instanceId) {
+                this._instanceId = instanceId;
+            }
+            if (!this._sku) {
+                this._sku = sku;
+            }
+        });
+    }
+    _prepareConfiguration(sku, goodId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const article = yield this._getArticle(sku, goodId);
+            if (article && article.assetUrl) {
+                if (article.contentDeliveryUrl) {
+                    this._variationHelper.assetPath =
+                        article.contentDeliveryUrl +
+                            (article.contentDeliveryUrl.endsWith('/') ? '' : '/') +
+                            (article.distSchema ? article.distSchema : 'UP_DBA');
+                }
+                yield this._downloadAsset(article.assetUrl, article.contentDeliveryUrl, article.distSchema);
+            }
+        });
+    }
+    _downloadAsset(assetUrl, cdnUrl, schema) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            this._source = yield this._threedUtils.download3DSource(assetUrl, cdnUrl)
+                .catch((error) => {
+                throw error;
+            });
+            if (cdnUrl) {
+                this._variationHelper.assetPath =
+                    cdnUrl +
+                        (cdnUrl.endsWith('/') ? '' : '/') +
+                        (schema ? schema : 'UP_DBA');
+            }
+        });
+    }
+    _build() {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const adjustables = this._getAdjustables();
+            if (adjustables && adjustables.length === 0 && this._selections && this._selections.length > 0) { // check if article has a gameObject
+                if (this._selections[0].nodeType === node_type_enum_1.NodeType.Article && this._selections[0].gameObject) {
+                    adjustables.push(this._selections[0]);
+                }
+            }
+            if (adjustables && adjustables.length > 0) {
+                const obj = new THREE.Object3D();
+                obj.visible = false; // no need to render visualy
+                this._scene.add(obj);
+                let connected = false;
+                this._log('build main model');
+                for (let i = 0, len = adjustables.length; i < len; i++) {
+                    const adjustable = this._createAdjustable(obj, adjustables[i]);
+                    if (adjustable) {
+                        for (let ii = 0, lenii = this._placedAdjustables.length; ii < lenii; ii++) {
+                            if (scene_utils_1.SceneUtils.TrySelectorConnection(this._scene, obj, this._placedAdjustables[ii], adjustable, i === 1)) {
+                                this._placedAdjustables[ii].visible = true;
+                                adjustable.visible = true;
+                                connected = true;
+                                break;
+                            }
+                            connected = false;
+                        }
+                    }
+                    if (!connected && this._placedAdjustables.length > 1) {
+                        console.warn('No connection found for: ', adjustable.name);
+                    }
+                }
+                this._log('place addables');
+                this._placeAddables(obj);
+                this._log('update pivot');
+                this._updatePivot(obj);
+                this._log('load variations');
+                yield this._loadVariations(obj);
+                // this._variationHelper.clearCache();
+                this._log('remove from scene');
+                this._scene.remove(obj);
+                object_utils_1.ObjectUtils.DisposeObject(this._source);
+                // this._cleanUp();
+                this._log('ready!');
+                this.modelLoaded.next(obj);
+                return obj;
+            }
+            else {
+                throw 'No adjustables found!';
+                // this._building = false;
+                // if (this.selections.length < 2) {
+                //     this._errorService.addError(this.activeInstance, {message: 'NO_SELECTIONS_OR_DECOS', description: 'NO_SELECTIONS_OR_DECOS_INFO'});
+                //     this.buildFinished.next({instanceId: this.activeInstance, resultType: ResultType.NoSelections});
+                // } else if (this.decos.size === 0) {
+                //     this._errorService.addError(this.activeInstance, {message: 'NO_SELECTIONS_OR_DECOS', description: 'NO_SELECTIONS_OR_DECOS_INFO'});
+                //     this.buildFinished.next({instanceId: this.activeInstance, resultType: ResultType.NoDecoNodes});
+                // } else {
+                //     this._errorService.addError(this.activeInstance, {message: 'NO_ADJUSTABLES', description: 'NO_ADJUSTABLES_INFO'});
+                //     this.buildFinished.next({instanceId: this.activeInstance, resultType: ResultType.NoAdjustables});
+                // }
+            }
+        });
+    }
+    _prepareTheSelections() {
+        const selections = this._selections.slice();
+        const selectionOfArticle = selections.find(s => s.nodeType === node_type_enum_1.NodeType.Article);
+        const adjustableSelections = selections.filter(s => s.addAdjust === '2');
+        const isArticleWithMaterial = adjustableSelections.length === 0 &&
+            selectionOfArticle.gameObject &&
+            selectionOfArticle.gameObject.length > 0;
+        // get generic variations
+        const globalVariations = this._selections
+            .filter(s => (s.generic || adjustableSelections.length === 1) && s.decoNode.variation && !s.decoNode.type)
+            .map((value, index, array) => {
+            // find selection of variation
+            const sel = this._selections.find(s => s.artNodeIdDeco === value.decoNode.variation.parentId);
+            if (sel) {
+                value.decoNode.variation.supplierArticleNr = sel.supplierArticleNr;
+            }
+            value.decoNode.variation.materialId = this._getMaterialIdFromParent(value.node);
+            return value.decoNode.variation;
+        });
+        // commented out for the moment
+        // globalVariations.forEach(g => {
+        //   const parentIdx = selections.findIndex(s => s.decoNode && s.decoNode.id === g.parentId);
+        //   if (parentIdx) { // remove parent selection
+        //     selections.splice(parentIdx, 1);
+        //   }
+        //   const idx = selections.findIndex(s => s.decoNode && s.decoNode.id === g.id);
+        //   if (idx) { // move generic variations to top
+        //     const selection = selections[idx];
+        //     selections.splice(idx, 1);
+        //     selections.unshift(selection);
+        //   }
+        // });
+        // const usedVariations: FurniturePartVariation[] = [];
+        let globalVariationsRewrite = true;
+        const len = selections.length;
+        let lastAdded;
+        let lastAdjustable;
+        let newPart = false;
+        let previousPresLevel = -1;
+        let positioning;
+        let optionText;
+        for (let i = 0; i < len; i++) {
+            const selection = selections[i];
+            if (selection.presentationLevel === 1) {
+                positioning = selection.hdecoPositioning;
+                optionText = selection.question;
+            }
+            if (selection.presentationLevel > previousPresLevel) {
+                selection.hdecoPositioning = selection.hdecoPositioning || positioning;
+            }
+            if (selection.decoNode) {
+                if (selection.decoNode.type === deco_node_type_enum_1.DecoNodeType.Variation) {
+                    const decoNode = selection.decoNode;
+                    decoNode.optionText = optionText;
+                    // find selection of variation and set materialId in case of multimaterial
+                    decoNode.materialId = this._getMaterialIdFromParent(decoNode.nodeId);
+                    if (lastAdded) {
+                        if (newPart) {
+                            if (decoNode.materialId) {
+                                if (!lastAdded.variations.find(v => v.id === decoNode.id)) {
+                                    lastAdded.variations.push(decoNode);
+                                }
+                            }
+                            else {
+                                lastAdded.variations = [decoNode];
+                            }
+                        }
+                        else {
+                            if (!lastAdded.variations.find(v => v.id === decoNode.id)) {
+                                lastAdded.variations.push(decoNode);
+                            }
+                        }
+                        newPart = false;
+                    }
+                    else {
+                        if (globalVariationsRewrite) {
+                            globalVariations.length = 0;
+                            globalVariationsRewrite = false;
+                        }
+                        if (!globalVariations.find(v => v.id === decoNode.id)) {
+                            globalVariations.push(decoNode);
+                        }
+                    }
+                    // const variation: FurniturePartVariation = new FurniturePartVariation();
+                    // variation.BrandId = selection.decoNode.brandId;
+                    // variation.Description = selection.decoNode.gameObjectName;
+                    // variation.MaterialId = (selection.decoNode as any).materialId;
+                    // variation.SupplierArticleNr = (selection.decoNode as any).supplierArticleNr;
+                    // usedVariations.push(variation);
+                }
+                else if ((selection.decoNode.type === deco_node_type_enum_1.DecoNodeType.Part &&
+                    typeof selection.decoNode.gameObjectName === 'string' &&
+                    selection.decoNode.gameObjectName.length) || (isArticleWithMaterial)) {
+                    if (selection.decoNode.kind === deco_node_kind_enum_1.DecoNodeKind.Adjustable || (isArticleWithMaterial)) {
+                        selection.variations = globalVariations;
+                        this._adjustables.push(selection);
+                        if (!lastAdded || (lastAdded.nodeId !== selection.nodeId || lastAdded.node !== selection.node)) {
+                            newPart = true;
+                        }
+                        lastAdded = selection;
+                        lastAdjustable = selection;
+                    }
+                    else if (selection.decoNode.kind === deco_node_kind_enum_1.DecoNodeKind.Addable) {
+                        selection.variations = lastAdjustable ? lastAdjustable.variations : globalVariations;
+                        if (lastAdjustable) {
+                            lastAdjustable.addables.push(selection);
+                        }
+                        this._addables.push(selection);
+                        if (!lastAdded || (lastAdded.nodeId !== selection.nodeId || lastAdded.node !== selection.node)) {
+                            newPart = true;
+                        }
+                        lastAdded = selection;
+                    }
+                }
+            }
+            previousPresLevel = selection.presentationLevel;
+        }
+        // this._upsertFurniture(this.activeInstance,
+        //   {Variations: usedVariations});
+    }
+    /**
+     * Returns the materialId of the parent up the tree until presentionlevel 1 is reached
+     * @param id
+     * @private
+     */
+    _getMaterialIdFromParent(id) {
+        const idx = this._selections.findIndex(s => s.node === id);
+        let currentLevel = 999;
+        if (idx > -1) {
+            for (let i = idx; i > 0; i--) {
+                const selection = this._selections[i];
+                if (selection.presentationLevel >= currentLevel) {
+                    break;
+                }
+                currentLevel = selection.presentationLevel;
+                if (selection.hdecoGameObject) {
+                    return selection.hdecoGameObject;
+                }
+            }
+        }
+        return undefined;
+    }
+    _createAdjustable(parent, adj) {
+        let obj = this._source ? this._source.getObjectByName(adj.decoNode.gameObjectName || adj.gameObject) : null;
+        if (!obj) {
+            // in case of glb files, the importer removes dots from names
+            const name = adj.decoNode.gameObjectName.replace(/[.]/g, '');
+            obj = this._source ? this._source.getObjectByName(name) : null;
+            if (!obj) {
+                console.warn(`No object with name ${adj.decoNode.gameObjectName} found!`);
+                return null;
+            }
+        }
+        let adjustable = obj.clone();
+        adjustable.name = this._createUniqueName(parent, obj);
+        adjustable.userData.selection = adj;
+        adjustable.position.set(0, 0, 0);
+        adjustable.traverse(c => {
+            c.visible = !c.name.toLowerCase().startsWith('c_');
+        });
+        parent.add(adjustable);
+        // the object being added to the customFloorGroup is being recreated so we loose the reference
+        // therefor we need to retrieve the created object again
+        adjustable = parent.getObjectByName(adjustable.name);
+        this._placedAdjustables.push(adjustable);
+        return adjustable;
+    }
+    _createAddable(parent, add, part2, part1) {
+        const obj = this._source.getObjectByName(add.decoNode.gameObjectName);
+        if (!obj) {
+            return null;
+        }
+        // const selection: Selection = this._getSelectionFromId(adj.artNodeIdDeco);
+        const addable = obj.clone();
+        addable.name = this._createUniqueName(parent, obj);
+        addable.userData.selection = add;
+        addable.position.set(0, 0, 0);
+        addable.visible = true;
+        if (part1 && part2) {
+            parent.add(addable);
+            this._placedAddables.push(addable);
+            return addable;
+        }
+        return addable;
+    }
+    _placeAddables(parent) {
+        const len = this._placedAdjustables.length;
+        for (let i = 0; i < len; i++) {
+            if (this._placedAdjustables[i].userData.hasOwnProperty('selection') && this._placedAdjustables[i].userData.selection) {
+                const adjustableSelection = this._placedAdjustables[i].userData.selection;
+                if (adjustableSelection) {
+                    const lena = adjustableSelection.addables.length;
+                    let conAddable;
+                    for (let ia = 0; ia < lena; ia++) {
+                        scene_utils_1.SceneUtils.TrySelectorConnection(this._scene, parent, this._placedAdjustables[i], adjustableSelection.addables[ia], false, (add, part2, part1) => this._createAddable(parent, add, part2, part1));
+                        if (conAddable) {
+                            scene_utils_1.SceneUtils.TrySelectorConnection(this._scene, parent, conAddable, adjustableSelection.addables[ia], false, (add, part2, part1) => this._createAddable(parent, add, part2, part1));
+                        }
+                        conAddable = this._placedAddables[this._placedAddables.length - 1];
+                    }
+                }
+            }
+        }
+    }
+    _createUniqueName(parent, obj) {
+        let iteration = 0;
+        let name = obj.name;
+        let existingObj = parent.getObjectByName(name);
+        while (existingObj) {
+            iteration++;
+            name = obj.name + (iteration !== 0 ? ('_' + iteration) : '');
+            existingObj = parent.getObjectByName(name);
+        }
+        return name;
+    }
+    _getGoodIdFromSku(sku) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const response = yield this._configuratorService.getGoodIdFromSku(sku, false);
+            if (response.validationResult.success && response.resultObject) {
+                return response.resultObject;
+            }
+        });
+    }
+    _getArticle(sku, goodId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (this._articleCache.has(sku)) {
+                this.articleLoaded.next(this._articleCache.get(sku));
+                return this._articleCache.get(sku);
+            }
+            if (!goodId) {
+                goodId = yield this._getGoodIdFromSku(sku)
+                    .catch((error) => {
+                    throw `Article with sku ${sku} not found!`;
+                });
+            }
+            let article;
+            const articleResponse = yield this._configuratorService.getArticleQuickSel(goodId, false);
+            if (articleResponse.validationResult.success && articleResponse.resultObject) {
+                if (articleResponse.resultObject.hasOwnProperty('oArticle')) {
+                    const obj = Array.isArray(articleResponse.resultObject['oArticle']) ? articleResponse.resultObject['oArticle'][0] : articleResponse.resultObject['oArticle'];
+                    article = this._boFactory.makeWithRawBackendData(article_1.Article, obj);
+                }
+                else {
+                    article = this._boFactory.makeWithRawBackendData(article_1.Article, articleResponse.resultObject);
+                }
+            }
+            this._articleCache.set(sku, article);
+            this.articleLoaded.next(article);
+            return article;
+        });
+    }
+    _getSelections(instanceId, publicationCode) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            this._selections = [];
+            const selectionResponse = yield this._configuratorService.getSelections(false, publicationCode);
+            if (selectionResponse.resultObjects && selectionResponse.resultObjects.length > 0) {
+                this._selections = this._boFactory.makeBOArrayFromRawBackendDataArray(selection_1.Selection, selectionResponse.resultObjects);
+                this._selections.forEach(s => s.instanceId = instanceId);
+                // const filtered: Selection[] = this._selections.filter(s => s.nodeType !== NodeType.Article && s.presentationLevel === 1);
+                this.selectionsReceived.next(this._selections);
+            }
+            else {
+                throw 'No selections found!';
+            }
+        });
+    }
+    _getDecos() {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            this._decos = [];
+            const decosResponse = yield this._configuratorService.getDecos(false);
+            if (decosResponse.resultObjects && decosResponse.resultObjects.length > 0) {
+                this._decos = this._boFactory.makeBOArrayFromRawBackendDataArray(deco_node_1.DecoNode, decosResponse.resultObjects);
+                this.decosReceived.next(this._decos);
+            }
+            else {
+                throw 'No deconodes found!';
+            }
+        });
+    }
+    _linkSelectionsAndDecos() {
+        const len = this._selections.length;
+        for (let i = 0; i < len; i++) {
+            // const id: string = this.selections[i].artNodeIdDeco;
+            let deco = this._decos.find(d => d.nodeId === this._selections[i].node);
+            if (!deco) {
+                deco = new deco_node_1.DecoNode();
+            }
+            if (deco.type !== deco_node_type_enum_1.DecoNodeType.Variation) {
+                const variation = this._getVariations().find(v => v.parentId === this._selections[i].artNodeIdDeco);
+                if (variation) {
+                    deco.variation = variation;
+                }
+            }
+            this._selections[i].decoNode = deco;
+        }
+    }
+    _getVariations() {
+        return this._decos.filter((deco) => {
+            return deco.type === deco_node_type_enum_1.DecoNodeType.Variation;
+        });
+    }
+    _loadVariations(obj) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            this._log('load variation for parts');
+            yield this._variationHelper.loadPart(obj, this._adjustables, true);
+            this._log('load variation for adjustables');
+            yield this._variationHelper.loadVariation(obj, this._adjustables, true);
+            this._log('load variation for addables');
+            yield this._variationHelper.loadVariation(obj, this._addables, true);
+            this._log('load variation clear cache');
+            this._variationHelper.clearCache();
+            this._log('load variations done');
+        });
+    }
+    _getAdjustables() {
+        return this._selections.filter(s => {
+            const node = s.decoNode;
+            return node && node.gameObjectName && node.type === deco_node_type_enum_1.DecoNodeType.Part && node.kind === deco_node_kind_enum_1.DecoNodeKind.Adjustable;
+        });
+    }
+    _updatePivot(obj) {
+        const boundingBox = new THREE.Box3().setFromObject(obj);
+        const bbCenterPivot = new THREE.Vector3();
+        boundingBox.getCenter(bbCenterPivot);
+        const delta = new THREE.Vector3().sub(bbCenterPivot).setY(Math.abs(Math.min(boundingBox.min.y, 0)));
+        obj.children.forEach((child) => {
+            child.position.add(delta);
+        });
+        obj.updateWorldMatrix(false, true);
+    }
+    _reset() {
+        this._placedAddables.length = 0;
+        this._placedAdjustables.length = 0;
+        this._adjustables.length = 0;
+        this._addables.length = 0;
+        // this._prepareTheSelections();
+    }
+    _log(message) {
+        if (this.debug) {
+            this.debug(message);
+            console.log(new Date(), message);
+        }
+    }
+}
+exports.Builder = Builder;
+Builder.ɵfac = function Builder_Factory(t) { return new (t || Builder)(); };
+Builder.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: Builder, factory: Builder.ɵfac, providedIn: "root" });
+
+
+/***/ }),
+
+/***/ 35674:
+/*!***************************************************************!*\
+  !*** ./src/app/components/answers/answer/answer.component.ts ***!
+  \***************************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.AnswerComponent = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const animations_1 = __webpack_require__(/*! @angular/animations */ 97175);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+const i1 = tslib_1.__importStar(__webpack_require__(/*! ../../../builder */ 24529));
+const i2 = tslib_1.__importStar(__webpack_require__(/*! @angular/common */ 54364));
+const i3 = tslib_1.__importStar(__webpack_require__(/*! ../../shared/loader/loader.component */ 98506));
+function AnswerComponent_rp_loader_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "rp-loader");
+} }
+function AnswerComponent_img_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "img", 10);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("src", ctx_r1.answer.imageData, i0.ɵɵsanitizeUrl);
+} }
+class AnswerComponent {
+    constructor(_builder) {
+        this._builder = _builder;
+    }
+    set showing(value) {
+        this.answer.imageData = '';
+        if (value && this.answer.answer !== 'Skip / Cancel') {
+            this._loadThumbnail(this.answer);
+        }
+        else {
+            this.answer.imageData = null;
+        }
+    }
+    ngOnInit() {
+    }
+    _loadThumbnail(answer) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            yield this._builder.getImageForSelectionOrAnswer(answer).then((imageSrc) => {
+                answer.imageData = imageSrc === "" ? null : imageSrc;
+            });
+        });
+    }
+}
+exports.AnswerComponent = AnswerComponent;
+AnswerComponent.ɵfac = function AnswerComponent_Factory(t) { return new (t || AnswerComponent)(i0.ɵɵdirectiveInject(i1.Builder)); };
+AnswerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AnswerComponent, selectors: [["answer"]], inputs: { answer: "answer", showing: "showing" }, decls: 10, vars: 4, consts: [[1, "ione-configurator"], [1, "answer-wrapper"], [1, "answer-content"], [1, "answer-thumbnail"], [4, "ngIf"], ["class", "answer-img", 3, "src", 4, "ngIf"], [1, "answer-title-wrapper"], [1, "answer-title", 3, "textContent"], [1, "price"], [1, "price-value"], [1, "answer-img", 3, "src"]], template: function AnswerComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵelementStart(1, "div", 1);
+        i0.ɵɵelementStart(2, "div", 2);
+        i0.ɵɵelementStart(3, "div", 3);
+        i0.ɵɵtemplate(4, AnswerComponent_rp_loader_4_Template, 1, 0, "rp-loader", 4);
+        i0.ɵɵtemplate(5, AnswerComponent_img_5_Template, 1, 1, "img", 5);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(6, "div", 6);
+        i0.ɵɵelement(7, "span", 7);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(8, "div", 8);
+        i0.ɵɵelement(9, "span", 9);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+    } if (rf & 2) {
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("@answerAppear", undefined);
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("ngIf", ctx.answer.imageData === "");
+        i0.ɵɵadvance(1);
+        i0.ɵɵproperty("ngIf", ctx.answer.imageData !== "" && ctx.answer.imageData !== null);
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("textContent", ctx.answer.commercialAnswer);
+    } }, directives: [i2.NgIf, i3.LoaderComponent], styles: [".ione-configurator[_ngcontent-%COMP%]   .rp-answers-slideout[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 400px;\n  height: -moz-fit-content;\n  height: fit-content;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answers-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answers-container[_ngcontent-%COMP%] {\n  height: 100vh;\n  overflow-y: scroll;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-content[_ngcontent-%COMP%] {\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  font-size: 12px;\n  border: 1px solid lightgray;\n  padding: 10px;\n  display: flex;\n  flex-direction: row;\n  border-radius: 3px;\n  margin-bottom: 3px;\n  box-shadow: 2px 1px rgba(211, 211, 211, 0.5);\n  background: white;\n}\n.ione-configurator[_ngcontent-%COMP%]   .thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .img-size[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .unloaded[_ngcontent-%COMP%] {\n  background-color: lightgrey;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-wrapper[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-title[_ngcontent-%COMP%] {\n  font-size: 12px;\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n}\n.ione-configurator[_ngcontent-%COMP%]   .question[_ngcontent-%COMP%] {\n  font-weight: bold;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-style: italic;\n  margin-top: 3px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-wrapper[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-content[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-handle[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 10px;\n  right: 12px;\n  border: solid black;\n  border-width: 0 3px 3px 0;\n  display: inline-block;\n  padding: 3px;\n  transform: rotate(45deg);\n  -webkit-transform: rotate(45deg);\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-handle.expanded[_ngcontent-%COMP%] {\n  transform: rotate(-135deg);\n  -webkit-transform: rotate(-135deg);\n}\n.ione-configurator[_ngcontent-%COMP%]   .child-selection[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  display: flex;\n  flex-direction: column;\n  margin-top: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .mat-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .drawer__header[_ngcontent-%COMP%] {\n  height: 48px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .rp-selections-summary[_ngcontent-%COMP%] {\n  height: -moz-fit-content;\n  height: fit-content;\n  background: transparent;\n  overflow: auto;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 400px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selections-content[_ngcontent-%COMP%] {\n  overflow-y: auto;\n}\n.ione-configurator[_ngcontent-%COMP%]   .co-summary-line[_ngcontent-%COMP%] {\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  font-size: 12px;\n  border: 1px solid lightgray;\n  padding: 10px;\n  display: flex;\n  flex-direction: row;\n  border-radius: 3px;\n  margin-bottom: 3px;\n  box-shadow: 2px 1px rgba(211, 211, 211, 0.5);\n  background: white;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selection-thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selection-img[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-img[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .unloaded[_ngcontent-%COMP%] {\n  background-color: lightgrey;\n}\n.ione-configurator[_ngcontent-%COMP%]   .titles[_ngcontent-%COMP%] {\n  margin-left: 14px;\n  align-self: center;\n}\n.ione-configurator[_ngcontent-%COMP%]   .title-wrapper[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-title-wrapper[_ngcontent-%COMP%] {\n  text-align: center;\n  align-self: center;\n  margin-left: 14px;\n}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNoYXJlZC5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNFO0VBQ0Usa0JBQUE7RUFDQSxNQUFBO0VBQ0EsUUFBQTtFQUNBLFlBQUE7RUFDQSx3QkFBQTtFQUFBLG1CQUFBO0FBQUo7QUFFRTtFQUNFLGlCQUFBO0VBQ0EsY0FBQTtBQUFKO0FBRUU7RUFDRSxhQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7RUFDQSxlQUFBO0VBQ0EsMkJBQUE7RUFDQSxhQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0Esa0JBQUE7RUFDQSxrQkFBQTtFQUNBLDRDQUFBO0VBQ0EsaUJBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsMkJBQUE7QUFBSjtBQUVFO0VBQ0UsY0FBQTtBQUFKO0FBRUU7RUFDRSxlQUFBO0VBQ0Esa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7QUFBSjtBQUVFO0VBQ0UsaUJBQUE7RUFDQSxjQUFBO0FBQUo7QUFFRTtFQUNFLGVBQUE7RUFDQSxrQkFBQTtFQUNBLGVBQUE7QUFBSjtBQUVFO0VBQ0UsY0FBQTtBQUFKO0FBRUU7RUFDRSxjQUFBO0FBQUo7QUFFRTtFQUNFLGtCQUFBO0VBQ0EsU0FBQTtFQUNBLFdBQUE7RUFDQSxtQkFBQTtFQUNBLHlCQUFBO0VBQ0EscUJBQUE7RUFDQSxZQUFBO0VBQ0Esd0JBQUE7RUFDQSxnQ0FBQTtBQUFKO0FBQ0k7RUFDRSwwQkFBQTtFQUNBLGtDQUFBO0FBQ047QUFFRTtFQUNFLGlCQUFBO0VBQ0EsYUFBQTtFQUNBLHNCQUFBO0VBQ0EsZUFBQTtBQUFKO0FBRUU7RUFDRSxpQkFBQTtFQUNBLGNBQUE7QUFBSjtBQUVFO0VBQ0UsWUFBQTtBQUFKO0FBRUU7RUFDRSx3QkFBQTtFQUFBLG1CQUFBO0VBQ0EsdUJBQUE7RUFDQSxjQUFBO0VBQ0Esa0JBQUE7RUFDQSxNQUFBO0VBQ0EsUUFBQTtFQUNBLFlBQUE7QUFBSjtBQUVFO0VBQ0UsZ0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7RUFDQSxlQUFBO0VBQ0EsMkJBQUE7RUFDQSxhQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0Esa0JBQUE7RUFDQSxrQkFBQTtFQUNBLDRDQUFBO0VBQ0EsaUJBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsMkJBQUE7QUFBSjtBQUVFO0VBQ0UsaUJBQUE7RUFDQSxrQkFBQTtBQUFKO0FBRUU7RUFDRSxhQUFBO0VBQ0Esc0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxrQkFBQTtFQUNBLGlCQUFBO0FBQUoiLCJmaWxlIjoic2hhcmVkLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuaW9uZS1jb25maWd1cmF0b3Ige1xyXG4gIC5ycC1hbnN3ZXJzLXNsaWRlb3V0e1xyXG4gICAgcG9zaXRpb246IGFic29sdXRlO1xyXG4gICAgdG9wOiAwO1xyXG4gICAgcmlnaHQ6IDA7XHJcbiAgICB3aWR0aDogNDAwcHg7XHJcbiAgICBoZWlnaHQ6IGZpdC1jb250ZW50O1xyXG4gIH1cclxuICAuYW5zd2Vycy10aXRsZSB7XHJcbiAgICBtYXJnaW4tbGVmdDogMTBweDtcclxuICAgIGNvbG9yOiAjMWExYTFhO1xyXG4gIH1cclxuICAuYW5zd2Vycy1jb250YWluZXIge1xyXG4gICAgaGVpZ2h0OiAxMDB2aDtcclxuICAgIG92ZXJmbG93LXk6IHNjcm9sbDtcclxuICB9XHJcbiAgLmFuc3dlci1jb250ZW50IHtcclxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcclxuICAgIG92ZXJmbG93OiBoaWRkZW47XHJcbiAgICBjdXJzb3I6IHBvaW50ZXI7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBib3JkZXI6IDFweCBzb2xpZCBsaWdodGdyYXk7XHJcbiAgICBwYWRkaW5nOiAxMHB4O1xyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBib3JkZXItcmFkaXVzOiAzcHg7XHJcbiAgICBtYXJnaW4tYm90dG9tOiAzcHg7XHJcbiAgICBib3gtc2hhZG93OiAycHggMXB4IHJnYmEoMjExLCAyMTEsIDIxMSwgMC41KTtcclxuICAgIGJhY2tncm91bmQ6IHdoaXRlO1xyXG4gIH1cclxuICAudGh1bWJuYWlsIHtcclxuICAgIHdpZHRoOiA1NHB4O1xyXG4gICAgbWluLXdpZHRoOiA1NHB4O1xyXG4gICAgaGVpZ2h0OiA1NHB4O1xyXG4gICAgbWluLWhlaWdodDogNTRweDtcclxuICAgIGJvcmRlcjogMXB4IHNvbGlkICNkM2QzZDM7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC5pbWctc2l6ZSB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC51bmxvYWRlZCB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodGdyZXk7XHJcbiAgfVxyXG4gIC5hbnN3ZXItd3JhcHBlciB7XHJcbiAgICBkaXNwbGF5OiBibG9jaztcclxuICB9XHJcbiAgLmFuc3dlci10aXRsZSB7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gIH1cclxuICAucXVlc3Rpb24ge1xyXG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XHJcbiAgICBjb2xvcjogIzFhMWExYTtcclxuICB9XHJcbiAgLmFuc3dlciB7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBmb250LXN0eWxlOiBpdGFsaWM7XHJcbiAgICBtYXJnaW4tdG9wOiAzcHg7XHJcbiAgfVxyXG4gIC5jb2xsYXBzZS13cmFwcGVyIHtcclxuICAgIGRpc3BsYXk6IGJsb2NrO1xyXG4gIH1cclxuICAuY29sbGFwc2UtY29udGVudCB7XHJcbiAgICBkaXNwbGF5OiBibG9jaztcclxuICB9XHJcbiAgLmNvbGxhcHNlLWhhbmRsZSB7XHJcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XHJcbiAgICB0b3A6IDEwcHg7XHJcbiAgICByaWdodDogMTJweDtcclxuICAgIGJvcmRlcjogc29saWQgYmxhY2s7XHJcbiAgICBib3JkZXItd2lkdGg6IDAgM3B4IDNweCAwO1xyXG4gICAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xyXG4gICAgcGFkZGluZzogM3B4O1xyXG4gICAgdHJhbnNmb3JtOiByb3RhdGUoNDVkZWcpO1xyXG4gICAgLXdlYmtpdC10cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XHJcbiAgICAmLmV4cGFuZGVkIHtcclxuICAgICAgdHJhbnNmb3JtOiByb3RhdGUoLTEzNWRlZyk7XHJcbiAgICAgIC13ZWJraXQtdHJhbnNmb3JtOiByb3RhdGUoLTEzNWRlZyk7XHJcbiAgICB9XHJcbiAgfVxyXG4gIC5jaGlsZC1zZWxlY3Rpb24ge1xyXG4gICAgbWFyZ2luLWxlZnQ6IDEwcHg7XHJcbiAgICBkaXNwbGF5OiBmbGV4O1xyXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcclxuICAgIG1hcmdpbi10b3A6IDVweDtcclxuICB9XHJcbiAgLm1hdC10aXRsZSB7XHJcbiAgICBtYXJnaW4tbGVmdDogMTBweDtcclxuICAgIGNvbG9yOiAjMWExYTFhO1xyXG4gIH1cclxuICAuZHJhd2VyX19oZWFkZXIge1xyXG4gICAgaGVpZ2h0OiA0OHB4O1xyXG4gIH1cclxuICAucnAtc2VsZWN0aW9ucy1zdW1tYXJ5IHtcclxuICAgIGhlaWdodDogZml0LWNvbnRlbnQ7XHJcbiAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcclxuICAgIG92ZXJmbG93OiBhdXRvO1xyXG4gICAgcG9zaXRpb246IGFic29sdXRlO1xyXG4gICAgdG9wOiAwO1xyXG4gICAgcmlnaHQ6IDA7XHJcbiAgICB3aWR0aDogNDAwcHg7XHJcbiAgfVxyXG4gIC5zZWxlY3Rpb25zLWNvbnRlbnQge1xyXG4gICAgb3ZlcmZsb3cteTogYXV0bztcclxuICB9XHJcbiAgLmNvLXN1bW1hcnktbGluZSB7XHJcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gICAgZm9udC1zaXplOiAxMnB4O1xyXG4gICAgYm9yZGVyOiAxcHggc29saWQgbGlnaHRncmF5O1xyXG4gICAgcGFkZGluZzogMTBweDtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBmbGV4LWRpcmVjdGlvbjogcm93O1xyXG4gICAgYm9yZGVyLXJhZGl1czogM3B4O1xyXG4gICAgbWFyZ2luLWJvdHRvbTogM3B4O1xyXG4gICAgYm94LXNoYWRvdzogMnB4IDFweCByZ2JhKDIxMSwgMjExLCAyMTEsIDAuNSk7XHJcbiAgICBiYWNrZ3JvdW5kOiB3aGl0ZTtcclxuICB9XHJcbiAgLnNlbGVjdGlvbi10aHVtYm5haWwge1xyXG4gICAgd2lkdGg6IDU0cHg7XHJcbiAgICBtaW4td2lkdGg6IDU0cHg7XHJcbiAgICBoZWlnaHQ6IDU0cHg7XHJcbiAgICBtaW4taGVpZ2h0OiA1NHB4O1xyXG4gICAgYm9yZGVyOiAxcHggc29saWQgI2QzZDNkMztcclxuICAgIGJvcmRlci1yYWRpdXM6IDVweDtcclxuICB9XHJcbiAgLnNlbGVjdGlvbi1pbWcge1xyXG4gICAgd2lkdGg6IDU0cHg7XHJcbiAgICBtaW4td2lkdGg6IDU0cHg7XHJcbiAgICBoZWlnaHQ6IDU0cHg7XHJcbiAgICBtaW4taGVpZ2h0OiA1NHB4O1xyXG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xyXG4gIH1cclxuICAuYW5zd2VyLXRodW1ibmFpbCB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjZDNkM2QzO1xyXG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xyXG4gIH1cclxuICAuYW5zd2VyLWltZyB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC51bmxvYWRlZCB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodGdyZXk7XHJcbiAgfVxyXG4gIC50aXRsZXMge1xyXG4gICAgbWFyZ2luLWxlZnQ6IDE0cHg7XHJcbiAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XHJcbiAgfVxyXG4gIC50aXRsZS13cmFwcGVyIHtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xyXG4gIH1cclxuICAuYW5zd2VyLXRpdGxlLXdyYXBwZXIge1xyXG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gICAgYWxpZ24tc2VsZjogY2VudGVyO1xyXG4gICAgbWFyZ2luLWxlZnQ6IDE0cHg7XHJcbiAgfVxyXG59XHJcbiJdfQ== */"], data: { animation: [
+            animations_1.trigger('answerAppear', [
+                animations_1.state('void', animations_1.style({ 'background': '#dbdbdb' })),
+                animations_1.state('white', animations_1.style({ 'background': 'white' })),
+                animations_1.transition('void <=> *', animations_1.animate(500))
+            ])
+        ] } });
+
+
+/***/ }),
+
+/***/ 84780:
+/*!*********************************************************!*\
+  !*** ./src/app/components/answers/answers.component.ts ***!
+  \*********************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.AnswersComponent = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const core_1 = __webpack_require__(/*! @angular/core */ 2316);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+const i1 = tslib_1.__importStar(__webpack_require__(/*! ../../directives/visibility-observer-master.directive */ 52966));
+const i2 = tslib_1.__importStar(__webpack_require__(/*! @angular/common */ 54364));
+const i3 = tslib_1.__importStar(__webpack_require__(/*! ./answer/answer.component */ 35674));
+const i4 = tslib_1.__importStar(__webpack_require__(/*! ../../directives/visibility-observer.directive */ 27789));
+function AnswersComponent_answer_4_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "answer", 5, 6);
+    i0.ɵɵlistener("click", function AnswersComponent_answer_4_Template_answer_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r4); const answer_r1 = restoredCtx.$implicit; const ctx_r3 = i0.ɵɵnextContext(); return ctx_r3.answerClick.emit(answer_r1); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const answer_r1 = ctx.$implicit;
+    const _r2 = i0.ɵɵreference(1);
+    i0.ɵɵproperty("answer", answer_r1)("observerEnabled", true)("showing", _r2.isIntersecting);
+} }
+class AnswersComponent {
+    constructor() {
+        this.answers = [];
+        this.answerClick = new core_1.EventEmitter();
+    }
+}
+exports.AnswersComponent = AnswersComponent;
+AnswersComponent.ɵfac = function AnswersComponent_Factory(t) { return new (t || AnswersComponent)(); };
+AnswersComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AnswersComponent, selectors: [["answers"]], inputs: { answers: "answers", selectionTitle: "selectionTitle" }, outputs: { answerClick: "answerClick" }, decls: 5, vars: 2, consts: [[1, "ione-configurator"], [1, "rp-answers-slideout"], [1, "answers-title", 3, "textContent"], ["visibilityObserverMaster", "", 1, "answers-container"], ["visibilityObserver", "", 3, "answer", "observerEnabled", "showing", "click", 4, "ngFor", "ngForOf"], ["visibilityObserver", "", 3, "answer", "observerEnabled", "showing", "click"], ["intersection", "intersection"]], template: function AnswersComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵelementStart(1, "div", 1);
+        i0.ɵɵelement(2, "h2", 2);
+        i0.ɵɵelementStart(3, "div", 3);
+        i0.ɵɵtemplate(4, AnswersComponent_answer_4_Template, 2, 3, "answer", 4);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+    } if (rf & 2) {
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("textContent", ctx.selectionTitle);
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("ngForOf", ctx.answers);
+    } }, directives: [i1.VisibilityObserverMasterDirective, i2.NgForOf, i3.AnswerComponent, i4.VisibilityObserverDirective], styles: [".ione-configurator[_ngcontent-%COMP%]   .rp-answers-slideout[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 400px;\n  height: -moz-fit-content;\n  height: fit-content;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answers-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answers-container[_ngcontent-%COMP%] {\n  height: 100vh;\n  overflow-y: scroll;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-content[_ngcontent-%COMP%] {\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  font-size: 12px;\n  border: 1px solid lightgray;\n  padding: 10px;\n  display: flex;\n  flex-direction: row;\n  border-radius: 3px;\n  margin-bottom: 3px;\n  box-shadow: 2px 1px rgba(211, 211, 211, 0.5);\n  background: white;\n}\n.ione-configurator[_ngcontent-%COMP%]   .thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .img-size[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .unloaded[_ngcontent-%COMP%] {\n  background-color: lightgrey;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-wrapper[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-title[_ngcontent-%COMP%] {\n  font-size: 12px;\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n}\n.ione-configurator[_ngcontent-%COMP%]   .question[_ngcontent-%COMP%] {\n  font-weight: bold;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-style: italic;\n  margin-top: 3px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-wrapper[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-content[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-handle[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 10px;\n  right: 12px;\n  border: solid black;\n  border-width: 0 3px 3px 0;\n  display: inline-block;\n  padding: 3px;\n  transform: rotate(45deg);\n  -webkit-transform: rotate(45deg);\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-handle.expanded[_ngcontent-%COMP%] {\n  transform: rotate(-135deg);\n  -webkit-transform: rotate(-135deg);\n}\n.ione-configurator[_ngcontent-%COMP%]   .child-selection[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  display: flex;\n  flex-direction: column;\n  margin-top: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .mat-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .drawer__header[_ngcontent-%COMP%] {\n  height: 48px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .rp-selections-summary[_ngcontent-%COMP%] {\n  height: -moz-fit-content;\n  height: fit-content;\n  background: transparent;\n  overflow: auto;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 400px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selections-content[_ngcontent-%COMP%] {\n  overflow-y: auto;\n}\n.ione-configurator[_ngcontent-%COMP%]   .co-summary-line[_ngcontent-%COMP%] {\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  font-size: 12px;\n  border: 1px solid lightgray;\n  padding: 10px;\n  display: flex;\n  flex-direction: row;\n  border-radius: 3px;\n  margin-bottom: 3px;\n  box-shadow: 2px 1px rgba(211, 211, 211, 0.5);\n  background: white;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selection-thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selection-img[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-img[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .unloaded[_ngcontent-%COMP%] {\n  background-color: lightgrey;\n}\n.ione-configurator[_ngcontent-%COMP%]   .titles[_ngcontent-%COMP%] {\n  margin-left: 14px;\n  align-self: center;\n}\n.ione-configurator[_ngcontent-%COMP%]   .title-wrapper[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-title-wrapper[_ngcontent-%COMP%] {\n  text-align: center;\n  align-self: center;\n  margin-left: 14px;\n}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNoYXJlZC5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNFO0VBQ0Usa0JBQUE7RUFDQSxNQUFBO0VBQ0EsUUFBQTtFQUNBLFlBQUE7RUFDQSx3QkFBQTtFQUFBLG1CQUFBO0FBQUo7QUFFRTtFQUNFLGlCQUFBO0VBQ0EsY0FBQTtBQUFKO0FBRUU7RUFDRSxhQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7RUFDQSxlQUFBO0VBQ0EsMkJBQUE7RUFDQSxhQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0Esa0JBQUE7RUFDQSxrQkFBQTtFQUNBLDRDQUFBO0VBQ0EsaUJBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsMkJBQUE7QUFBSjtBQUVFO0VBQ0UsY0FBQTtBQUFKO0FBRUU7RUFDRSxlQUFBO0VBQ0Esa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7QUFBSjtBQUVFO0VBQ0UsaUJBQUE7RUFDQSxjQUFBO0FBQUo7QUFFRTtFQUNFLGVBQUE7RUFDQSxrQkFBQTtFQUNBLGVBQUE7QUFBSjtBQUVFO0VBQ0UsY0FBQTtBQUFKO0FBRUU7RUFDRSxjQUFBO0FBQUo7QUFFRTtFQUNFLGtCQUFBO0VBQ0EsU0FBQTtFQUNBLFdBQUE7RUFDQSxtQkFBQTtFQUNBLHlCQUFBO0VBQ0EscUJBQUE7RUFDQSxZQUFBO0VBQ0Esd0JBQUE7RUFDQSxnQ0FBQTtBQUFKO0FBQ0k7RUFDRSwwQkFBQTtFQUNBLGtDQUFBO0FBQ047QUFFRTtFQUNFLGlCQUFBO0VBQ0EsYUFBQTtFQUNBLHNCQUFBO0VBQ0EsZUFBQTtBQUFKO0FBRUU7RUFDRSxpQkFBQTtFQUNBLGNBQUE7QUFBSjtBQUVFO0VBQ0UsWUFBQTtBQUFKO0FBRUU7RUFDRSx3QkFBQTtFQUFBLG1CQUFBO0VBQ0EsdUJBQUE7RUFDQSxjQUFBO0VBQ0Esa0JBQUE7RUFDQSxNQUFBO0VBQ0EsUUFBQTtFQUNBLFlBQUE7QUFBSjtBQUVFO0VBQ0UsZ0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7RUFDQSxlQUFBO0VBQ0EsMkJBQUE7RUFDQSxhQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0Esa0JBQUE7RUFDQSxrQkFBQTtFQUNBLDRDQUFBO0VBQ0EsaUJBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsMkJBQUE7QUFBSjtBQUVFO0VBQ0UsaUJBQUE7RUFDQSxrQkFBQTtBQUFKO0FBRUU7RUFDRSxhQUFBO0VBQ0Esc0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxrQkFBQTtFQUNBLGlCQUFBO0FBQUoiLCJmaWxlIjoic2hhcmVkLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuaW9uZS1jb25maWd1cmF0b3Ige1xyXG4gIC5ycC1hbnN3ZXJzLXNsaWRlb3V0e1xyXG4gICAgcG9zaXRpb246IGFic29sdXRlO1xyXG4gICAgdG9wOiAwO1xyXG4gICAgcmlnaHQ6IDA7XHJcbiAgICB3aWR0aDogNDAwcHg7XHJcbiAgICBoZWlnaHQ6IGZpdC1jb250ZW50O1xyXG4gIH1cclxuICAuYW5zd2Vycy10aXRsZSB7XHJcbiAgICBtYXJnaW4tbGVmdDogMTBweDtcclxuICAgIGNvbG9yOiAjMWExYTFhO1xyXG4gIH1cclxuICAuYW5zd2Vycy1jb250YWluZXIge1xyXG4gICAgaGVpZ2h0OiAxMDB2aDtcclxuICAgIG92ZXJmbG93LXk6IHNjcm9sbDtcclxuICB9XHJcbiAgLmFuc3dlci1jb250ZW50IHtcclxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcclxuICAgIG92ZXJmbG93OiBoaWRkZW47XHJcbiAgICBjdXJzb3I6IHBvaW50ZXI7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBib3JkZXI6IDFweCBzb2xpZCBsaWdodGdyYXk7XHJcbiAgICBwYWRkaW5nOiAxMHB4O1xyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBib3JkZXItcmFkaXVzOiAzcHg7XHJcbiAgICBtYXJnaW4tYm90dG9tOiAzcHg7XHJcbiAgICBib3gtc2hhZG93OiAycHggMXB4IHJnYmEoMjExLCAyMTEsIDIxMSwgMC41KTtcclxuICAgIGJhY2tncm91bmQ6IHdoaXRlO1xyXG4gIH1cclxuICAudGh1bWJuYWlsIHtcclxuICAgIHdpZHRoOiA1NHB4O1xyXG4gICAgbWluLXdpZHRoOiA1NHB4O1xyXG4gICAgaGVpZ2h0OiA1NHB4O1xyXG4gICAgbWluLWhlaWdodDogNTRweDtcclxuICAgIGJvcmRlcjogMXB4IHNvbGlkICNkM2QzZDM7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC5pbWctc2l6ZSB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC51bmxvYWRlZCB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodGdyZXk7XHJcbiAgfVxyXG4gIC5hbnN3ZXItd3JhcHBlciB7XHJcbiAgICBkaXNwbGF5OiBibG9jaztcclxuICB9XHJcbiAgLmFuc3dlci10aXRsZSB7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gIH1cclxuICAucXVlc3Rpb24ge1xyXG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XHJcbiAgICBjb2xvcjogIzFhMWExYTtcclxuICB9XHJcbiAgLmFuc3dlciB7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBmb250LXN0eWxlOiBpdGFsaWM7XHJcbiAgICBtYXJnaW4tdG9wOiAzcHg7XHJcbiAgfVxyXG4gIC5jb2xsYXBzZS13cmFwcGVyIHtcclxuICAgIGRpc3BsYXk6IGJsb2NrO1xyXG4gIH1cclxuICAuY29sbGFwc2UtY29udGVudCB7XHJcbiAgICBkaXNwbGF5OiBibG9jaztcclxuICB9XHJcbiAgLmNvbGxhcHNlLWhhbmRsZSB7XHJcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XHJcbiAgICB0b3A6IDEwcHg7XHJcbiAgICByaWdodDogMTJweDtcclxuICAgIGJvcmRlcjogc29saWQgYmxhY2s7XHJcbiAgICBib3JkZXItd2lkdGg6IDAgM3B4IDNweCAwO1xyXG4gICAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xyXG4gICAgcGFkZGluZzogM3B4O1xyXG4gICAgdHJhbnNmb3JtOiByb3RhdGUoNDVkZWcpO1xyXG4gICAgLXdlYmtpdC10cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XHJcbiAgICAmLmV4cGFuZGVkIHtcclxuICAgICAgdHJhbnNmb3JtOiByb3RhdGUoLTEzNWRlZyk7XHJcbiAgICAgIC13ZWJraXQtdHJhbnNmb3JtOiByb3RhdGUoLTEzNWRlZyk7XHJcbiAgICB9XHJcbiAgfVxyXG4gIC5jaGlsZC1zZWxlY3Rpb24ge1xyXG4gICAgbWFyZ2luLWxlZnQ6IDEwcHg7XHJcbiAgICBkaXNwbGF5OiBmbGV4O1xyXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcclxuICAgIG1hcmdpbi10b3A6IDVweDtcclxuICB9XHJcbiAgLm1hdC10aXRsZSB7XHJcbiAgICBtYXJnaW4tbGVmdDogMTBweDtcclxuICAgIGNvbG9yOiAjMWExYTFhO1xyXG4gIH1cclxuICAuZHJhd2VyX19oZWFkZXIge1xyXG4gICAgaGVpZ2h0OiA0OHB4O1xyXG4gIH1cclxuICAucnAtc2VsZWN0aW9ucy1zdW1tYXJ5IHtcclxuICAgIGhlaWdodDogZml0LWNvbnRlbnQ7XHJcbiAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcclxuICAgIG92ZXJmbG93OiBhdXRvO1xyXG4gICAgcG9zaXRpb246IGFic29sdXRlO1xyXG4gICAgdG9wOiAwO1xyXG4gICAgcmlnaHQ6IDA7XHJcbiAgICB3aWR0aDogNDAwcHg7XHJcbiAgfVxyXG4gIC5zZWxlY3Rpb25zLWNvbnRlbnQge1xyXG4gICAgb3ZlcmZsb3cteTogYXV0bztcclxuICB9XHJcbiAgLmNvLXN1bW1hcnktbGluZSB7XHJcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gICAgZm9udC1zaXplOiAxMnB4O1xyXG4gICAgYm9yZGVyOiAxcHggc29saWQgbGlnaHRncmF5O1xyXG4gICAgcGFkZGluZzogMTBweDtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBmbGV4LWRpcmVjdGlvbjogcm93O1xyXG4gICAgYm9yZGVyLXJhZGl1czogM3B4O1xyXG4gICAgbWFyZ2luLWJvdHRvbTogM3B4O1xyXG4gICAgYm94LXNoYWRvdzogMnB4IDFweCByZ2JhKDIxMSwgMjExLCAyMTEsIDAuNSk7XHJcbiAgICBiYWNrZ3JvdW5kOiB3aGl0ZTtcclxuICB9XHJcbiAgLnNlbGVjdGlvbi10aHVtYm5haWwge1xyXG4gICAgd2lkdGg6IDU0cHg7XHJcbiAgICBtaW4td2lkdGg6IDU0cHg7XHJcbiAgICBoZWlnaHQ6IDU0cHg7XHJcbiAgICBtaW4taGVpZ2h0OiA1NHB4O1xyXG4gICAgYm9yZGVyOiAxcHggc29saWQgI2QzZDNkMztcclxuICAgIGJvcmRlci1yYWRpdXM6IDVweDtcclxuICB9XHJcbiAgLnNlbGVjdGlvbi1pbWcge1xyXG4gICAgd2lkdGg6IDU0cHg7XHJcbiAgICBtaW4td2lkdGg6IDU0cHg7XHJcbiAgICBoZWlnaHQ6IDU0cHg7XHJcbiAgICBtaW4taGVpZ2h0OiA1NHB4O1xyXG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xyXG4gIH1cclxuICAuYW5zd2VyLXRodW1ibmFpbCB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjZDNkM2QzO1xyXG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xyXG4gIH1cclxuICAuYW5zd2VyLWltZyB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC51bmxvYWRlZCB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodGdyZXk7XHJcbiAgfVxyXG4gIC50aXRsZXMge1xyXG4gICAgbWFyZ2luLWxlZnQ6IDE0cHg7XHJcbiAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XHJcbiAgfVxyXG4gIC50aXRsZS13cmFwcGVyIHtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xyXG4gIH1cclxuICAuYW5zd2VyLXRpdGxlLXdyYXBwZXIge1xyXG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gICAgYWxpZ24tc2VsZjogY2VudGVyO1xyXG4gICAgbWFyZ2luLWxlZnQ6IDE0cHg7XHJcbiAgfVxyXG59XHJcbiJdfQ== */"] });
+
+
+/***/ }),
+
+/***/ 8852:
+/*!******************************************************!*\
+  !*** ./src/app/components/answers/answers.module.ts ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.AnswersModule = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const common_1 = __webpack_require__(/*! @angular/common */ 54364);
+const answers_component_1 = __webpack_require__(/*! ./answers.component */ 84780);
+const answer_component_1 = __webpack_require__(/*! ./answer/answer.component */ 35674);
+const visibility_observer_directive_1 = __webpack_require__(/*! ../../directives/visibility-observer.directive */ 27789);
+const visibility_observer_master_directive_1 = __webpack_require__(/*! ../../directives/visibility-observer-master.directive */ 52966);
+const shared_module_1 = __webpack_require__(/*! ../shared/shared.module */ 4065);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class AnswersModule {
+}
+exports.AnswersModule = AnswersModule;
+AnswersModule.ɵfac = function AnswersModule_Factory(t) { return new (t || AnswersModule)(); };
+AnswersModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: AnswersModule });
+AnswersModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            common_1.CommonModule,
+            shared_module_1.SharedModule
+        ]] });
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(AnswersModule, { declarations: [answers_component_1.AnswersComponent,
+        answer_component_1.AnswerComponent,
+        visibility_observer_directive_1.VisibilityObserverDirective,
+        visibility_observer_master_directive_1.VisibilityObserverMasterDirective], imports: [common_1.CommonModule,
+        shared_module_1.SharedModule], exports: [answers_component_1.AnswersComponent] }); })();
+
+
+/***/ }),
+
+/***/ 42226:
+/*!***************************************************************!*\
+  !*** ./src/app/components/selections/selections.component.ts ***!
+  \***************************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.SelectionsComponent = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const core_1 = __webpack_require__(/*! @angular/core */ 2316);
+const animations_1 = __webpack_require__(/*! @angular/animations */ 97175);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+const i1 = tslib_1.__importStar(__webpack_require__(/*! ../../builder */ 24529));
+const i2 = tslib_1.__importStar(__webpack_require__(/*! @angular/common */ 54364));
+const i3 = tslib_1.__importStar(__webpack_require__(/*! ../shared/loader/loader.component */ 98506));
+function SelectionsComponent_ng_container_5_rp_loader_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "rp-loader");
+} }
+function SelectionsComponent_ng_container_5_img_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "img", 19);
+} if (rf & 2) {
+    const selectionViewModel_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("src", selectionViewModel_r1.thumbnail, i0.ɵɵsanitizeUrl);
+} }
+function SelectionsComponent_ng_container_5_div_9_div_1_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 21);
+    i0.ɵɵlistener("click", function SelectionsComponent_ng_container_5_div_9_div_1_Template_div_click_0_listener($event) { const restoredCtx = i0.ɵɵrestoreView(_r10); const selection_r8 = restoredCtx.$implicit; const ctx_r9 = i0.ɵɵnextContext(3); return ctx_r9.selectSelection(selection_r8, $event); });
+    i0.ɵɵelement(1, "label", 12);
+    i0.ɵɵelement(2, "span", 13);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const selection_r8 = ctx.$implicit;
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("textContent", selection_r8.commercialQuestion);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("textContent", selection_r8.answer);
+} }
+function SelectionsComponent_ng_container_5_div_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵtemplate(1, SelectionsComponent_ng_container_5_div_9_div_1_Template, 3, 2, "div", 20);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const selectionViewModel_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("@showHideChildren", undefined);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngForOf", selectionViewModel_r1.children);
+} }
+function SelectionsComponent_ng_container_5_div_14_Template(rf, ctx) { if (rf & 1) {
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 22);
+    i0.ɵɵlistener("click", function SelectionsComponent_ng_container_5_div_14_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r14); const selectionViewModel_r1 = i0.ɵɵnextContext().$implicit; const ctx_r12 = i0.ɵɵnextContext(); return ctx_r12.expandClicked(selectionViewModel_r1, $event); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const selectionViewModel_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵclassProp("expanded", selectionViewModel_r1.expanded);
+} }
+function SelectionsComponent_ng_container_5_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "div", 6);
+    i0.ɵɵlistener("click", function SelectionsComponent_ng_container_5_Template_div_click_1_listener($event) { const restoredCtx = i0.ɵɵrestoreView(_r17); const selectionViewModel_r1 = restoredCtx.$implicit; const ctx_r16 = i0.ɵɵnextContext(); return ctx_r16.selectSelection(selectionViewModel_r1.selection, $event); });
+    i0.ɵɵelementStart(2, "div", 7);
+    i0.ɵɵtemplate(3, SelectionsComponent_ng_container_5_rp_loader_3_Template, 1, 0, "rp-loader", 8);
+    i0.ɵɵtemplate(4, SelectionsComponent_ng_container_5_img_4_Template, 1, 1, "img", 9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 10);
+    i0.ɵɵelementStart(6, "div", 11);
+    i0.ɵɵelement(7, "label", 12);
+    i0.ɵɵelement(8, "span", 13);
+    i0.ɵɵtemplate(9, SelectionsComponent_ng_container_5_div_9_Template, 2, 2, "div", 8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "div", 14);
+    i0.ɵɵelement(11, "span", 15);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "div", 16);
+    i0.ɵɵelementStart(13, "div", 17);
+    i0.ɵɵtemplate(14, SelectionsComponent_ng_container_5_div_14_Template, 1, 2, "div", 18);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const selectionViewModel_r1 = ctx.$implicit;
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("ngIf", selectionViewModel_r1.thumbnail === "");
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", selectionViewModel_r1.thumbnail !== "" && selectionViewModel_r1.thumbnail !== null);
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("textContent", selectionViewModel_r1.selection.question);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("textContent", selectionViewModel_r1.selection.answer);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("ngIf", selectionViewModel_r1.children.length > 0 && selectionViewModel_r1.expanded);
+    i0.ɵɵadvance(5);
+    i0.ɵɵproperty("ngIf", selectionViewModel_r1.children.length > 0);
+} }
+class SelectionViewModel {
+    constructor() {
+        this.children = [];
+        this.expanded = false;
+        this.thumbnail = '';
+    }
+}
+class SelectionsComponent {
+    constructor(_builder) {
+        this._builder = _builder;
+        this.selectionViewModels = [];
+        this.selectionClick = new core_1.EventEmitter();
+    }
+    set selections(value) {
+        this._prepareSelections(value);
+        this._loadThumbnails();
+    }
+    expandClicked(selectionViewModel, mouseEvent) {
+        mouseEvent.preventDefault();
+        mouseEvent.stopImmediatePropagation();
+        selectionViewModel.expanded = !selectionViewModel.expanded;
+    }
+    selectSelection(selection, mouseEvent) {
+        mouseEvent.preventDefault();
+        mouseEvent.stopImmediatePropagation();
+        this.selectionClick.next(selection);
+    }
+    _loadThumbnails() {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (this.selectionViewModels.length > 0) {
+                this.selectionViewModels.forEach((viewModel) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+                    yield this._builder.getImageForSelectionOrAnswer(viewModel.selection).then((imageSrc) => {
+                        viewModel.thumbnail = imageSrc === "" ? null : imageSrc;
+                    });
+                }));
+            }
+        });
+    }
+    _prepareSelections(value) {
+        this.selectionViewModels.length = 0;
+        let selectionViewModel;
+        value.forEach(s => {
+            if (s.presentationLevel === 1) {
+                selectionViewModel = new SelectionViewModel();
+                selectionViewModel.selection = s;
+                this.selectionViewModels.push(selectionViewModel);
+            }
+            else if (s.presentationLevel > 1) {
+                if (selectionViewModel) {
+                    selectionViewModel.children.push(s);
+                }
+            }
+        });
+    }
+}
+exports.SelectionsComponent = SelectionsComponent;
+SelectionsComponent.ɵfac = function SelectionsComponent_Factory(t) { return new (t || SelectionsComponent)(i0.ɵɵdirectiveInject(i1.Builder)); };
+SelectionsComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SelectionsComponent, selectors: [["selections"]], inputs: { selections: "selections" }, outputs: { selectionClick: "selectionClick" }, decls: 6, vars: 2, consts: [[1, "ione-configurator"], [1, "rp-selections-summary"], [1, "drawer__header"], [1, "mat-title", 3, "textContent"], [1, "selections-content"], [4, "ngFor", "ngForOf"], [1, "co-summary-line", 3, "click"], [1, "selection-thumbnail"], [4, "ngIf"], ["visibilityObserver", "", "class", "selection-img", 3, "src", 4, "ngIf"], [1, "titles"], [1, "title-wrapper"], [1, "question", 3, "textContent"], [1, "answer", 3, "textContent"], [1, "price-wrapper"], [1, "price-value"], [1, "collapse-wrapper"], [1, "collapse-content"], ["class", "collapse-handle", 3, "expanded", "click", 4, "ngIf"], ["visibilityObserver", "", 1, "selection-img", 3, "src"], ["class", "child-selection", 3, "click", 4, "ngFor", "ngForOf"], [1, "child-selection", 3, "click"], [1, "collapse-handle", 3, "click"]], template: function SelectionsComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵelementStart(1, "div", 1);
+        i0.ɵɵelementStart(2, "header", 2);
+        i0.ɵɵelement(3, "h2", 3);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(4, "div", 4);
+        i0.ɵɵtemplate(5, SelectionsComponent_ng_container_5_Template, 15, 6, "ng-container", 5);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+    } if (rf & 2) {
+        i0.ɵɵadvance(3);
+        i0.ɵɵproperty("textContent", "Configuratie");
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("ngForOf", ctx.selectionViewModels);
+    } }, directives: [i2.NgForOf, i2.NgIf, i3.LoaderComponent], styles: [".ione-configurator[_ngcontent-%COMP%]   .rp-answers-slideout[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 400px;\n  height: -moz-fit-content;\n  height: fit-content;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answers-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answers-container[_ngcontent-%COMP%] {\n  height: 100vh;\n  overflow-y: scroll;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-content[_ngcontent-%COMP%] {\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  font-size: 12px;\n  border: 1px solid lightgray;\n  padding: 10px;\n  display: flex;\n  flex-direction: row;\n  border-radius: 3px;\n  margin-bottom: 3px;\n  box-shadow: 2px 1px rgba(211, 211, 211, 0.5);\n  background: white;\n}\n.ione-configurator[_ngcontent-%COMP%]   .thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .img-size[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .unloaded[_ngcontent-%COMP%] {\n  background-color: lightgrey;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-wrapper[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-title[_ngcontent-%COMP%] {\n  font-size: 12px;\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n}\n.ione-configurator[_ngcontent-%COMP%]   .question[_ngcontent-%COMP%] {\n  font-weight: bold;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-style: italic;\n  margin-top: 3px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-wrapper[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-content[_ngcontent-%COMP%] {\n  display: block;\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-handle[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 10px;\n  right: 12px;\n  border: solid black;\n  border-width: 0 3px 3px 0;\n  display: inline-block;\n  padding: 3px;\n  transform: rotate(45deg);\n  -webkit-transform: rotate(45deg);\n}\n.ione-configurator[_ngcontent-%COMP%]   .collapse-handle.expanded[_ngcontent-%COMP%] {\n  transform: rotate(-135deg);\n  -webkit-transform: rotate(-135deg);\n}\n.ione-configurator[_ngcontent-%COMP%]   .child-selection[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  display: flex;\n  flex-direction: column;\n  margin-top: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .mat-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n  color: #1a1a1a;\n}\n.ione-configurator[_ngcontent-%COMP%]   .drawer__header[_ngcontent-%COMP%] {\n  height: 48px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .rp-selections-summary[_ngcontent-%COMP%] {\n  height: -moz-fit-content;\n  height: fit-content;\n  background: transparent;\n  overflow: auto;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 400px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selections-content[_ngcontent-%COMP%] {\n  overflow-y: auto;\n}\n.ione-configurator[_ngcontent-%COMP%]   .co-summary-line[_ngcontent-%COMP%] {\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  font-size: 12px;\n  border: 1px solid lightgray;\n  padding: 10px;\n  display: flex;\n  flex-direction: row;\n  border-radius: 3px;\n  margin-bottom: 3px;\n  box-shadow: 2px 1px rgba(211, 211, 211, 0.5);\n  background: white;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selection-thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .selection-img[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-thumbnail[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border: 1px solid #d3d3d3;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-img[_ngcontent-%COMP%] {\n  width: 54px;\n  min-width: 54px;\n  height: 54px;\n  min-height: 54px;\n  border-radius: 5px;\n}\n.ione-configurator[_ngcontent-%COMP%]   .unloaded[_ngcontent-%COMP%] {\n  background-color: lightgrey;\n}\n.ione-configurator[_ngcontent-%COMP%]   .titles[_ngcontent-%COMP%] {\n  margin-left: 14px;\n  align-self: center;\n}\n.ione-configurator[_ngcontent-%COMP%]   .title-wrapper[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n.ione-configurator[_ngcontent-%COMP%]   .answer-title-wrapper[_ngcontent-%COMP%] {\n  text-align: center;\n  align-self: center;\n  margin-left: 14px;\n}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNoYXJlZC5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNFO0VBQ0Usa0JBQUE7RUFDQSxNQUFBO0VBQ0EsUUFBQTtFQUNBLFlBQUE7RUFDQSx3QkFBQTtFQUFBLG1CQUFBO0FBQUo7QUFFRTtFQUNFLGlCQUFBO0VBQ0EsY0FBQTtBQUFKO0FBRUU7RUFDRSxhQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7RUFDQSxlQUFBO0VBQ0EsMkJBQUE7RUFDQSxhQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0Esa0JBQUE7RUFDQSxrQkFBQTtFQUNBLDRDQUFBO0VBQ0EsaUJBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsMkJBQUE7QUFBSjtBQUVFO0VBQ0UsY0FBQTtBQUFKO0FBRUU7RUFDRSxlQUFBO0VBQ0Esa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7QUFBSjtBQUVFO0VBQ0UsaUJBQUE7RUFDQSxjQUFBO0FBQUo7QUFFRTtFQUNFLGVBQUE7RUFDQSxrQkFBQTtFQUNBLGVBQUE7QUFBSjtBQUVFO0VBQ0UsY0FBQTtBQUFKO0FBRUU7RUFDRSxjQUFBO0FBQUo7QUFFRTtFQUNFLGtCQUFBO0VBQ0EsU0FBQTtFQUNBLFdBQUE7RUFDQSxtQkFBQTtFQUNBLHlCQUFBO0VBQ0EscUJBQUE7RUFDQSxZQUFBO0VBQ0Esd0JBQUE7RUFDQSxnQ0FBQTtBQUFKO0FBQ0k7RUFDRSwwQkFBQTtFQUNBLGtDQUFBO0FBQ047QUFFRTtFQUNFLGlCQUFBO0VBQ0EsYUFBQTtFQUNBLHNCQUFBO0VBQ0EsZUFBQTtBQUFKO0FBRUU7RUFDRSxpQkFBQTtFQUNBLGNBQUE7QUFBSjtBQUVFO0VBQ0UsWUFBQTtBQUFKO0FBRUU7RUFDRSx3QkFBQTtFQUFBLG1CQUFBO0VBQ0EsdUJBQUE7RUFDQSxjQUFBO0VBQ0Esa0JBQUE7RUFDQSxNQUFBO0VBQ0EsUUFBQTtFQUNBLFlBQUE7QUFBSjtBQUVFO0VBQ0UsZ0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxnQkFBQTtFQUNBLGVBQUE7RUFDQSxlQUFBO0VBQ0EsMkJBQUE7RUFDQSxhQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0Esa0JBQUE7RUFDQSxrQkFBQTtFQUNBLDRDQUFBO0VBQ0EsaUJBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsV0FBQTtFQUNBLGVBQUE7RUFDQSxZQUFBO0VBQ0EsZ0JBQUE7RUFDQSx5QkFBQTtFQUNBLGtCQUFBO0FBQUo7QUFFRTtFQUNFLFdBQUE7RUFDQSxlQUFBO0VBQ0EsWUFBQTtFQUNBLGdCQUFBO0VBQ0Esa0JBQUE7QUFBSjtBQUVFO0VBQ0UsMkJBQUE7QUFBSjtBQUVFO0VBQ0UsaUJBQUE7RUFDQSxrQkFBQTtBQUFKO0FBRUU7RUFDRSxhQUFBO0VBQ0Esc0JBQUE7QUFBSjtBQUVFO0VBQ0Usa0JBQUE7RUFDQSxrQkFBQTtFQUNBLGlCQUFBO0FBQUoiLCJmaWxlIjoic2hhcmVkLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuaW9uZS1jb25maWd1cmF0b3Ige1xyXG4gIC5ycC1hbnN3ZXJzLXNsaWRlb3V0e1xyXG4gICAgcG9zaXRpb246IGFic29sdXRlO1xyXG4gICAgdG9wOiAwO1xyXG4gICAgcmlnaHQ6IDA7XHJcbiAgICB3aWR0aDogNDAwcHg7XHJcbiAgICBoZWlnaHQ6IGZpdC1jb250ZW50O1xyXG4gIH1cclxuICAuYW5zd2Vycy10aXRsZSB7XHJcbiAgICBtYXJnaW4tbGVmdDogMTBweDtcclxuICAgIGNvbG9yOiAjMWExYTFhO1xyXG4gIH1cclxuICAuYW5zd2Vycy1jb250YWluZXIge1xyXG4gICAgaGVpZ2h0OiAxMDB2aDtcclxuICAgIG92ZXJmbG93LXk6IHNjcm9sbDtcclxuICB9XHJcbiAgLmFuc3dlci1jb250ZW50IHtcclxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcclxuICAgIG92ZXJmbG93OiBoaWRkZW47XHJcbiAgICBjdXJzb3I6IHBvaW50ZXI7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBib3JkZXI6IDFweCBzb2xpZCBsaWdodGdyYXk7XHJcbiAgICBwYWRkaW5nOiAxMHB4O1xyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBib3JkZXItcmFkaXVzOiAzcHg7XHJcbiAgICBtYXJnaW4tYm90dG9tOiAzcHg7XHJcbiAgICBib3gtc2hhZG93OiAycHggMXB4IHJnYmEoMjExLCAyMTEsIDIxMSwgMC41KTtcclxuICAgIGJhY2tncm91bmQ6IHdoaXRlO1xyXG4gIH1cclxuICAudGh1bWJuYWlsIHtcclxuICAgIHdpZHRoOiA1NHB4O1xyXG4gICAgbWluLXdpZHRoOiA1NHB4O1xyXG4gICAgaGVpZ2h0OiA1NHB4O1xyXG4gICAgbWluLWhlaWdodDogNTRweDtcclxuICAgIGJvcmRlcjogMXB4IHNvbGlkICNkM2QzZDM7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC5pbWctc2l6ZSB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC51bmxvYWRlZCB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodGdyZXk7XHJcbiAgfVxyXG4gIC5hbnN3ZXItd3JhcHBlciB7XHJcbiAgICBkaXNwbGF5OiBibG9jaztcclxuICB9XHJcbiAgLmFuc3dlci10aXRsZSB7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gIH1cclxuICAucXVlc3Rpb24ge1xyXG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XHJcbiAgICBjb2xvcjogIzFhMWExYTtcclxuICB9XHJcbiAgLmFuc3dlciB7XHJcbiAgICBmb250LXNpemU6IDEycHg7XHJcbiAgICBmb250LXN0eWxlOiBpdGFsaWM7XHJcbiAgICBtYXJnaW4tdG9wOiAzcHg7XHJcbiAgfVxyXG4gIC5jb2xsYXBzZS13cmFwcGVyIHtcclxuICAgIGRpc3BsYXk6IGJsb2NrO1xyXG4gIH1cclxuICAuY29sbGFwc2UtY29udGVudCB7XHJcbiAgICBkaXNwbGF5OiBibG9jaztcclxuICB9XHJcbiAgLmNvbGxhcHNlLWhhbmRsZSB7XHJcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XHJcbiAgICB0b3A6IDEwcHg7XHJcbiAgICByaWdodDogMTJweDtcclxuICAgIGJvcmRlcjogc29saWQgYmxhY2s7XHJcbiAgICBib3JkZXItd2lkdGg6IDAgM3B4IDNweCAwO1xyXG4gICAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xyXG4gICAgcGFkZGluZzogM3B4O1xyXG4gICAgdHJhbnNmb3JtOiByb3RhdGUoNDVkZWcpO1xyXG4gICAgLXdlYmtpdC10cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XHJcbiAgICAmLmV4cGFuZGVkIHtcclxuICAgICAgdHJhbnNmb3JtOiByb3RhdGUoLTEzNWRlZyk7XHJcbiAgICAgIC13ZWJraXQtdHJhbnNmb3JtOiByb3RhdGUoLTEzNWRlZyk7XHJcbiAgICB9XHJcbiAgfVxyXG4gIC5jaGlsZC1zZWxlY3Rpb24ge1xyXG4gICAgbWFyZ2luLWxlZnQ6IDEwcHg7XHJcbiAgICBkaXNwbGF5OiBmbGV4O1xyXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcclxuICAgIG1hcmdpbi10b3A6IDVweDtcclxuICB9XHJcbiAgLm1hdC10aXRsZSB7XHJcbiAgICBtYXJnaW4tbGVmdDogMTBweDtcclxuICAgIGNvbG9yOiAjMWExYTFhO1xyXG4gIH1cclxuICAuZHJhd2VyX19oZWFkZXIge1xyXG4gICAgaGVpZ2h0OiA0OHB4O1xyXG4gIH1cclxuICAucnAtc2VsZWN0aW9ucy1zdW1tYXJ5IHtcclxuICAgIGhlaWdodDogZml0LWNvbnRlbnQ7XHJcbiAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcclxuICAgIG92ZXJmbG93OiBhdXRvO1xyXG4gICAgcG9zaXRpb246IGFic29sdXRlO1xyXG4gICAgdG9wOiAwO1xyXG4gICAgcmlnaHQ6IDA7XHJcbiAgICB3aWR0aDogNDAwcHg7XHJcbiAgfVxyXG4gIC5zZWxlY3Rpb25zLWNvbnRlbnQge1xyXG4gICAgb3ZlcmZsb3cteTogYXV0bztcclxuICB9XHJcbiAgLmNvLXN1bW1hcnktbGluZSB7XHJcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gICAgZm9udC1zaXplOiAxMnB4O1xyXG4gICAgYm9yZGVyOiAxcHggc29saWQgbGlnaHRncmF5O1xyXG4gICAgcGFkZGluZzogMTBweDtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBmbGV4LWRpcmVjdGlvbjogcm93O1xyXG4gICAgYm9yZGVyLXJhZGl1czogM3B4O1xyXG4gICAgbWFyZ2luLWJvdHRvbTogM3B4O1xyXG4gICAgYm94LXNoYWRvdzogMnB4IDFweCByZ2JhKDIxMSwgMjExLCAyMTEsIDAuNSk7XHJcbiAgICBiYWNrZ3JvdW5kOiB3aGl0ZTtcclxuICB9XHJcbiAgLnNlbGVjdGlvbi10aHVtYm5haWwge1xyXG4gICAgd2lkdGg6IDU0cHg7XHJcbiAgICBtaW4td2lkdGg6IDU0cHg7XHJcbiAgICBoZWlnaHQ6IDU0cHg7XHJcbiAgICBtaW4taGVpZ2h0OiA1NHB4O1xyXG4gICAgYm9yZGVyOiAxcHggc29saWQgI2QzZDNkMztcclxuICAgIGJvcmRlci1yYWRpdXM6IDVweDtcclxuICB9XHJcbiAgLnNlbGVjdGlvbi1pbWcge1xyXG4gICAgd2lkdGg6IDU0cHg7XHJcbiAgICBtaW4td2lkdGg6IDU0cHg7XHJcbiAgICBoZWlnaHQ6IDU0cHg7XHJcbiAgICBtaW4taGVpZ2h0OiA1NHB4O1xyXG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xyXG4gIH1cclxuICAuYW5zd2VyLXRodW1ibmFpbCB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjZDNkM2QzO1xyXG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xyXG4gIH1cclxuICAuYW5zd2VyLWltZyB7XHJcbiAgICB3aWR0aDogNTRweDtcclxuICAgIG1pbi13aWR0aDogNTRweDtcclxuICAgIGhlaWdodDogNTRweDtcclxuICAgIG1pbi1oZWlnaHQ6IDU0cHg7XHJcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XHJcbiAgfVxyXG4gIC51bmxvYWRlZCB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodGdyZXk7XHJcbiAgfVxyXG4gIC50aXRsZXMge1xyXG4gICAgbWFyZ2luLWxlZnQ6IDE0cHg7XHJcbiAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XHJcbiAgfVxyXG4gIC50aXRsZS13cmFwcGVyIHtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xyXG4gIH1cclxuICAuYW5zd2VyLXRpdGxlLXdyYXBwZXIge1xyXG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gICAgYWxpZ24tc2VsZjogY2VudGVyO1xyXG4gICAgbWFyZ2luLWxlZnQ6IDE0cHg7XHJcbiAgfVxyXG59XHJcbiJdfQ== */"], data: { animation: [
+            animations_1.trigger('showHideChildren', [
+                animations_1.state('void', animations_1.style({ 'height': '0' })),
+                animations_1.state('*', animations_1.style({ 'height': '*' })),
+                animations_1.transition('void <=> *', animations_1.animate(200))
+            ])
+        ] } });
+
+
+/***/ }),
+
+/***/ 715:
+/*!************************************************************!*\
+  !*** ./src/app/components/selections/selections.module.ts ***!
+  \************************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.SelectionsModule = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const common_1 = __webpack_require__(/*! @angular/common */ 54364);
+const selections_component_1 = __webpack_require__(/*! ./selections.component */ 42226);
+const shared_module_1 = __webpack_require__(/*! ../shared/shared.module */ 4065);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class SelectionsModule {
+}
+exports.SelectionsModule = SelectionsModule;
+SelectionsModule.ɵfac = function SelectionsModule_Factory(t) { return new (t || SelectionsModule)(); };
+SelectionsModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: SelectionsModule });
+SelectionsModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            common_1.CommonModule,
+            shared_module_1.SharedModule
+        ]] });
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(SelectionsModule, { declarations: [selections_component_1.SelectionsComponent], imports: [common_1.CommonModule,
+        shared_module_1.SharedModule], exports: [selections_component_1.SelectionsComponent] }); })();
+
+
+/***/ }),
+
+/***/ 98506:
+/*!**************************************************************!*\
+  !*** ./src/app/components/shared/loader/loader.component.ts ***!
+  \**************************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.LoaderComponent = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class LoaderComponent {
+}
+exports.LoaderComponent = LoaderComponent;
+LoaderComponent.ɵfac = function LoaderComponent_Factory(t) { return new (t || LoaderComponent)(); };
+LoaderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LoaderComponent, selectors: [["rp-loader"]], decls: 5, vars: 0, consts: [[1, "loader-wrapper"], ["xmlns", "http://www.w3.org/2000/svg", "width", "44", "height", "44", "viewBox", "0 0 44 44", "stroke", "#3760a1"], ["fill", "none", "fill-rule", "evenodd", "stroke-width", "3"], ["cx", "22", "cy", "22", "r", "19", 1, "ripple1"], ["cx", "22", "cy", "22", "r", "19", 1, "ripple2"]], template: function LoaderComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵnamespaceSVG();
+        i0.ɵɵelementStart(1, "svg", 1);
+        i0.ɵɵelementStart(2, "g", 2);
+        i0.ɵɵelement(3, "circle", 3);
+        i0.ɵɵelement(4, "circle", 4);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+    } }, styles: ["[_nghost-%COMP%] {\n  -webkit-user-select: none;\n          user-select: none;\n  pointer-events: none;\n}\n[_nghost-%COMP%]   .loader-wrapper[_ngcontent-%COMP%] {\n  z-index: 1100;\n  position: absolute;\n  width: 54px;\n  height: 54px;\n}\n[_nghost-%COMP%]   .loader-wrapper[_ngcontent-%COMP%]   svg[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n}\n[_nghost-%COMP%]   .loader-wrapper[_ngcontent-%COMP%]   svg[_ngcontent-%COMP%]   .ripple1[_ngcontent-%COMP%] {\n  transform-origin: center;\n  animation: ripple 1.5s infinite;\n}\n[_nghost-%COMP%]   .loader-wrapper[_ngcontent-%COMP%]   svg[_ngcontent-%COMP%]   .ripple2[_ngcontent-%COMP%] {\n  transform-origin: center;\n  animation: ripple 1.5s infinite 0.4s;\n}\n@keyframes ripple {\n  0% {\n    transform: scale(0);\n    opacity: 1;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 0;\n  }\n}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImxvYWRlci5jb21wb25lbnQuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLHlCQUFBO1VBQUEsaUJBQUE7RUFDQSxvQkFBQTtBQUNGO0FBQUU7RUFDRSxhQUFBO0VBQ0Esa0JBQUE7RUFDQSxXQUFBO0VBQ0EsWUFBQTtBQUVKO0FBREk7RUFDRSxXQUFBO0VBQ0EsWUFBQTtBQUdOO0FBRk07RUFDRSx3QkFBQTtFQUNBLCtCQUFBO0FBSVI7QUFGTTtFQUNFLHdCQUFBO0VBQ0Esb0NBQUE7QUFJUjtBQUVBO0VBQ0U7SUFDRSxtQkFBQTtJQUNBLFVBQUE7RUFDRjtFQUNBO0lBQ0UsbUJBQUE7SUFDQSxVQUFBO0VBQ0Y7QUFDRiIsImZpbGUiOiJsb2FkZXIuY29tcG9uZW50LnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyI6aG9zdCB7XHJcbiAgdXNlci1zZWxlY3Q6IG5vbmU7XHJcbiAgcG9pbnRlci1ldmVudHM6IG5vbmU7XHJcbiAgLmxvYWRlci13cmFwcGVyIHtcclxuICAgIHotaW5kZXg6IDExMDA7IC8vIGFib3ZlIGRpYWxvZ3NcclxuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcclxuICAgIHdpZHRoOiA1NHB4O1xyXG4gICAgaGVpZ2h0OiA1NHB4O1xyXG4gICAgc3ZnIHtcclxuICAgICAgd2lkdGg6IDEwMCU7XHJcbiAgICAgIGhlaWdodDogMTAwJTtcclxuICAgICAgLnJpcHBsZTEge1xyXG4gICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjtcclxuICAgICAgICBhbmltYXRpb246IHJpcHBsZSAxLjVzIGluZmluaXRlO1xyXG4gICAgICB9XHJcbiAgICAgIC5yaXBwbGUyIHtcclxuICAgICAgICB0cmFuc2Zvcm0tb3JpZ2luOiBjZW50ZXI7XHJcbiAgICAgICAgYW5pbWF0aW9uOiByaXBwbGUgMS41cyBpbmZpbml0ZSAuNHM7XHJcbiAgICAgIH1cclxuICAgIH1cclxuICB9XHJcbn1cclxuXHJcbkBrZXlmcmFtZXMgcmlwcGxlIHtcclxuICAwJSB7XHJcbiAgICB0cmFuc2Zvcm06IHNjYWxlKDApO1xyXG4gICAgb3BhY2l0eTogMTtcclxuICB9XHJcbiAgMTAwJSB7XHJcbiAgICB0cmFuc2Zvcm06IHNjYWxlKDEpO1xyXG4gICAgb3BhY2l0eTogMDtcclxuICB9XHJcbn1cclxuIl19 */"] });
+
+
+/***/ }),
+
+/***/ 4065:
+/*!****************************************************!*\
+  !*** ./src/app/components/shared/shared.module.ts ***!
+  \****************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.SharedModule = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const common_1 = __webpack_require__(/*! @angular/common */ 54364);
+const loader_component_1 = __webpack_require__(/*! ./loader/loader.component */ 98506);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class SharedModule {
+}
+exports.SharedModule = SharedModule;
+SharedModule.ɵfac = function SharedModule_Factory(t) { return new (t || SharedModule)(); };
+SharedModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: SharedModule });
+SharedModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            common_1.CommonModule
+        ]] });
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(SharedModule, { declarations: [loader_component_1.LoaderComponent], imports: [common_1.CommonModule], exports: [loader_component_1.LoaderComponent] }); })();
+
+
+/***/ }),
+
+/***/ 52966:
+/*!********************************************************************!*\
+  !*** ./src/app/directives/visibility-observer-master.directive.ts ***!
+  \********************************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.VisibilityObserverMasterDirective = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+class VisibilityObserverMasterDirective {
+    // I initialize the intersection observer parent directive.
+    constructor() {
+        // As each observable child attaches itself to the parent observer, we need to
+        // map Elements to Callbacks so that when an Element's intersection changes,
+        // we'll know which callback to invoke. For this, we'll use an ES6 Map.
+        this._mapping = new Map();
+        this._observer = new IntersectionObserver((entries) => {
+            for (const entry of entries) {
+                const callback = this._mapping.get(entry.target);
+                if (callback) {
+                    callback(entry.isIntersecting);
+                }
+            }
+        }, {
+            // This classifies the "intersection" as being a bit outside the
+            // viewport. The intent here is give the elements a little time to react
+            // to the change before the element is actually visible to the user.
+            rootMargin: '300px 0px 300px 0px'
+        });
+    }
+    // I get called once when the host element is being destroyed.
+    ngOnDestroy() {
+        this._mapping.clear();
+        this._observer.disconnect();
+    }
+    // ---
+    // PUBLIC METHODS.
+    // ---
+    // I add the given Element for intersection observation. When the intersection status
+    // changes, the given callback is invoked with the new status.
+    add(element, callback) {
+        this._mapping.set(element, callback);
+        this._observer.observe(element);
+    }
+    // I remove the given Element from intersection observation.
+    remove(element) {
+        this._mapping.delete(element);
+        this._observer.unobserve(element);
+    }
+}
+exports.VisibilityObserverMasterDirective = VisibilityObserverMasterDirective;
+VisibilityObserverMasterDirective.ɵfac = function VisibilityObserverMasterDirective_Factory(t) { return new (t || VisibilityObserverMasterDirective)(); };
+VisibilityObserverMasterDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: VisibilityObserverMasterDirective, selectors: [["", "visibilityObserverMaster", ""]] });
+
+
+/***/ }),
+
+/***/ 27789:
+/*!*************************************************************!*\
+  !*** ./src/app/directives/visibility-observer.directive.ts ***!
+  \*************************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.VisibilityObserverDirective = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const i0 = tslib_1.__importStar(__webpack_require__(/*! @angular/core */ 2316));
+const i1 = tslib_1.__importStar(__webpack_require__(/*! ./visibility-observer-master.directive */ 52966));
+class VisibilityObserverDirective {
+    // I initialize the intersection observer directive.
+    constructor(parent, elementRef) {
+        this.observerEnabled = false;
+        // These are just some human-friendly constants to make the HTML template a bit more
+        // readable when being consumed as part of SWTCH/CASE statements.
+        this.IS_INTERSECTING = true;
+        this.IS_NOT_INTERSECTING = false;
+        this._parent = parent;
+        this._elementRef = elementRef;
+        // By default, we're going to assume that the host element is NOT intersecting.
+        // Then, we'll use the IntersectionObserver to asynchronously check for changes
+        // in viewport visibility.
+        this.isIntersecting = false;
+    }
+    // ---
+    // PUBLIC METHODS.
+    // ---
+    // I get called once when the host element is being destroyed.
+    ngOnDestroy() {
+        this._parent.remove(this._elementRef.nativeElement);
+        this._elementRef = undefined;
+    }
+    // I get called once after the inputs have been bound for the first time.
+    ngOnInit() {
+        // In this demo, instead of using an IntersectionObserver per Element, we're
+        // going to use a shared observer in the parent element. However, we're still
+        // going to use a CALLBACK style approach so that we're only reducing the number
+        // of IntersectionObserver instances, not the number of Function calls.
+        if (this.observerEnabled) {
+            this._parent.add(this._elementRef.nativeElement, (isIntersecting) => {
+                this.isIntersecting = isIntersecting;
+                if (this.isIntersecting) {
+                    this._parent.remove(this._elementRef.nativeElement);
+                }
+            });
+        }
+    }
+}
+exports.VisibilityObserverDirective = VisibilityObserverDirective;
+VisibilityObserverDirective.ɵfac = function VisibilityObserverDirective_Factory(t) { return new (t || VisibilityObserverDirective)(i0.ɵɵdirectiveInject(i1.VisibilityObserverMasterDirective), i0.ɵɵdirectiveInject(i0.ElementRef)); };
+VisibilityObserverDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: VisibilityObserverDirective, selectors: [["", "visibilityObserver", ""]], inputs: { observerEnabled: "observerEnabled" }, exportAs: ["intersection"] });
+
+
+/***/ }),
+
+/***/ 13965:
+/*!**************************************************!*\
+  !*** ./src/app/services/configurator.service.ts ***!
+  \**************************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.ConfiguratorService = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const configurator_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/configurator */ 9374);
+const not_nill_function_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/utils/function/not-nill.function */ 41878);
+const node_type_enum_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/enum/node-type.enum */ 3085);
+const is_nill_function_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/utils/function/is-nill.function */ 81866);
+class ConfiguratorService {
+    initApi(options) {
+        this._configuratorApi = new configurator_1.Configurator(options);
+    }
+    initNodeInstance(goodId) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.initNodeInstance(goodId);
+        });
+    }
+    setInstanceToConfigure(id, showLoader = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.setInstanceToConfigure(id, showLoader);
+        });
+    }
+    getGoodIdFromSku(sku, showLoader = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.getGoodIdFromSku(sku, showLoader);
+        });
+    }
+    getArticleQuickSel(goodId, showLoader = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.getArticleQuickSel(goodId, showLoader);
+        });
+    }
+    getSelections(showLoader = false, publicationCode = 2) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const selections = yield this._configuratorApi.getSelections(showLoader);
+            selections.resultObjects.filter((s) => {
+                (is_nill_function_1.isNill(s.hierarchicalPublicationCode) || ((s.hierarchicalPublicationCode & publicationCode) > 0)) && ((s.nodeType === node_type_enum_1.NodeType.Question && (((s.questionPublicationCode & publicationCode) > 0) || is_nill_function_1.isNill(s.questionPublicationCode))) ||
+                    (s.nodeType === node_type_enum_1.NodeType.Answer && (((s.answerPublicationCode & publicationCode) > 0) || is_nill_function_1.isNill(s.answerPublicationCode))));
+            });
+            return selections;
+        });
+    }
+    getDecos(showLoader = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.getDecos(showLoader);
+        });
+    }
+    getQuestionAndAnswers(showLoader = false, publicationCode = 2) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const questionAndAnswers = yield this._configuratorApi.getQuestionAndAnswers(showLoader);
+            questionAndAnswers.answers.filter((answer) => {
+                (not_nill_function_1.notNill(answer.hierarchicalPublicationCode) && (answer.hierarchicalPublicationCode & publicationCode) === 0) ||
+                    (answer.type === node_type_enum_1.NodeType.Question && (answer.questionPublicationCode & publicationCode) === 0 && not_nill_function_1.notNill(answer.questionPublicationCode)) ||
+                    (answer.type === node_type_enum_1.NodeType.Answer && (answer.publicationCode & publicationCode) === 0 && not_nill_function_1.notNill(answer.publicationCode));
+            });
+            return questionAndAnswers;
+        });
+    }
+    getSingleImage(nodeId, publication, includeMimetype, thumb, showLoader) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!nodeId) {
+                return null;
+            }
+            return yield this._configuratorApi.getSingleImage(nodeId, publication, includeMimetype, thumb, showLoader);
+        });
+    }
+    selectSelection(selection, showLoader = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.selectSelection(selection, showLoader);
+        });
+    }
+    selectAnswer(answer, showLoader = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            return yield this._configuratorApi.selectAnswer(answer, showLoader);
+        });
+    }
+}
+exports.ConfiguratorService = ConfiguratorService;
+
+
+/***/ }),
+
+/***/ 30609:
+/*!***************************************!*\
+  !*** ./src/app/utils/object.utils.ts ***!
+  \***************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.ObjectUtils = void 0;
+const three_1 = __webpack_require__(/*! three */ 30712);
+class ObjectUtils {
+    static DisposeNode(node) {
+        node.traverse((obj) => {
+            if (obj instanceof three_1.Mesh) {
+                if (obj.geometry) {
+                    obj.geometry.dispose();
+                }
+                ObjectUtils.DisposeMaterial(obj.material);
+            }
+            if (typeof obj.dispose === 'function') {
+                // @ts-ignore
+                obj.dispose();
+            }
+        });
+    }
+    static DisposeMaterial(material) {
+        if (!material) {
+            return;
+        }
+        if (Array.isArray(material)) {
+            material.forEach(mtrl => {
+                this.materialProps
+                    .filter(mapType => mtrl[mapType])
+                    .forEach(mapType => mtrl[mapType].dispose());
+                mtrl.dispose(); // disposes any programs associated with the material
+            });
+        }
+        else {
+            this.materialProps
+                .filter(mapType => material[mapType] && material[mapType].dispose)
+                .forEach(mapType => material[mapType].dispose());
+            if (material.dispose) {
+                material.dispose(); // disposes any programs associated with the material
+            }
+        }
+    }
+    static DisposeObject(object) {
+        if (!object) {
+            return;
+        }
+        if (object.children.length) {
+            object.children.forEach(child => this.DisposeObject(child));
+        }
+        this.DisposeNode(object);
+    }
+}
+exports.ObjectUtils = ObjectUtils;
+ObjectUtils.materialProps = ['map', 'lightMap', 'bumpMap', 'normalMap', 'specularMap', 'envMap', 'aoMap', 'roughnessMap', 'metalnessMap'];
+
+
+/***/ }),
+
+/***/ 92340:
+/*!*****************************************!*\
+  !*** ./src/environments/environment.ts ***!
+  \*****************************************/
+/***/ ((__unused_webpack_module, exports) => {
+
+"use strict";
+
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.environment = void 0;
+exports.environment = {
+    production: false
+};
+
+
+/***/ }),
+
+/***/ 41086:
+/*!****************************************!*\
+  !*** ./src/helper/variation-helper.ts ***!
+  \****************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.VariationHelper = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const deco_node_type_enum_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/enum/deco-node-type.enum */ 63447);
+const variation_settings_1 = __webpack_require__(/*! ../model/variation-settings */ 95664);
+const asset_utils_1 = __webpack_require__(/*! ../utils/asset.utils */ 27743);
+const variation_1 = __webpack_require__(/*! ../model/variation */ 33009);
+const variation_utils_1 = __webpack_require__(/*! ../utils/variation-utils */ 4876);
+const image_utils_1 = __webpack_require__(/*! ../utils/image.utils */ 22700);
+const three_1 = __webpack_require__(/*! three */ 30712);
+const operators_1 = __webpack_require__(/*! rxjs/operators */ 41873);
+const material_1 = __webpack_require__(/*! ../model/material */ 68497);
+class VariationHelper {
+    constructor() {
+        this._variations = [];
+        this._lastKnownVariations = new Map();
+    }
+    clearCache() {
+        const variationMap = Array.from(this._lastKnownVariations.values());
+        variationMap.forEach((variations) => {
+            variations.forEach((variation) => {
+                try {
+                    if (variation.material) {
+                        if (variation.material.texture) {
+                            variation.material.texture.dispose();
+                        }
+                        if (variation.material.normal) {
+                            variation.material.normal.dispose();
+                        }
+                        if (variation.material.metalness) {
+                            variation.material.metalness.dispose();
+                        }
+                        if (variation.material.roughness) {
+                            variation.material.roughness.dispose();
+                        }
+                        if (variation.material.ao) {
+                            variation.material.ao.dispose();
+                        }
+                    }
+                }
+                catch (e) {
+                }
+            });
+        });
+        variation_utils_1.VariationUtils.ClearCache();
+        image_utils_1.ImageUtils.ClearCache();
+    }
+    loadPart(obj, parts, usePbr = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            try {
+                const len = parts.length;
+                for (let i = 0; i < len; i++) {
+                    if (parts[i].decoNode && parts[i].decoNode.gameObjectName && parts[i].decoNode.type === deco_node_type_enum_1.DecoNodeType.Part) {
+                        const partSettings = yield variation_utils_1.VariationUtils.LoadVariation(this.assetPath, parts[i].decoNode.gameObjectName || parts[i].decoId);
+                        if (partSettings) {
+                            const partVariation = new variation_1.Variation();
+                            partVariation.decoId = parseFloat(parts[i].decoNode.id);
+                            partVariation.brandId = parts[i].decoNode.brandId;
+                            partVariation.gameObjectName = parts[i].decoNode.gameObjectName;
+                            partVariation.material = yield asset_utils_1.AssetUtils.CreateMaterialFromAsset(partSettings);
+                            // parts[i].variation = partVariation;
+                            this._applyMaterialPart(obj, partVariation, parts[i].node, usePbr);
+                        }
+                    }
+                }
+            }
+            catch (e) {
+                console.error(e);
+            }
+        });
+    }
+    loadVariation(obj, parts, usePbr = false) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            try {
+                const len = parts.length;
+                for (let i = 0; i < len; i++) {
+                    const variations = parts[i].variations;
+                    if (!variations || variations.length === 0) {
+                        if (this._getLastKnownVariations(parts[i].nodeId)) {
+                            parts[i].variations = this._getLastKnownVariations(parts[i].nodeId);
+                            this._applyVariations(obj, parts[i], usePbr);
+                            continue;
+                        }
+                        else {
+                            continue;
+                        }
+                    }
+                    const lastKnownVariations = [];
+                    const variationPromise = [];
+                    for (let j = 0; j < variations.length; j++) {
+                        variationPromise.push(this.loadTheVariation(variations[j].gameObjectName || parts[i].decoId)
+                            .then((variationSettings) => {
+                            const newVariation = new variation_1.Variation();
+                            newVariation.decoId = variations[j].constructor.name === 'Variation' ? variations[j].decoId : parseFloat(variations[j].id);
+                            newVariation.node = variations[j].constructor.name === 'Variation' ? variations[j].node : variations[j].nodeId;
+                            newVariation.brandId = variations[j].brandId;
+                            newVariation.optionText = variations[j].optionText;
+                            newVariation.gameObjectName = variations[j].gameObjectName;
+                            newVariation.supplierArticleNr = variations[j].supplierArticleNr;
+                            newVariation.materialId = variations[j].materialId;
+                            newVariation.material = variationSettings ? variationSettings.material : null;
+                            lastKnownVariations.push(newVariation);
+                        }));
+                    }
+                    yield Promise.all(variationPromise);
+                    this._setLastKnownVariations(`${parts[i].nodeId}_${parts[i].node}`, lastKnownVariations);
+                    parts[i].variations = lastKnownVariations;
+                    this._applyVariations(obj, parts[i], usePbr);
+                }
+            }
+            catch (e) {
+                this._log(e.message);
+            }
+        });
+    }
+    get(id) {
+        const len = this._variations.length;
+        for (let i = 0; i < len; i++) {
+            if (this._variations[i].id && this._variations[i].id === id) {
+                return this._variations[i];
+            }
+        }
+    }
+    set(variations) {
+        const idx = this._variations.findIndex(v => v.id === variations.id);
+        if (idx > -1) {
+            this._variations[idx] = variations;
+        }
+        else {
+            this._variations.push(variations);
+        }
+    }
+    preloadVariations(fileNames) {
+        for (let i = 0; i < fileNames.length; i++) {
+            const fileName = fileNames[i];
+            if (fileName && !this.get(fileName)) {
+                const settings = new variation_settings_1.VariationSettings();
+                settings.id = fileName;
+                settings.loading = true;
+                this._variations.push(settings);
+                variation_utils_1.VariationUtils.LoadVariation(this.assetPath, fileName)
+                    .then((variationSettings) => {
+                    settings.loading = false;
+                    if (variationSettings) {
+                        // this.set(variationSettings);
+                        settings.copyFrom(variationSettings);
+                    }
+                    settings.loaded.next(settings);
+                })
+                    .catch((err) => {
+                    console.error(`Error loading variation ${fileName}:`, err);
+                    settings.loading = false;
+                    settings.loaded.next(null);
+                });
+            }
+        }
+    }
+    loadTheVariation(fileName) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!fileName) {
+                return null;
+            }
+            const settings = this.get(fileName);
+            if (!settings) {
+                return null;
+            }
+            if (settings.loading) {
+                const sett = yield this._waitForVariationToLoad(settings);
+                yield this._loadMaterialFromSettings(sett);
+                return sett;
+            }
+            else {
+                yield this._loadMaterialFromSettings(settings);
+                return settings;
+            }
+        });
+    }
+    _loadMaterialFromSettings(settings) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (settings) {
+                if (!settings.material) {
+                    settings.material = yield asset_utils_1.AssetUtils.CreateMaterialFromAsset(settings);
+                }
+            }
+        });
+    }
+    _waitForVariationToLoad(settings) {
+        return new Promise((resolve) => {
+            settings.loaded.pipe(operators_1.filter((value) => value !== undefined), operators_1.take(1)).subscribe((value) => {
+                resolve(value);
+            });
+        });
+    }
+    _getChildrenFilterByProp(obj, userDataObjectProp, prop, value) {
+        return obj.children.filter((child) => {
+            return child.userData &&
+                child.userData.hasOwnProperty(userDataObjectProp) &&
+                child.userData[userDataObjectProp].hasOwnProperty(prop) &&
+                child.userData[userDataObjectProp][prop] === value;
+        });
+    }
+    _applyMaterialPart(obj, partMaterial, nodeId, usePbr = false) {
+        const children = this._getChildrenFilterByProp(obj, 'selection', 'node', nodeId);
+        const len = children.length;
+        for (let i = 0; i < len; i++) {
+            const child = children[i];
+            if (child !== null && child !== undefined) {
+                child.traverse((mesh) => {
+                    if ((mesh instanceof three_1.Mesh || mesh.constructor.name === 'Mesh') && partMaterial) {
+                        if (Array.isArray(mesh.material)) { // multimaterial support
+                            for (let j = 0, jlen = mesh.material.length; j < jlen; j++) {
+                                if (mesh.material[j].name.toLowerCase().indexOf('fixed_frame') !== -1) {
+                                    mesh.material[j] = this._setMeshMaterialFromVariation(mesh.material[j].name, partMaterial, usePbr);
+                                }
+                            }
+                        }
+                        else {
+                            if (mesh.material.name && mesh.material.name.toLowerCase().indexOf('fixed_frame') !== -1) {
+                                mesh.material = this._setMeshMaterialFromVariation(mesh.material.name, partMaterial, usePbr);
+                            }
+                        }
+                    }
+                });
+            }
+        }
+    }
+    _applyVariations(obj, part, usePbr = false) {
+        const children = this._getChildrenFilterByProp(obj, 'selection', 'node', part.node);
+        const len = children.length;
+        for (let i = 0; i < len; i++) {
+            const child = children[i];
+            if (child !== null && child !== undefined) {
+                child.traverse((mesh) => {
+                    if ((mesh instanceof three_1.Mesh || mesh.constructor.name === 'Mesh') && part.variations && part.variations.length > 0 && mesh.name.toLowerCase().indexOf('c_')) {
+                        for (let j = 0; j < part.variations.length; j++) {
+                            const variation = part.variations[j];
+                            if (variation.material) {
+                                const materialToSearch = !!variation.materialId ? variation.materialId.toLowerCase() : 'default';
+                                if (Array.isArray(mesh.material)) { // multimaterial support
+                                    for (let m = 0, mlen = mesh.material.length; m < mlen; m++) {
+                                        if (mesh.material[m].name.toLowerCase().indexOf(materialToSearch) !== -1) {
+                                            if ((variation.material instanceof material_1.Material || variation.material.constructor.name === 'Material') && variation.material.isMaterial) {
+                                                // it's a THREE.Material
+                                                mesh.material[m] = variation.material;
+                                                if (mesh.material[m].name && (mesh.material[m].name === 'Fixed_Glass' || mesh.material[m].name === 'Default_Glass')) {
+                                                    mesh.castShadow = false;
+                                                }
+                                            }
+                                            else {
+                                                mesh.material[m] = this._setMeshMaterialFromVariation(mesh.material[m].name, variation, usePbr);
+                                                if (mesh.material[m].name && (mesh.material[m].name === 'Fixed_Glass' || mesh.material[m].name === 'Default_Glass')) {
+                                                    mesh.castShadow = false;
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                                else {
+                                    if (mesh.material.name && mesh.material.name.toLowerCase().indexOf(materialToSearch) !== -1) {
+                                        if ((variation.material instanceof material_1.Material || variation.material.constructor.name === 'Material') && variation.material.isMaterial) {
+                                            // it's a THREE.Material
+                                            mesh.material = variation.material;
+                                            if (mesh.material.name === 'Fixed_Glass' || mesh.material.name === 'Default_Glass') {
+                                                mesh.castShadow = false;
+                                            }
+                                        }
+                                        else {
+                                            mesh.material = this._setMeshMaterialFromVariation(mesh.material.name, variation, usePbr);
+                                            if (mesh.material.name === 'Fixed_Glass' || mesh.material.name === 'Default_Glass') {
+                                                mesh.castShadow = false;
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                });
+            }
+        }
+    }
+    _setMeshMaterialFromVariation(name, variation, usePbr = false) {
+        const material = variation.material;
+        if (material.texture) {
+            material.texture.needsUpdate = true;
+            material.texture.mapping = three_1.EquirectangularReflectionMapping;
+        }
+        if (!usePbr) {
+            const newMaterial = new three_1.MeshPhongMaterial({
+                name: name,
+                shininess: material.shininess,
+                specular: material.specular,
+                map: material.texture,
+                normalMap: material.normal
+            });
+            newMaterial.color.setRGB(0.8, 0.8, 0.8);
+            newMaterial.needsUpdate = true;
+            return newMaterial;
+        }
+        if (material.sheen || material.sheenColor || material.reflectivity || material.transmission) { // TODO: Proper check for all unique physical material properties
+            const params = {
+                // side: material.side ? material.side : FrontSide,
+                name: name,
+                roughness: material.roughnessValue !== undefined && material.roughnessValue !== null ? material.roughnessValue : 1,
+                metalness: material.metalnessValue !== undefined && material.metalnessValue !== null ? material.metalnessValue : 0,
+                envMapIntensity: material.envMapIntensity ? material.envMapIntensity : 0.01,
+                clearcoatMap: material.clearcoatMap ? material.clearcoatMap : null,
+                clearcoatRoughnessMap: material.clearcoatRoughnessMap ? material.clearcoatRoughnessMap : null,
+                attenuationDistance: Infinity
+                // wireframe: true,
+                // opacity: 0.3,
+                // transparent: true,
+            };
+            if (material.displacementValue) {
+                params.displacementScale = material.displacementValue;
+            }
+            if (material.opacity) {
+                params.opacity = material.opacity;
+            }
+            if (material.transparent) {
+                params.transparent = material.transparent;
+            }
+            if (material.emissiveValue) {
+                params.emissive = material.emissiveValue;
+            }
+            if (material.emissiveIntensityValue) {
+                params.emissiveIntensity = material.emissiveIntensityValue;
+            }
+            if (material.texture) {
+                params.map = material.texture;
+                params.map.needsUpdate = true;
+            }
+            if (material.ao) {
+                params.aoMap = material.ao;
+                params.aoMap.needsUpdate = true;
+            }
+            if (material.roughness) {
+                params.roughnessMap = material.roughness;
+                params.roughnessMap.needsUpdate = true;
+                // material.roughness.magFilter = NearestFilter;
+            }
+            if (material.metalness) {
+                params.metalnessMap = material.metalness;
+                params.metalnessMap.needsUpdate = true;
+            }
+            if (material.normal) {
+                params.normalMap = material.normal;
+                params.normalMap.needsUpdate = true;
+            }
+            if (material.displacement) {
+                params.displacementMap = material.displacement;
+                params.displacementMap.needsUpdate = true;
+            }
+            if (material.emissive) {
+                params.emissiveMap = material.emissive;
+                params.emissiveMap.needsUpdate = true;
+            }
+            if (material.envMap) {
+                if (material.envMapIntensity != null || 0) {
+                    params.envMap = material.envMap;
+                    params.envMap.needsUpdate = true;
+                    material.envMap.mapping = three_1.EquirectangularReflectionMapping;
+                    material.envMap.minFilter = three_1.NearestFilter;
+                    material.envMap.magFilter = three_1.NearestFilter;
+                }
+            }
+            if (material.reflectivity) {
+                params.reflectivity = material.reflectivity;
+            }
+            if (material.side) {
+                params.side = material.side;
+            }
+            else {
+                params.side = three_1.DoubleSide;
+            }
+            const newMaterial = new three_1.MeshPhysicalMaterial(params);
+            newMaterial.color.setRGB(1, 1, 1);
+            if (material.sheen) {
+                newMaterial.sheen = material.sheen;
+            }
+            if (material.sheenColor) {
+                newMaterial.sheenColor = this._createValidColor(material.sheenColor);
+            }
+            else {
+                // Add fallback for blender render
+                newMaterial.sheenColor = new three_1.Color(1, 1, 1);
+            }
+            if (material.sheenRoughness) {
+                newMaterial.sheenRoughness = material.sheenRoughness;
+            }
+            if (material.sheenColorMap) {
+                newMaterial.sheenColorMap = material.sheenColorMap;
+                newMaterial.sheenColorMap.needsUpdate = true;
+            }
+            if (material.sheenRoughnessMap) {
+                newMaterial.sheenRoughnessMap = material.sheenRoughnessMap;
+                newMaterial.sheenRoughnessMap.needsUpdate = true;
+            }
+            if (material.transmission) {
+                newMaterial.transmission = material.transmission;
+            }
+            if (material.ior !== undefined && material.ior !== null) {
+                newMaterial.ior = material.ior;
+            }
+            if (material.thickness !== undefined && material.thickness !== null) {
+                newMaterial.thickness = material.thickness;
+            }
+            if (material.specularIntensity !== undefined && material.specularIntensity !== null) {
+                newMaterial.specularIntensity = material.specularIntensity;
+            }
+            if (material.transmissionMap) {
+                newMaterial.transmissionMap = material.transmissionMap;
+                newMaterial.transmissionMap.needsUpdate = true;
+            }
+            newMaterial.needsUpdate = true;
+            return newMaterial;
+        }
+        else {
+            const params = {
+                // side: material.side ? material.side : FrontSide,
+                name: name,
+                roughness: material.roughnessValue !== undefined && material.roughnessValue !== null ? material.roughnessValue : 1,
+                metalness: material.metalnessValue !== undefined && material.metalnessValue !== null ? material.metalnessValue : 0,
+                envMapIntensity: material.envMapIntensity ? material.envMapIntensity : 0.01
+                // wireframe: true,
+                // opacity: 0.3,
+                // transparent: true,
+            };
+            if (material.displacementValue) {
+                params.displacementScale = material.displacementValue;
+            }
+            if (material.opacity) {
+                params.opacity = material.opacity;
+            }
+            if (material.transparent) {
+                params.transparent = material.transparent;
+            }
+            if (material.emissiveValue) {
+                params.emissive = material.emissiveValue;
+            }
+            if (material.emissiveIntensityValue) {
+                params.emissiveIntensity = material.emissiveIntensityValue;
+            }
+            if (material.texture) {
+                params.map = material.texture;
+                params.map.needsUpdate = true;
+            }
+            if (material.ao) {
+                params.aoMap = material.ao;
+                params.aoMap.needsUpdate = true;
+            }
+            if (material.roughness) {
+                params.roughnessMap = material.roughness;
+                params.roughnessMap.needsUpdate = true;
+                // material.roughness.magFilter = NearestFilter;
+            }
+            if (material.metalness) {
+                params.metalnessMap = material.metalness;
+                params.metalnessMap.needsUpdate = true;
+            }
+            if (material.normal) {
+                params.normalMap = material.normal;
+                params.normalMap.needsUpdate = true;
+            }
+            if (material.displacement) {
+                params.displacementMap = material.displacement;
+                params.displacementMap.needsUpdate = true;
+            }
+            if (material.emissive) {
+                params.emissiveMap = material.emissive;
+                params.emissiveMap.needsUpdate = true;
+            }
+            if (material.envMap) {
+                if (material.envMapIntensity != null || 0) {
+                    params.envMap = material.envMap;
+                    params.envMap.needsUpdate = true;
+                    material.envMap.mapping = three_1.EquirectangularReflectionMapping;
+                    material.envMap.minFilter = three_1.NearestFilter;
+                    material.envMap.magFilter = three_1.NearestFilter;
+                }
+            }
+            if (material.side) {
+                params.side = material.side;
+            }
+            else {
+                params.side = three_1.DoubleSide;
+            }
+            const newMaterial = new three_1.MeshStandardMaterial(params);
+            newMaterial.color.setRGB(1, 1, 1);
+            newMaterial.needsUpdate = true;
+            return newMaterial;
+        }
+    }
+    _setLastKnownVariations(id, variation) {
+        this._lastKnownVariations.set(id, variation);
+    }
+    _getLastKnownVariations(id) {
+        if (this._lastKnownVariations.has(id)) {
+            return this._lastKnownVariations.get(id);
+        }
+        return null;
+    }
+    _createValidColor(color) {
+        if (typeof color === 'string') {
+            if (/^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(color)) {
+                return new three_1.Color(`#${color.replace('#', '')}`);
+            }
+        }
+        else if (color instanceof three_1.Color || color.constructor.name === 'Color') {
+            return color;
+        }
+        else {
+            try {
+                return new three_1.Color(color);
+            }
+            catch (e) {
+                return new three_1.Color();
+            }
+        }
+        return new three_1.Color();
+    }
+    _log(message) {
+        if (this.debug) {
+            this.debug(message);
+            console.log(new Date(), message);
+        }
+    }
+}
+exports.VariationHelper = VariationHelper;
+
+
+/***/ }),
+
+/***/ 14431:
+/*!*********************!*\
+  !*** ./src/main.ts ***!
+  \*********************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const __NgCli_bootstrap_1 = tslib_1.__importStar(__webpack_require__(/*! @angular/platform-browser */ 71570));
+const core_1 = __webpack_require__(/*! @angular/core */ 2316);
+const environment_1 = __webpack_require__(/*! ./environments/environment */ 92340);
+const app_module_1 = __webpack_require__(/*! ./app/app.module */ 36747);
+if (environment_1.environment.production) {
+    core_1.enableProdMode();
+}
+__NgCli_bootstrap_1.platformBrowser().bootstrapModule(app_module_1.AppModule);
+
+
+/***/ }),
+
+/***/ 68497:
+/*!*******************************!*\
+  !*** ./src/model/material.ts ***!
+  \*******************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.Material = void 0;
+const three_1 = __webpack_require__(/*! three */ 30712);
+class Material {
+    constructor() {
+        this.specular = new three_1.Color(0.3, 0.3, 0.3);
+        this.shininess = 0;
+        this.repeatX = 4;
+        this.repeatY = 4;
+        this.loaded = false;
+    }
+}
+exports.Material = Material;
+
+
+/***/ }),
+
+/***/ 95664:
+/*!*****************************************!*\
+  !*** ./src/model/variation-settings.ts ***!
+  \*****************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.VariationSettings = exports.VariationSettingsSettings = void 0;
+const rxjs_1 = __webpack_require__(/*! rxjs */ 67740);
+class VariationSettingsSettings {
+}
+exports.VariationSettingsSettings = VariationSettingsSettings;
+class VariationSettings {
+    constructor() {
+        this.settings = new VariationSettingsSettings();
+        this.loading = false;
+        this.loaded = new rxjs_1.BehaviorSubject(undefined);
+    }
+    copyFrom(settings) {
+        this.settings = settings.settings;
+        this.texture = settings.texture;
+        this.textureFilename = settings.textureFilename;
+        this.normal = settings.normal;
+        this.normalFilename = settings.normalFilename;
+        this.ao = settings.ao;
+        this.aoFilename = settings.aoFilename;
+        this.metalness = settings.metalness;
+        this.metalnessFilename = settings.metalnessFilename;
+        this.roughness = settings.roughness;
+        this.roughnessFilename = settings.roughnessFilename;
+        this.orm = settings.orm;
+        this.ormFilename = settings.ormFilename;
+        this.displacement = settings.displacement;
+        this.displacementValue = settings.displacementValue;
+        this.displacementFilename = settings.displacementFilename;
+        this.sheen = settings.sheen;
+        this.sheenColor = settings.sheenColor;
+        this.sheenColorMap = settings.sheenColorMap;
+        this.sheenColorMapFilename = settings.sheenColorMapFilename;
+        this.transmissionMap = settings.transmissionMap;
+        this.transmissionMapFilename = settings.transmissionMapFilename;
+        this.sheenRoughness = settings.sheenRoughness;
+        this.sheenRoughnessMap = settings.sheenRoughnessMap;
+        this.sheenRoughnessMapFilename = settings.sheenRoughnessMapFilename;
+        this.emissive = settings.emissive;
+        this.emissiveFilename = settings.emissiveFilename;
+        this.emissiveIntensity = settings.emissiveIntensity;
+        this.emissiveValue = settings.emissiveValue;
+        this.opacity = settings.opacity;
+        this.transparent = settings.transparent;
+        this.envMap = settings.envMap;
+        this.envMapFilename = settings.envMapFilename;
+        this.envMapIntensity = settings.envMapIntensity;
+        this.reflectivity = settings.reflectivity;
+        this.side = settings.side;
+        this.transmission = settings.transmission;
+        this.ior = settings.ior;
+        this.thickness = settings.thickness;
+        this.specularIntensity = settings.specularIntensity;
+        this.material = settings.material;
+    }
+}
+exports.VariationSettings = VariationSettings;
+
+
+/***/ }),
+
+/***/ 33009:
+/*!********************************!*\
+  !*** ./src/model/variation.ts ***!
+  \********************************/
+/***/ ((__unused_webpack_module, exports) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.Variation = void 0;
+class Variation {
+}
+exports.Variation = Variation;
+
+
+/***/ }),
+
+/***/ 27743:
+/*!**********************************!*\
+  !*** ./src/utils/asset.utils.ts ***!
+  \**********************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.AssetUtils = exports.FurnitureMaterial = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const material_1 = __webpack_require__(/*! ../model/material */ 68497);
+const image_utils_1 = __webpack_require__(/*! ./image.utils */ 22700);
+const three_1 = __webpack_require__(/*! three */ 30712);
+class FurnitureMaterial extends material_1.Material {
+}
+exports.FurnitureMaterial = FurnitureMaterial;
+class AssetUtils {
+    static CreateMaterialFromAsset(asset) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const material = new material_1.Material();
+            try {
+                if (!asset) {
+                    return material;
+                }
+                if (asset.settings) {
+                    AssetUtils.setSettingsOfMaterial(material, asset.settings);
+                }
+                if (asset.texture) {
+                    material.texture = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_texture', asset.texture, material);
+                    material.texture.colorSpace = three_1.SRGBColorSpace;
+                    material.textureFilename = asset.textureFilename;
+                }
+                if (asset.normal) {
+                    material.normal = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_normal', asset.normal, material);
+                    material.normalFilename = asset.normalFilename;
+                }
+                if (asset.orm) {
+                    material.ao = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_orm', asset.orm, material);
+                    material.roughness = material.ao;
+                    material.metalness = material.ao;
+                    material.aoFilename = asset.ormFilename;
+                    material.roughnessFilename = asset.ormFilename;
+                    material.metalnessFilename = asset.ormFilename;
+                }
+                else {
+                    if (asset.ao) {
+                        material.ao = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_ao', asset.ao, material);
+                        material.aoFilename = asset.aoFilename;
+                    }
+                    if (asset.metalness) {
+                        material.metalness = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_metalness', asset.metalness, material);
+                        material.metalnessFilename = asset.metalnessFilename;
+                    }
+                    if (asset.roughness) {
+                        material.roughness = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_roughness', asset.roughness, material);
+                        material.roughnessFilename = asset.roughnessFilename;
+                    }
+                }
+                if (asset.displacement) {
+                    material.displacement = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_displacement', asset.displacement, material);
+                    material.displacementFilename = asset.displacementFilename;
+                }
+                if (asset.envMap) {
+                    material.envMap = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_env', asset.envMap, material, true);
+                    material.envMapFilename = asset.envMapFilename;
+                }
+                if (asset.sheenColorMap) {
+                    material.sheenColorMap = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_sheen_color', asset.sheenColorMap, material);
+                    material.sheenColorMapFileName = asset.sheenColorMapFilename;
+                }
+                if (asset.sheenRoughnessMap) {
+                    material.sheenRoughnessMap = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_sheen_roughness', asset.sheenRoughnessMap, material);
+                    material.sheenRoughnessMapFileName = asset.sheenRoughnessMapFilename;
+                }
+                if (asset.transmissionMap) {
+                    material.transmissionMap = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_transmission', asset.transmissionMap, material);
+                    material.transmissionMapFileName = asset.transmissionMapFilename;
+                }
+                if (asset.emissive) {
+                    material.emissive = yield image_utils_1.ImageUtils.CreateTextureFromBase64(asset.id + '_emissive', asset.emissive, material);
+                    material.emissiveFileName = asset.emissiveFilename;
+                }
+                material.sheen = asset.sheen;
+                material.emissiveIntensityValue = asset.emissiveIntensity;
+                material.emissiveValue = asset.emissiveValue;
+                material.side = asset.side;
+                material.sheenColor = asset.sheenColor;
+                material.sheenRoughness = asset.sheenRoughness;
+                material.opacity = asset.opacity;
+                material.transparent = asset.transparent;
+                material.envMapIntensity = asset.envMapIntensity;
+                material.reflectivity = asset.reflectivity;
+                material.displacementValue = asset.displacementValue;
+                material.transmission = asset.transmission;
+                material.ior = asset.ior;
+                material.thickness = asset.thickness;
+                material.specularIntensity = asset.specularIntensity;
+            }
+            catch (e) {
+                console.error(e);
+            }
+            return material;
+        });
+    }
+    static setSettingsOfMaterial(material, settings) {
+        const shininess = parseFloat(settings['power']);
+        if (!isNaN(shininess)) {
+            material.shininess = shininess;
+            // material.roughness = 1 - (shininess / 100);
+        }
+        const level = parseFloat(settings['level']);
+        if (!isNaN(level)) {
+            material.specular = new three_1.Color(level, level, level);
+        }
+        const repeatObjectUsed = settings.hasOwnProperty('repeat');
+        const repeatx = repeatObjectUsed ? parseFloat(settings['repeat']['repeatx']) : parseFloat(settings['repeatx']);
+        if (!isNaN(repeatx)) {
+            material.repeatX = repeatx;
+        }
+        const repeaty = repeatObjectUsed ? parseFloat(settings['repeat']['repeaty']) : parseFloat(settings['repeaty']);
+        if (!isNaN(repeaty)) {
+            material.repeatY = repeaty;
+        }
+        const metalness = parseFloat(settings['metalness']);
+        if (!isNaN(metalness)) {
+            material.metalnessValue = Math.min(1, metalness);
+        }
+        const roughness = parseFloat(settings['roughness']);
+        if (!isNaN(roughness)) {
+            material.roughnessValue = Math.min(1, roughness);
+        }
+    }
+}
+exports.AssetUtils = AssetUtils;
+
+
+/***/ }),
+
+/***/ 22700:
+/*!**********************************!*\
+  !*** ./src/utils/image.utils.ts ***!
+  \**********************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.ImageUtils = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const THREE = tslib_1.__importStar(__webpack_require__(/*! three */ 30712));
+// @dynamic
+class ImageUtils {
+    static CreateTextureFromBase64(id, base64, material, defaultFlip = false) {
+        return new Promise((resolve) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (ImageUtils.textures.has(id)) {
+                resolve(ImageUtils.textures.get(id));
+            }
+            else {
+                if (!base64) {
+                    resolve(new THREE.Texture());
+                }
+                else {
+                    if (window.hasOwnProperty('textureLoader')) {
+                        resolve(yield window.textureLoader(base64));
+                    }
+                    else {
+                        const loader = new THREE.TextureLoader();
+                        loader.load(base64, (texture) => {
+                            texture.anisotropy = 16;
+                            texture.wrapS = THREE.RepeatWrapping;
+                            texture.wrapT = THREE.RepeatWrapping;
+                            texture.repeat = new THREE.Vector2(material ? material.repeatX : 1, material ? material.repeatY : 1);
+                            texture.flipY = defaultFlip;
+                            texture.needsUpdate = true;
+                            ImageUtils.textures.set(id, texture);
+                            resolve(texture);
+                        }, () => {
+                        }, () => {
+                            resolve(new THREE.Texture());
+                        });
+                    }
+                }
+            }
+        }));
+    }
+    static getDocBodyWithMimeTypeDefinition(fileName, documentBody) {
+        if (documentBody === null) {
+            return documentBody;
+        }
+        const fileExtension = fileName.substr(fileName.lastIndexOf('.') + 1);
+        switch (fileExtension.toLowerCase()) {
+            case 'jpg':
+            case 'jpeg':
+                return 'data:image/jpg;base64,' + documentBody;
+            case 'png':
+                return 'data:image/png;base64,' + documentBody;
+            case 'gif':
+                return 'data:image/gif;base64,' + documentBody;
+            case 'bmp':
+                return 'data:image/bmp;base64,' + documentBody;
+            default:
+                return 'data:image/png;base64,' + documentBody;
+        }
+    }
+    static getFixedImageFilepathUrl(imageFilepathUrl) {
+        return imageFilepathUrl.replace('/content/', '/content43/');
+    }
+    static ClearCache() {
+        ImageUtils.textures.forEach(value => {
+            value.dispose();
+        });
+        ImageUtils.textures.clear();
+    }
+}
+exports.ImageUtils = ImageUtils;
+ImageUtils.textures = new Map();
+
+
+/***/ }),
+
+/***/ 37922:
+/*!***********************************!*\
+  !*** ./src/utils/object.utils.ts ***!
+  \***********************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.ObjectUtils = void 0;
+const three_1 = __webpack_require__(/*! three */ 30712);
+class ObjectUtils {
+    static DisposeMaterial(material) {
+        if (!material) {
+            return;
+        }
+        if (Array.isArray(material)) {
+            material.forEach(mtrl => {
+                this.materialProps
+                    .filter(mapType => mtrl[mapType])
+                    .forEach(mapType => mtrl[mapType].dispose());
+                mtrl.dispose();
+            });
+        }
+        else {
+            this.materialProps
+                .filter(mapType => material[mapType] && material[mapType].dispose)
+                .forEach(mapType => material[mapType].dispose());
+            if (material.dispose) {
+                material.dispose();
+            }
+        }
+    }
+    static DisposeObject(object) {
+        if (!object) {
+            return;
+        }
+        if (object.children.length) {
+            object.children.forEach(child => this.DisposeObject(child));
+        }
+        this.DisposeNode(object);
+    }
+    static DisposeNode(node) {
+        node.traverse((obj) => {
+            if (obj instanceof three_1.Mesh) {
+                if (obj.geometry) {
+                    obj.geometry.dispose();
+                }
+                this.DisposeMaterial(obj.material);
+            }
+            if (typeof obj.dispose === 'function') {
+                // @ts-ignore
+                obj.dispose();
+            }
+        });
+    }
+}
+exports.ObjectUtils = ObjectUtils;
+ObjectUtils.materialProps = ['map', 'lightMap', 'bumpMap', 'normalMap', 'specularMap', 'envMap', 'aoMap', 'roughnessMap', 'metalnessMap'];
+
+
+/***/ }),
+
+/***/ 78606:
+/*!**********************************!*\
+  !*** ./src/utils/scene-utils.ts ***!
+  \**********************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.SceneUtils = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const THREE = tslib_1.__importStar(__webpack_require__(/*! three */ 30712));
+const selection_1 = __webpack_require__(/*! @colijnit/configuratorapi/build/model/selection */ 58427);
+class SceneUtils {
+    static TrySelectorConnection(scene, parent, part1, part2, isFirstElement, createAddableFn) {
+        let addable;
+        if (createAddableFn) {
+            addable = part2;
+            part2 = createAddableFn(addable);
+        }
+        if (part1 && part2) {
+            let con1;
+            let con2;
+            // if part2 is an addable and decoConnection is present, then no need to iterate through connectors
+            if (addable && addable instanceof selection_1.Selection && addable.decoConnection) {
+                con1 = part1.children.find(c => c.name === addable.decoConnection);
+                if (!con1) {
+                    return false;
+                }
+                for (let ii = 0; ii < part2.children.length; ii++) {
+                    con2 = part2.children[ii];
+                    // if these connectors can connect connect them
+                    if (!con1['connected'] && !con2['connected'] && this.CanSelectorConnect(part1.children, con1, con2, isFirstElement)) {
+                        // if addable, continue this loop with a new addable
+                        if (addable) {
+                            const newPart2 = createAddableFn(addable, part2, part1);
+                            // reference of part2 changed, so refresh con2
+                            this.SelectorConnect(scene, parent, con1, newPart2.children[ii]);
+                        }
+                        else {
+                            return this.SelectorConnect(scene, parent, con1, con2);
+                        }
+                    }
+                }
+            }
+            else {
+                for (let i = 0; i < part1.children.length; i++) {
+                    for (let ii = 0; ii < part2.children.length; ii++) {
+                        con1 = part1.children[i];
+                        con2 = part2.children[ii];
+                        // if these connectors can connect connect them
+                        if (!con1['connected'] && !con2['connected'] && this.CanSelectorConnect(part1.children, con1, con2, isFirstElement)) {
+                            // if addable, continue this loop with a new addable
+                            if (addable) {
+                                const newPart2 = createAddableFn(addable, part2, part1);
+                                // reference of part2 changed, so refresh con2
+                                this.SelectorConnect(scene, parent, con1, newPart2.children[ii]);
+                            }
+                            else {
+                                return this.SelectorConnect(scene, parent, con1, con2);
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        return false;
+    }
+    // public static TrySelectorConnection(scene: THREE.Scene, parent: THREE.Object3D,
+    //     part1: any, part2: any, createAddableFn?: Function): boolean {
+    //     let addable: any;
+    //     if (createAddableFn) {
+    //         addable = part2;
+    //         part2 = createAddableFn(addable);
+    //     }
+    //     for (let i = 0; i < part1.children.length; i++) {
+    //         for (let ii = 0; ii < part2.children.length; ii++) {
+    //             const con1: THREE.Object3D = part1.children[i];
+    //             const con2: THREE.Object3D = part2.children[ii];
+    //             // if these connectors can connect connect them
+    //             if (!con1['connected'] && !con2['connected'] && this.CanSelectorConnect(con1, con2)) {
+    //                 // if addable, continue this loop with a new addable
+    //                 if (addable) {
+    //                     const newPart2: THREE.Object3D = createAddableFn(addable, part2, part1);
+    //                     // reference of part2 changed, so refresh con2
+    //                     this.SelectorConnect(scene, parent, con1, newPart2.children[ii]);
+    //                 } else {
+    //                     return this.SelectorConnect(scene, parent, con1, con2);
+    //                 }
+    //             }
+    //         }
+    //     }
+    //     return false;
+    // }
+    static Convert3DPointToScreenPoint(point, camera, width, height) {
+        if (!point) {
+            return new THREE.Vector2();
+        }
+        const vector = point.clone().project(camera);
+        vector.x = (vector.x + 1) / 2 * width;
+        vector.y = -(vector.y - 1) / 2 * height;
+        return new THREE.Vector2(vector.x, vector.y);
+    }
+    static CanSelectorConnect(consPart1, con1, con2, startWithMale) {
+        const con1Name = (con1.constructor.name === 'Mesh' || con1.constructor.name === 'Object3D') ? con1.name : con1.connector;
+        const con2Name = (con2.constructor.name === 'Mesh' || con2.constructor.name === 'Object3D') ? con2.name : con2.connector;
+        const sameParent = (con1.constructor.name === 'Mesh' || con1.constructor.name === 'Object3D') &&
+            (con2.constructor.name === 'Mesh' || con2.constructor.name === 'Object3D') ? con1.parent === con2.parent : false;
+        const parts1 = con1Name.toUpperCase().split('_'), parts2 = con2Name.toUpperCase().split('_');
+        if (parts1.length >= 3 && parts2.length >= 3 && !sameParent) {
+            const connectable = parts1[0] === 'C' && parts2[0] === 'C' &&
+                parts1[1] === parts2[1] && parts1[2] !== parts2[2];
+            return connectable;
+        }
+        return false;
+    }
+    // public static CanSelectorConnect(con1: THREE.Object3D | any, con2: THREE.Object3D | any): boolean {
+    //     const con1Name: string = con1 instanceof THREE.Object3D ? con1.name : con1.connector;
+    //     const con2Name: string = con2 instanceof THREE.Object3D ? con2.name : con2.connector;
+    //     const sameParent: boolean = con1 instanceof THREE.Object3D && con2 instanceof THREE.Object3D ? con1.parent === con2.parent : false;
+    //     const parts1: string[] = con1Name.toUpperCase().split('_'),
+    //         parts2: string[] = con2Name.toUpperCase().split('_');
+    //     if (parts1.length >= 3 && parts2.length >= 3 && !sameParent) {
+    //         const connectable: boolean = parts1[0] === 'C' && parts2[0] === 'C' &&
+    //             parts1[1] === parts2[1] && parts1[2] !== parts2[2];
+    //         return connectable;
+    //     }
+    //     return false;
+    // }
+    static SelectorConnect(scene, parent, con1, con2) {
+        if (!scene || !parent) {
+            return false;
+        }
+        con1['connectedTo'] = con2.parent.name;
+        con2['connectedTo'] = con1.parent.name;
+        const motherRotation = new THREE.Euler(0, 0, 0);
+        const motherPosition = new THREE.Vector3(0, 0, 0);
+        parent.updateMatrixWorld();
+        motherRotation.copy(parent.rotation);
+        parent.getWorldPosition(motherPosition);
+        parent.rotation.set(0, 0, 0);
+        parent.position.set(0, 0, 0);
+        scene.updateMatrixWorld(true);
+        const con1Quat = new THREE.Quaternion();
+        con1.getWorldQuaternion(con1Quat);
+        const con2Quat = new THREE.Quaternion();
+        con2.getWorldQuaternion(con2Quat);
+        const con1QuatParent = new THREE.Quaternion();
+        con1.parent.getWorldQuaternion(con1QuatParent);
+        const con2QuatParent = new THREE.Quaternion();
+        con2.parent.getWorldQuaternion(con2QuatParent);
+        const rotation = new THREE.Quaternion().multiplyQuaternions(con1Quat.invert(), con2Quat).multiply(new THREE.Quaternion().multiplyQuaternions(con1QuatParent, con1QuatParent));
+        con2.parent.quaternion.copy(rotation);
+        // Update because the matrix has been tempered with
+        scene.updateMatrixWorld(true);
+        // Move the connectors towards eachother
+        const con1Pos = new THREE.Vector3();
+        con1.getWorldPosition(con1Pos);
+        const con2Pos = new THREE.Vector3();
+        con2.getWorldPosition(con2Pos);
+        const move = con1Pos.sub(con2Pos);
+        con2.parent.position.x += move.x;
+        con2.parent.position.y += move.y;
+        con2.parent.position.z += move.z;
+        // reset parent's objects rotation and position
+        parent.rotation.copy(motherRotation);
+        parent.position.copy(motherPosition);
+        scene.updateMatrixWorld(true);
+        // Set the connected flag
+        con1['connected'] = true;
+        con2['connected'] = true;
+        return true;
+    }
+}
+exports.SceneUtils = SceneUtils;
+
+
+/***/ }),
+
+/***/ 22674:
+/*!***********************************!*\
+  !*** ./src/utils/threed.utils.ts ***!
+  \***********************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.ThreedUtils = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const THREE = tslib_1.__importStar(__webpack_require__(/*! three */ 30712));
+const object_utils_1 = __webpack_require__(/*! ./object.utils */ 37922);
+class ThreedUtils {
+    constructor() {
+        this._objectCache = new Map();
+    }
+    clearCache() {
+        const objs = Array.from(this._objectCache.values());
+        objs.forEach(o => object_utils_1.ObjectUtils.DisposeObject(o));
+        this._objectCache.clear();
+    }
+    download3DSource(fileName, assetPath) {
+        return new Promise((resolve, reject) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+            fileName = fileName.replace('.unity3d', '');
+            let lookupFileName = fileName + (fileName.indexOf('.glb') < 0 ? '.glb' : '');
+            if (this._objectCache.has(lookupFileName)) {
+                resolve(this._objectCache.get(lookupFileName));
+                return;
+            }
+            this.loadGlbSource(lookupFileName)
+                .then((obj) => {
+                this._objectCache.set(lookupFileName, obj);
+                resolve(obj);
+            })
+                .catch(() => {
+                reject(`GLB source not found! (${lookupFileName})`);
+            });
+        }));
+    }
+    readFileAsText(file) {
+        const fileReader = new FileReader();
+        return new Promise((resolve, reject) => {
+            fileReader.onload = (e) => resolve(e.target.result);
+            fileReader.onerror = error => reject(error);
+            fileReader.readAsText(file);
+        });
+    }
+    loadJsonModel(filePath) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (this._objectCache.has(filePath)) {
+                return Promise.resolve(this._objectCache.get(filePath));
+            }
+            const json = yield this._readJsonFile(filePath);
+            const loader = new THREE.ObjectLoader();
+            loader.crossOrigin = 'Anonymous';
+            return new Promise((resolve, reject) => {
+                try {
+                    const obj = loader.parse(json);
+                    this._objectCache.set(filePath, obj);
+                    resolve(obj);
+                }
+                catch (e) {
+                    reject(null);
+                }
+            });
+        });
+    }
+    loadJsonObjectModel(filePath) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (this._objectCache.has(filePath)) {
+                return Promise.resolve(this._objectCache.get(filePath));
+            }
+            const loader = new THREE.ObjectLoader();
+            loader.setCrossOrigin('Anonymous');
+            loader.setResourcePath('');
+            return new Promise((resolve, reject) => {
+                loader.load(filePath, (object) => {
+                    const obj = (object.type === 'Scene' && object.children[0].type === 'Object3D') ? object.children[0] : object;
+                    this._objectCache.set(filePath, obj);
+                    resolve(obj);
+                }, xhr => null, error => reject(error));
+            });
+        });
+    }
+    loadGlbModel(file, cleanUp = true) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (this._objectCache.has(file)) {
+                return Promise.resolve(this._objectCache.get(file));
+            }
+            if (!window.hasOwnProperty('loadGLTF')) {
+                console.error('loadGLTF not defined in window global');
+                return null;
+            }
+            // const loader = new GLTFLoader();
+            const obj = yield window.loadGLTF(file);
+            if (obj) {
+                this._cleanedUpObjects(obj, cleanUp);
+                this._objectCache.set(file, obj);
+                return obj;
+            }
+            else {
+                return null;
+            }
+        });
+    }
+    loadGlbSource(file) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const obj = yield this.loadGlbModel(file, false);
+            if (obj) {
+                obj.children = obj.children.filter(c => !(c instanceof THREE.Camera));
+                obj.children.sort((a, b) => a['name'] < b['name'] ? 1 : -1);
+                obj.children.forEach((c) => {
+                    c.traverse((t) => {
+                        t.visible = !t.name.toLowerCase().startsWith('c_');
+                    });
+                    c.visible = false;
+                });
+                if (obj.children.length === 1 && obj.children[0] instanceof THREE.Group) { // flatten children
+                    const children = obj.children[0].children.slice();
+                    const name = obj.children[0].name;
+                    obj.children.length = 0;
+                    const parent = new THREE.Object3D();
+                    parent.name = name;
+                    parent.children = children;
+                    obj.add(parent);
+                }
+            }
+            return obj;
+        });
+    }
+    textureFromUrl(url) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            // url = this._includeBaseUrl(url);
+            return new Promise((resolve, reject) => {
+                const textureLoader = new THREE.TextureLoader();
+                // textureLoader.setBaseU(this._settingsService.settings.assetPath);
+                textureLoader.load(url, (texture) => {
+                    texture.wrapT = THREE.RepeatWrapping;
+                    texture.wrapS = THREE.RepeatWrapping;
+                    texture.repeat.set(1, 1);
+                    texture.needsUpdate = true;
+                    return resolve(texture);
+                }, null, reject);
+            });
+        });
+    }
+    _cleanedUpObjects(object, cleanUp = true) {
+        let obj = new THREE.Object3D();
+        object.children.forEach((c) => {
+            if (!(c instanceof THREE.Camera)) {
+                if (cleanUp && c instanceof THREE.Group || (c.children.length === 1 && c.children[0] instanceof THREE.Group)) {
+                    this._addGroupChildrenToObject(c, obj);
+                }
+                else if ((cleanUp && !(c instanceof THREE.Mesh)) || (!(c instanceof THREE.Mesh) && !c.name && c.children.length > 0)) {
+                    c.children.forEach((child) => {
+                        child.translateY(c.position.y);
+                    });
+                    c.translateY(-c.position.y);
+                    if (obj.children.length > 0) {
+                        obj.add(c.clone());
+                    }
+                    else {
+                        obj = c.clone();
+                    }
+                }
+                else {
+                    // if (c.position.y > 0 || c.position.y < 0) {
+                    //   c.children.forEach((child) => {
+                    //     child.translateY(c.position.y);
+                    //   });
+                    //   c.translateY(-c.position.y);
+                    // }
+                    obj.add(c.clone());
+                }
+            }
+        });
+        const boundingBox = new THREE.Box3().setFromObject(obj);
+        const bbCenterPivot = new THREE.Vector3();
+        boundingBox.getCenter(bbCenterPivot);
+        const delta = new THREE.Vector3().add(bbCenterPivot).negate();
+        obj.children.forEach((cc) => {
+            cc.position.add(delta);
+        });
+        return obj;
+    }
+    _addGroupChildrenToObject(group, obj, cleanUp = true) {
+        group.children.forEach((gc) => {
+            if (cleanUp && gc instanceof THREE.Group) {
+                this._addGroupChildrenToObject(gc, obj);
+            }
+            else {
+                // gc.translateX(-group.position.x);
+                gc.translateY(group.position.y);
+                // gc.translateZ(-group.position.z);
+                obj.add(gc.clone());
+            }
+        });
+    }
+    _iterateChildren(children, callback) {
+        for (let i = 0; i < children.length; i++) {
+            const child = children[i];
+            if (child instanceof THREE.Mesh) {
+                callback(child);
+            }
+            else {
+                this._iterateChildren(child.children, callback);
+            }
+        }
+    }
+    _readJsonFile(filePath) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            try {
+                const response = yield fetch(filePath);
+                if (!response.ok) {
+                    return '';
+                }
+                else {
+                    let empty = false;
+                    yield response.clone().text().then((value) => {
+                        if (value === '') {
+                            empty = true;
+                        }
+                    });
+                    return empty ? {} : response.json();
+                }
+            }
+            catch (e) {
+                return '';
+            }
+        });
+    }
+}
+exports.ThreedUtils = ThreedUtils;
+
+
+/***/ }),
+
+/***/ 4876:
+/*!**************************************!*\
+  !*** ./src/utils/variation-utils.ts ***!
+  \**************************************/
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.VariationUtils = void 0;
+const tslib_1 = __webpack_require__(/*! tslib */ 42321);
+const variation_settings_1 = __webpack_require__(/*! ../model/variation-settings */ 95664);
+// @ts-ignore
+const jszip_1 = tslib_1.__importDefault(__webpack_require__(/*! jszip */ 17284));
+const three_1 = __webpack_require__(/*! three */ 30712);
+// @dynamic
+class VariationUtils {
+    static ClearCache() {
+        this.MaterialCache.clear();
+    }
+    static LoadVariation(assetPath, fileName) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!fileName) {
+                return null;
+            }
+            if (!fileName.includes('ione3d')) {
+                fileName = fileName.concat('.ione3d');
+            }
+            const id = fileName.substring(0, fileName.lastIndexOf('.ione3d'));
+            if (!assetPath.endsWith('/')) {
+                assetPath += '/';
+            }
+            if (!window.hasOwnProperty('downloadVariation')) {
+                console.error('downloadVariation not defined in window global');
+                throw new Error('downloadVariation not defined in window global');
+            }
+            if (this.MaterialCache.has(id)) {
+                return this.MaterialCache.get(id);
+            }
+            try {
+                const file = yield window.downloadVariation(`${assetPath.replace('https://cdn1.colijn-it.nl/', '')}variation/${fileName}`);
+                const settings = yield VariationUtils.GetVariationSettingsFromFile(id, file);
+                this.MaterialCache.set(id, settings);
+                return settings;
+            }
+            catch (err) {
+                console.error('Error loading variation:', err);
+                throw err;
+            }
+        });
+    }
+    // public static GetMaterialFromName(variationFolder: string, material: any): Promise<MeshStandardMaterial> {
+    //   return new Promise((resolve: Function) => {
+    //     if (!material) {
+    //       resolve(null);
+    //     }
+    //     if (this.MaterialCache.has(material.name)) {
+    //       resolve(this.MaterialCache.get(material.name).clone());
+    //     } else {
+    //       VariationUtils.LoadVariation(variationFolder, material.name, false).then((settings: VariationSettings) => {
+    //         if (settings) {
+    //           AssetUtils.CreateMaterialFromAsset(settings).then((materialObj: Material) => {
+    //             const materialParams: MeshStandardMaterialParameters = {};
+    //             materialParams.name = material.name;
+    //             materialParams.map = materialObj.texture;
+    //             materialParams.normalMap = materialObj.normal;
+    //             materialParams.aoMap = materialObj.ao;
+    //             materialParams.roughnessMap = materialObj.roughness;
+    //             materialParams.metalnessMap = materialObj.metalness;
+    //             materialParams.roughness = 1;
+    //             materialParams.metalness = 1;
+    //             const pbrMat: MeshStandardMaterial = new MeshStandardMaterial(materialParams);
+    //             this.MaterialCache.set(material.name, pbrMat);
+    //             resolve(pbrMat.clone());
+    //           });
+    //         } else {
+    //           resolve(material);
+    //         }
+    //       });
+    //     }
+    //   });
+    // }
+    static GetVariationSettingsFromFile(id, compressedFile) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!compressedFile) {
+                return null;
+            }
+            const zipContent = yield VariationUtils.GetZipContent(compressedFile);
+            const variationSettings = new variation_settings_1.VariationSettings();
+            let index;
+            variationSettings.id = id;
+            if (zipContent) {
+                if (zipContent.files['material.glb']) {
+                    const material = yield zipContent.files['material.glb'].async('arraybuffer');
+                    variationSettings.material = yield VariationUtils.LoadMaterialFromGlb(material);
+                }
+                else {
+                    if (zipContent.files['index.json']) {
+                        const indexFile = yield zipContent.files['index.json'].async('string');
+                        index = JSON.parse(indexFile);
+                    }
+                    if (index) {
+                        yield VariationUtils.CreateSettingsBasedOnIndex(index, variationSettings, zipContent);
+                    }
+                    else {
+                        yield VariationUtils.CreateSettingsBasedOnFileName(variationSettings, zipContent);
+                    }
+                }
+            }
+            return variationSettings;
+        });
+    }
+    static CreateSettingsBasedOnIndex(index, variationSettings, zipContent) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (index.normalFile) {
+                variationSettings.normal = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.normalFile], index.normalFile);
+                variationSettings.normalFilename = index.normalFile;
+            }
+            if (index.diffuseFile) {
+                variationSettings.texture = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.diffuseFile], index.diffuseFile);
+                variationSettings.textureFilename = index.diffuseFile;
+            }
+            if (index.ormFile) {
+                variationSettings.orm = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.ormFile], index.ormFile);
+                variationSettings.ormFilename = index.ormFile;
+            }
+            else {
+                if (index.aoFile) {
+                    variationSettings.ao = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.aoFile], index.aoFile);
+                    variationSettings.aoFilename = index.aoFile;
+                }
+                if (index.metalnessFile) {
+                    variationSettings.metalness = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.metalnessFile], index.metalnessFile);
+                    variationSettings.metalnessFilename = index.metalnessFile;
+                }
+                if (index.roughnessFile) {
+                    variationSettings.roughness = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.roughnessFile], index.roughnessFile);
+                    variationSettings.roughnessFilename = index.roughnessFile;
+                }
+            }
+            if (index.displacementFile) {
+                variationSettings.displacement = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.displacementFile], index.displacementFile);
+                variationSettings.displacementFilename = index.displacementFile;
+            }
+            if (index.emissiveFile) {
+                variationSettings.emissive = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.emissiveFile], index.emissiveFile);
+                variationSettings.emissiveFilename = index.emissiveFile;
+            }
+            if (index.envMapFile) {
+                variationSettings.envMap = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.envMapFile], index.envMapFile);
+                variationSettings.envMapFilename = index.envMapFile;
+            }
+            if (index.sheenColorMapFile) {
+                variationSettings.sheenColorMap = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.sheenColorMapFile], index.sheenColorMapFile);
+                variationSettings.sheenColorMapFilename = index.sheenColorMapFile;
+            }
+            if (index.sheenRoughnessMapFile) {
+                variationSettings.sheenRoughnessMap = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.sheenRoughnessMapFile], index.sheenRoughnessMapFile);
+                variationSettings.sheenRoughnessMapFilename = index.sheenColorMapFile;
+            }
+            if (index.transmissionMapFile) {
+                variationSettings.transmissionMap = yield VariationUtils.LoadFileContentFromZip(zipContent.files[index.transmissionMapFile], index.transmissionMapFile);
+                variationSettings.transmissionMapFilename = index.transmissionMapFile;
+            }
+            if (index.repeat) {
+                variationSettings.settings.repeatx = index.repeat.repeatx;
+                variationSettings.settings.repeaty = index.repeat.repeaty;
+            }
+            variationSettings.settings.metalness = index.metalness;
+            variationSettings.settings.roughness = index.roughness;
+            if (index.sheen && typeof index.sheen === 'object') {
+                variationSettings.sheen = 1;
+                variationSettings.sheenColor = new three_1.Color(index.sheen.r, index.sheen.g, index.sheen.b).getHexString(three_1.SRGBColorSpace);
+            }
+            else {
+                variationSettings.sheen = index.sheen;
+            }
+            if (index.sheenColor) {
+                variationSettings.sheenColor = new three_1.Color(index.sheenColor.r, index.sheenColor.g, index.sheenColor.b).getHexString(three_1.SRGBColorSpace);
+            }
+            variationSettings.sheenRoughness = index.sheenRoughness;
+            variationSettings.envMapIntensity = index.envMapIntensity;
+            variationSettings.transparent = index.transparent;
+            variationSettings.opacity = index.opacity;
+            if (index.emissiveValue) {
+                variationSettings.emissiveValue = new three_1.Color(index.emissiveValue.r, index.emissiveValue.g, index.emissiveValue.b).getHexString(three_1.SRGBColorSpace);
+            }
+            variationSettings.emissiveIntensity = index.emissiveIntensity;
+            variationSettings.reflectivity = index.reflectivity;
+            variationSettings.displacementValue = index.displacementValue;
+            variationSettings.side = index.side;
+            variationSettings.transmission = index.transmission;
+            variationSettings.ior = index.ior;
+            variationSettings.thickness = index.thickness;
+            variationSettings.specularIntensity = index.specularIntensity;
+        });
+    }
+    static CreateSettingsBasedOnFileName(variationSettings, zipContent) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            const allLoaded = [];
+            for (const fileName in zipContent.files) {
+                if (zipContent.files.hasOwnProperty(fileName)) {
+                    const file = yield zipContent.files[fileName];
+                    if (file.name.toLowerCase().indexOf('normal') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((normalFile) => {
+                            variationSettings.normal = `data:image/${this.GetBase64FileType(file.name)};base64,${normalFile}`;
+                            variationSettings.normalFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('ao') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((aoFile) => {
+                            variationSettings.ao = `data:image/${this.GetBase64FileType(file.name)};base64,${aoFile}`;
+                            variationSettings.aoFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('metalness') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((metalnessFile) => {
+                            variationSettings.metalness = `data:image/${this.GetBase64FileType(file.name)};base64,${metalnessFile}`;
+                            variationSettings.metalnessFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('roughness') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((roughnessFile) => {
+                            variationSettings.roughness = `data:image/${this.GetBase64FileType(file.name)};base64,${roughnessFile}`;
+                            variationSettings.roughnessFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('diffuse') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((diffuseFile) => {
+                            variationSettings.texture = `data:image/${this.GetBase64FileType(file.name)};base64,${diffuseFile}`;
+                            variationSettings.textureFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('displacement') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((displacementFile) => {
+                            variationSettings.displacement = `data:image/${this.GetBase64FileType(file.name)};base64,${displacementFile}`;
+                            variationSettings.displacementFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('emissive') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((emissiveFile) => {
+                            variationSettings.emissive = `data:image/${this.GetBase64FileType(file.name)};base64,${emissiveFile}`;
+                            variationSettings.emissiveFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('envMap') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((envMapFile) => {
+                            variationSettings.envMap = `data:image/${this.GetBase64FileType(file.name)};base64,${envMapFile}`;
+                            variationSettings.envMapFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('sheenColorMap') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((sheenColorMapFile) => {
+                            variationSettings.sheenColorMap = `data:image/${this.GetBase64FileType(file.name)};base64,${sheenColorMapFile}`;
+                            variationSettings.sheenColorMapFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('sheenRoughnessMap') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((sheenRoughnessMapFile) => {
+                            variationSettings.sheenRoughnessMap = `data:image/${this.GetBase64FileType(file.name)};base64,${sheenRoughnessMapFile}`;
+                            variationSettings.sheenRoughnessMapFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.toLowerCase().indexOf('transmissionMap') > -1 && this.FileIsImage(file.name)) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((transmissionMapFile) => {
+                            variationSettings.transmissionMap = `data:image/${this.GetBase64FileType(file.name)};base64,${transmissionMapFile}`;
+                            variationSettings.transmissionMapFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.indexOf('.jp') > -1) {
+                        allLoaded.push(zipContent.files[fileName].async('base64').then((textureFile) => {
+                            variationSettings.texture = 'data:image/jpeg;base64,' + textureFile;
+                            variationSettings.textureFilename = fileName;
+                        }));
+                    }
+                    else if (file.name.indexOf('.json') > -1) {
+                        allLoaded.push(zipContent.files[fileName].async('string').then((settingsFile) => {
+                            const settingsFileObj = JSON.parse(settingsFile);
+                            for (const key in settingsFileObj) {
+                                if (settingsFileObj.hasOwnProperty(key)) {
+                                    variationSettings.settings[key] = settingsFileObj[key];
+                                }
+                            }
+                        }));
+                    }
+                }
+            }
+            yield Promise.all(allLoaded);
+        });
+    }
+    static LoadMaterialFromJson(material) {
+        const loader = new three_1.MaterialLoader();
+        if (material.textures) {
+            const textures = {};
+            for (let i = 0; i < material.textures.length; i++) {
+                textures[material.textures[i].uuid] = material.textures[i];
+            }
+            loader.setTextures(textures);
+        }
+        return loader.parse(material);
+    }
+    static LoadMaterialFromGlb(material) {
+        return new Promise((resolve, reject) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+            if (!window.hasOwnProperty('loadGLTF')) {
+                console.error('loadGLTF not defined in window global');
+                return reject();
+            }
+            const obj = yield window.loadGLTF(material, false);
+            if (obj) {
+                return resolve(obj.children[0].material);
+            }
+        }));
+    }
+    static LoadFileContentFromZip(zip, fileName, base64 = true) {
+        return new Promise((resolve) => {
+            if (zip && fileName) {
+                zip.async(base64 ? 'base64' : 'string').then((fileContent) => {
+                    if (base64) {
+                        resolve(`data:image/${this.GetBase64FileType(fileName)};base64,${fileContent}`);
+                    }
+                    else {
+                        resolve(fileContent);
+                    }
+                });
+            }
+            else {
+                resolve(undefined);
+            }
+        });
+    }
+    static FileIsImage(fileName) {
+        const ext = fileName.substring(fileName.lastIndexOf('.') + 1, fileName.length).toLowerCase();
+        switch (ext) {
+            case 'jpg':
+            case 'jpeg':
+            case 'png':
+            case 'bmp':
+                return true;
+            default:
+                return false;
+        }
+    }
+    static GetBase64FileType(fileName) {
+        const ext = fileName.substring(fileName.lastIndexOf('.') + 1, fileName.length).toLowerCase();
+        switch (ext) {
+            case 'jpg':
+            case 'jpeg':
+                return 'jpeg';
+            case 'png':
+                return 'png';
+            case 'bmp':
+                return 'bmp';
+            default:
+                return 'jpeg';
+        }
+    }
+    // Get the content
+    static GetZipContent(file) {
+        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+            try {
+                const jszip = new jszip_1.default();
+                return yield jszip.loadAsync(file);
+            }
+            catch (e) {
+                return null;
+            }
+        });
+    }
+}
+exports.VariationUtils = VariationUtils;
+VariationUtils.MaterialCache = new Map();
+
+
+/***/ })
+
+},
+/******/ __webpack_require__ => { // webpackRuntimeModules
+/******/ var __webpack_exec__ = (moduleId) => (__webpack_require__(__webpack_require__.s = moduleId))
+/******/ __webpack_require__.O(0, ["vendor"], () => (__webpack_exec__(14431)));
+/******/ var __webpack_exports__ = __webpack_require__.O();
+/******/ }
+]);
+//# sourceMappingURL=main.js.map