kitchen-simulator 4.3.9 → 4.4.1

package/es/utils/isolate-event-handler.js

@@ -17,6 +17,7 @@ import { SVGLoader } from 'three/addons/loaders/SVGLoader';
 import { getMoldingDataOfScene2 } from "./molding";
 import { Scene, State } from "../models";
 import { calcDistancesFromHoleToNearestOneOrWall } from "./geometry";
+import { computeSkinPanels } from "./skinPanelEngine";
 var PRECISION = 2;
 
 // ---- compatibility: supports old + optimized props shapes ----
@@ -39,7 +40,7 @@ var __svgCache = new Map(); // url -> Promise<svgData|null>
 function loadJSON(_x) {
   return _loadJSON.apply(this, arguments);
 }
-/********Parse TempPlaceholder from cabinetPayloadData **************/
+/***** Update cabinetPayloadData with updatedTempPlaceholders *****/
 function _loadJSON() {
   _loadJSON = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(path) {
     var p;
@@ -78,407 +79,27 @@ function _loadJSON() {
   }));
   return _loadJSON.apply(this, arguments);
 }
-function parseTempPlaceholdersFromCabinetPayload(_x2) {
-  return _parseTempPlaceholdersFromCabinetPayload.apply(this, arguments);
-}
-/***** Update cabinetPayloadData with updatedTempPlaceholders *****/
-function _parseTempPlaceholdersFromCabinetPayload() {
-  _parseTempPlaceholdersFromCabinetPayload = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(cabinetPayload) {
-    var link, keys, temp, i, _cabinetPayload$struc, _cabinetPayload$struc2, tempPlaceholdersData, _loop3, tempData, doorKey, drawerKey, fixedKey, doorPHs, drawerPHs, has_single_door, fixedPHs, k, _cabinetPayload$struc3, _t2, _t3, _t4;
-    return _regeneratorRuntime.wrap(function (_context5) {
-      while (1) switch (_context5.prev = _context5.next) {
-        case 0:
-          link = '';
-          keys = Object.keys(cabinetPayload.structure_json);
-          temp = [];
-          i = 0;
-        case 1:
-          if (!(i < keys.length)) {
-            _context5.next = 4;
-            break;
-          }
-          if (!((_cabinetPayload$struc = cabinetPayload.structure_json[keys[i]]) !== null && _cabinetPayload$struc !== void 0 && (_cabinetPayload$struc = _cabinetPayload$struc.toString()) !== null && _cabinetPayload$struc !== void 0 && _cabinetPayload$struc.includes('.gltf') && (_cabinetPayload$struc2 = cabinetPayload.structure_json[keys[i]]) !== null && _cabinetPayload$struc2 !== void 0 && (_cabinetPayload$struc2 = _cabinetPayload$struc2.toString()) !== null && _cabinetPayload$struc2 !== void 0 && _cabinetPayload$struc2.startsWith('http'))) {
-            _context5.next = 3;
-            break;
-          }
-          link = cabinetPayload.structure_json[keys[i]];
-          _t2 = temp;
-          _t3 = keys[i];
-          _context5.next = 2;
-          return loadJSON(link);
-        case 2:
-          _t4 = _context5.sent;
-          _t2.push.call(_t2, {
-            name: _t3,
-            data: _t4
-          });
-        case 3:
-          i++;
-          _context5.next = 1;
-          break;
-        case 4:
-          tempPlaceholdersData = [];
-          _loop3 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop3(k) {
-            var el;
-            return _regeneratorRuntime.wrap(function (_context4) {
-              while (1) switch (_context4.prev = _context4.next) {
-                case 0:
-                  el = cabinetPayload.structure_json.tempPlaceholders[k].id;
-                  tempData = {};
-                  doorKey = 0;
-                  drawerKey = 0;
-                  fixedKey = 0;
-                  doorPHs = 0;
-                  drawerPHs = 0;
-                  has_single_door = false;
-                  fixedPHs = 0;
-                  temp.forEach(function (t, index) {
-                    var nodes = t.data.nodes;
-                    if (nodes === undefined) {
-                      nodes = [];
-                    }
-                    var tempPlaceholders = nodes.filter(function (element) {
-                      return element.name.startsWith('ph_');
-                    });
-                    tempPlaceholders.sort(function (a, b) {
-                      return a.name > b.name ? 1 : -1;
-                    });
-                    if (tempPlaceholders.length > 0) {
-                      if (t.name === 'base') {
-                        tempPlaceholders.map(function (element) {
-                          var sink_match = element.name.match(/\d_(sink_[^LR12]*)(_[LR12])?$/);
-                          if (sink_match && sink_match.length >= 2) {
-                            var _process$env$API_URL, _cabinetPayload$struc4;
-                            tempData['sink'] = tempData['sink'] || [];
-                            tempData['sink'].push(element.name);
-                            var sink_url = (_process$env$API_URL = process.env.API_URL) !== null && _process$env$API_URL !== void 0 ? _process$env$API_URL :
-                            // server url from 3DTool env
-                            import.meta.env.VITE_APP_API_URL + // server url from Host env
-                            "/uploads/assets/default/".concat(sink_match[1], ".gltf");
-                            if (cabinetPayload !== null && cabinetPayload !== void 0 && (_cabinetPayload$struc4 = cabinetPayload.structure_json) !== null && _cabinetPayload$struc4 !== void 0 && (_cabinetPayload$struc4 = _cabinetPayload$struc4.tempPlaceholders[k]) !== null && _cabinetPayload$struc4 !== void 0 && _cabinetPayload$struc4.structure) cabinetPayload.structure_json.tempPlaceholders[k].structure.sink = sink_url;
-                          } else if (temp.some(function (felement) {
-                            return felement.name.includes('base_drawer');
-                          }) && element.name.includes('interior_drawer')) {
-                            var objCnt = temp.filter(function (felement) {
-                              return felement.name.includes('base_drawer') && !felement.name.includes('_door');
-                            }).length;
-                            var phCnt = tempPlaceholders.filter(function (felement) {
-                              return felement.name.includes('interior');
-                            }).length;
-                            drawerPHs = phCnt;
-                            if (objCnt === 1 || phCnt % objCnt !== 0) {
-                              if (tempData['base_drawer_1'] === undefined) {
-                                tempData['base_drawer_1'] = [];
-                              }
-                              tempData['base_drawer_1'].push(element.name);
-                              drawerKey++;
-                            } else if (objCnt > 1 && phCnt % objCnt === 0) {
-                              if (tempData['base_drawer_' + (drawerKey % objCnt + 1)] === undefined) {
-                                tempData['base_drawer_' + (drawerKey % objCnt + 1)] = [];
-                              }
-                              tempData['base_drawer_' + (drawerKey % objCnt + 1)].push(element.name);
-                              drawerKey++;
-                            }
-                          } else if (temp.some(function (felement) {
-                            return felement.name.includes('base_door');
-                          }) && !element.name.includes('interior_drawer') && !element.name.includes('drawer') && element.name.includes('door')) {
-                            var _objCnt = temp.filter(function (felement) {
-                              return felement.name.includes('base_door');
-                            }).length;
-                            var _phCnt = tempPlaceholders.filter(function (felement) {
-                              return !felement.name.includes('interior') && !felement.name.includes('drawer') && felement.name.includes('door');
-                            }).length;
-                            doorPHs = _phCnt;
-                            if (_objCnt === 1 || _phCnt % _objCnt !== 0) {
-                              if (tempData['base_door_1'] === undefined) {
-                                tempData['base_door_1'] = [];
-                              }
-                              tempData['base_door_1'].push(element.name);
-                              doorKey++;
-                            } else if (_objCnt > 1) {
-                              if (tempData['base_door_' + (doorKey % _objCnt + 1)] === undefined) {
-                                tempData['base_door_' + (doorKey % _objCnt + 1)] = [];
-                              }
-                              tempData['base_door_' + (doorKey % _objCnt + 1)].push(element.name);
-                              doorKey++;
-                            }
-                          } else if (temp.some(function (felement) {
-                            return felement.name.includes('base_fixed_drawer_door');
-                          }) && element.name.includes('_drawer_door_fixed')) {
-                            var _objCnt2 = temp.filter(function (felement) {
-                              return felement.name.includes('base_fixed_drawer_door');
-                            }).length;
-                            var _phCnt2 = tempPlaceholders.filter(function (felement) {
-                              return felement.name.includes('_drawer_door_fixed');
-                            }).length;
-                            fixedPHs = _phCnt2;
-                            if (_objCnt2 === 1 || _phCnt2 % _objCnt2 !== 0) {
-                              if (tempData['base_fixed_drawer_door_1'] === undefined) {
-                                tempData['base_fixed_drawer_door_1'] = [];
-                              }
-                              tempData['base_fixed_drawer_door_1'].push(element.name);
-                              fixedKey++;
-                            } else if (_objCnt2 > 1) {
-                              if (tempData['base_fixed_drawer_door_' + (fixedKey % _objCnt2 + 1)] === undefined) {
-                                tempData['base_fixed_drawer_door_' + (fixedKey % _objCnt2 + 1)] = [];
-                              }
-                              tempData['base_fixed_drawer_door_' + (fixedKey % _objCnt2 + 1)].push(element.name);
-                              fixedKey++;
-                            }
-                          }
-                        });
-                      } else if (t.name.includes('base_drawer') && !t.name.includes('_door')) {
-                        var objCnt = temp.filter(function (felement) {
-                          return felement.name.includes('base_drawer') && !felement.name.includes('_door');
-                        }).length;
-                        if (objCnt === 1 || drawerPHs % objCnt !== 0) {
-                          if (tempData['base_drawer_door_1'] === undefined) tempData['base_drawer_door_1'] = [];
-                          //get drawer door handle placeholders
-                          var ph_temp = temp.find(function (felement) {
-                            return felement.name === 'base_drawer_door_1';
-                          });
-                          if (ph_temp != undefined) {
-                            var ph_drawer_door_handle = ph_temp.data.nodes;
-                            ph_drawer_door_handle = ph_drawer_door_handle.filter(function (element) {
-                              return element.name.startsWith('ph_') && element.name.includes('handle');
-                            });
-                            for (var w = 0; w < drawerPHs; w++) {
-                              if (!tempData['base_drawer_door_1'].some(function (el) {
-                                return el === 'base_drawer_door_1/' + tempPlaceholders[0].name;
-                              })) {
-                                tempData['base_drawer_door_1'].push('base_drawer_1/' + tempPlaceholders[0].name);
-                                //add drawer door handle placeholders
-                                if (tempData['drawer_door_handle_1'] === undefined) tempData['drawer_door_handle_1'] = [];
-                                if (ph_drawer_door_handle.length > 0) tempData['drawer_door_handle_1'].push('base_drawer_door_1/' + ph_drawer_door_handle[0].name);
-                              }
-                            }
-                          }
-                        } else if (objCnt > 1 && drawerPHs > 0 && drawerPHs % objCnt === 0) {
-                          if (tempData['base_drawer_door' + t.name.slice(-2)] === undefined) tempData['base_drawer_door' + t.name.slice(-2)] = [];
-                          //get drawer door handle placeholders
-                          var ph_temp = temp.find(function (felement) {
-                            return felement.name === 'base_drawer_door' + t.name.slice(-2);
-                          });
-                          if (ph_temp != undefined) {
-                            var ph_drawer_door_handle = ph_temp.data.nodes;
-                            ph_drawer_door_handle = ph_drawer_door_handle.filter(function (element) {
-                              return element.name.startsWith('ph_') && element.name.includes('handle');
-                            });
-                            tempPlaceholders.forEach(function (element) {
-                              if (!tempData['base_drawer_door' + t.name.slice(-2)].some(function (el) {
-                                return el === t.name + '/' + element.name;
-                              })) {
-                                tempData['base_drawer_door' + t.name.slice(-2)].push(t.name + '/' + element.name);
-                                //add drawer door handle placeholders
-                                if (tempData['drawer_door_handle' + t.name.slice(-2)] === undefined) tempData['drawer_door_handle' + t.name.slice(-2)] = [];
-                                if (ph_drawer_door_handle.length > 0) tempData['drawer_door_handle' + t.name.slice(-2)].push('base_drawer_door' + t.name.slice(-2) + '/' + ph_drawer_door_handle[0].name);
-                              }
-                            });
-                          }
-                        }
-                      } else if (t.name.includes('base_door')) {
-                        var _objCnt3 = temp.filter(function (felement) {
-                          return felement.name.includes('base_door');
-                        }).length;
-                        tempPlaceholders = tempPlaceholders.filter(function (el) {
-                          return el.name.includes('handle');
-                        });
-                        if (tempPlaceholders.length > 0) if (_objCnt3 === 1 || doorPHs % _objCnt3 !== 0) {
-                          if (tempData['door_handle_1'] === undefined) {
-                            tempData['door_handle_1'] = [];
-                          }
-                          var _loop4 = function _loop4() {
-                            var phname = tempPlaceholders[0].name;
-                            var newph = undefined;
-                            if (tempData['base_door_1'][_w].isLeftPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isRightPlaceholder();
-                              });
-                            }
-                            if (tempData['base_door_1'][_w].isRightPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isLeftPlaceholder();
-                              });
-                            }
-                            if (newph != undefined) {
-                              phname = newph.name;
-                            }
-                            if (doorPHs === 1 && tempPlaceholders.find(function (el) {
-                              return el.name.isLeftPlaceholder();
-                            }) != undefined && tempPlaceholders.find(function (el) {
-                              return el.name.isRightPlaceholder();
-                            }) != undefined) {
-                              has_single_door = true;
-                            }
-                            if (!tempData['door_handle_1'].some(function (el) {
-                              return el === 'door_handle_1/' + phname;
-                            })) {
-                              tempData['door_handle_1'].push('base_door_1/' + phname);
-                            }
-                          };
-                          for (var _w = 0; _w < doorPHs; _w++) {
-                            _loop4();
-                          }
-                        } else if (_objCnt3 > 1 && doorPHs > 0 && doorPHs % _objCnt3 === 0) {
-                          if (tempData['door_handle' + t.name.slice(-2)] === undefined) tempData['door_handle' + t.name.slice(-2)] = [];
-                          var phname = tempPlaceholders[0].name;
-                          var newph = undefined;
-                          var blAdd = true;
-                          if (cabinetPayload.is_corner) {
-                            if (tempData['base_door' + t.name.slice(-2)][0].isLeftPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isLeftPlaceholder();
-                              });
-                            } else {
-                              blAdd = false;
-                            }
-                          } else {
-                            if (tempData['base_door' + t.name.slice(-2)][0].isLeftPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isRightPlaceholder();
-                              });
-                            }
-                            if (tempData['base_door' + t.name.slice(-2)][0].isRightPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isLeftPlaceholder();
-                              });
-                            }
-                          }
-                          if (blAdd) {
-                            if (newph != undefined) {
-                              phname = newph.name;
-                            }
-                            if (!tempData['door_handle' + t.name.slice(-2)].some(function (el) {
-                              return el === t.name + '/' + phname;
-                            })) {
-                              tempData['door_handle' + t.name.slice(-2)].push(t.name + '/' + phname);
-                            }
-                          }
-                        }
-                      } else if (t.name.includes('base_fixed_drawer_door')) {
-                        var _objCnt4 = temp.filter(function (felement) {
-                          return felement.name.includes('base_fixed_drawer_door');
-                        }).length;
-                        tempPlaceholders = tempPlaceholders.filter(function (el) {
-                          return el.name.includes('handle');
-                        });
-                        if (tempPlaceholders.length > 0) if (_objCnt4 === 1 || fixedPHs % _objCnt4 !== 0) {
-                          if (tempData['fixed_drawer_door_handle_1'] === undefined) tempData['fixed_drawer_door_handle_1'] = [];
-                          var _loop5 = function _loop5() {
-                            var phname = tempPlaceholders[0].name;
-                            var newph = undefined;
-                            if (tempData['base_fixed_drawer_door_1'][_w2].isLeftPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isRightPlaceholder();
-                              });
-                            }
-                            if (tempData['base_fixed_drawer_door_1'][_w2].isRightPlaceholder()) {
-                              newph = tempPlaceholders.find(function (el) {
-                                return el.name.isLeftPlaceholder();
-                              });
-                            }
-                            if (newph != undefined) {
-                              phname = newph.name;
-                            }
-                            if (!tempData['fixed_drawer_door_handle_1'].some(function (el) {
-                              return el === 'fixed_drawer_door_handle_1/' + phname;
-                            })) {
-                              tempData['fixed_drawer_door_handle_1'].push('base_fixed_drawer_door_1/' + phname);
-                            }
-                          };
-                          for (var _w2 = 0; _w2 < fixedPHs; _w2++) {
-                            _loop5();
-                          }
-                        } else if (_objCnt4 > 1 && fixedPHs > 0 && fixedPHs % _objCnt4 === 0) {
-                          if (tempData['fixed_drawer_door_handle' + t.name.slice(-2)] === undefined) {
-                            tempData['fixed_drawer_door_handle' + t.name.slice(-2)] = [];
-                          }
-                          var _phname = tempPlaceholders[0].name;
-                          var _newph = undefined;
-                          if (tempData['base_fixed_drawer_door' + t.name.slice(-2)][0].isLeftPlaceholder()) {
-                            _newph = tempPlaceholders.find(function (el) {
-                              return el.name.isRightPlaceholder();
-                            });
-                          }
-                          if (tempData['base_fixed_drawer_door' + t.name.slice(-2)][0].isRightPlaceholder()) {
-                            _newph = tempPlaceholders.find(function (el) {
-                              return el.name.isLeftPlaceholder();
-                            });
-                          }
-                          if (_newph != undefined) {
-                            _phname = _newph.name;
-                          }
-                          if (!tempData['fixed_drawer_door_handle' + t.name.slice(-2)].some(function (el) {
-                            return el === t.name + '/' + _phname;
-                          })) {
-                            tempData['fixed_drawer_door_handle' + t.name.slice(-2)].push(t.name + '/' + _phname);
-                          }
-                        }
-                      }
-                    }
-                  });
-                  tempPlaceholdersData.push({
-                    id: parseInt(el, 10),
-                    placeholders: tempData,
-                    structure: cabinetPayload.structure_json.tempPlaceholders[k].structure
-                  });
-                case 1:
-                case "end":
-                  return _context4.stop();
-              }
-            }, _loop3);
-          });
-          k = 0;
-        case 5:
-          if (!(k < (cabinetPayload === null || cabinetPayload === void 0 || (_cabinetPayload$struc3 = cabinetPayload.structure_json) === null || _cabinetPayload$struc3 === void 0 || (_cabinetPayload$struc3 = _cabinetPayload$struc3.tempPlaceholders) === null || _cabinetPayload$struc3 === void 0 ? void 0 : _cabinetPayload$struc3.length))) {
-            _context5.next = 7;
-            break;
-          }
-          return _context5.delegateYield(_loop3(k), "t0", 6);
-        case 6:
-          k++;
-          _context5.next = 5;
-          break;
-        case 7:
-          return _context5.abrupt("return", tempPlaceholdersData);
-        case 8:
-        case "end":
-          return _context5.stop();
-      }
-    }, _callee4);
-  }));
-  return _parseTempPlaceholdersFromCabinetPayload.apply(this, arguments);
-}
-function updateCabinetPayload(_x3) {
+function updateCabinetPayload(_x2) {
   return _updateCabinetPayload.apply(this, arguments);
 }
 function _updateCabinetPayload() {
-  _updateCabinetPayload = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(cabinetPayload) {
+  _updateCabinetPayload = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(cabinetPayload) {
     var cabinetPayloadKeys, i, _cabinetPayload$cabin, _cabinetPayload$cabin2;
-    return _regeneratorRuntime.wrap(function (_context6) {
-      while (1) switch (_context6.prev = _context6.next) {
+    return _regeneratorRuntime.wrap(function (_context4) {
+      while (1) switch (_context4.prev = _context4.next) {
         case 0:
-          // let tempPlaceholders = [];
-          // tempPlaceholders = await parseTempPlaceholdersFromCabinetPayload(
-          //   cabinetPayload
-          // );
           cabinetPayloadKeys = Object.keys(cabinetPayload);
           for (i = 0; i < cabinetPayloadKeys.length; i++) {
             if (cabinetPayloadKeys[i] === 'structure_json') {
               cabinetPayload[cabinetPayloadKeys[i]]['placeholders'] = (_cabinetPayload$cabin = (_cabinetPayload$cabin2 = cabinetPayload[cabinetPayloadKeys[i]]['tempPlaceholders'][0]) === null || _cabinetPayload$cabin2 === void 0 ? void 0 : _cabinetPayload$cabin2.placeholders) !== null && _cabinetPayload$cabin !== void 0 ? _cabinetPayload$cabin : [];
-
-              // cabinetPayload[cabinetPayloadKeys[i]]['placeholders'] =
-              //   tempPlaceholders[0].placeholders;
-              // cabinetPayload[cabinetPayloadKeys[i]]['tempPlaceholders'] =
-              //   tempPlaceholders;
             }
           }
-          return _context6.abrupt("return", cabinetPayload);
+          return _context4.abrupt("return", cabinetPayload);
         case 1:
         case "end":
-          return _context6.stop();
+          return _context4.stop();
       }
-    }, _callee5);
+    }, _callee4);
   }));
   return _updateCabinetPayload.apply(this, arguments);
 }
@@ -550,34 +171,34 @@ var loadSVGsByItem = /*#__PURE__*/function () {
       }
     }, _callee2);
   }));
-  return function loadSVGsByItem(_x4) {
+  return function loadSVGsByItem(_x3) {
     return _ref.apply(this, arguments);
   };
 }();
-function addItemToCatalog(_x5, _x6, _x7, _x8) {
+function addItemToCatalog(_x4, _x5, _x6, _x7) {
   return _addItemToCatalog.apply(this, arguments);
 } // Get attributs of current selected element
 function _addItemToCatalog() {
-  _addItemToCatalog = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6(element, state, catalogInstance, projectActions) {
+  _addItemToCatalog = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(element, state, catalogInstance, projectActions) {
     var _elementJs, _elementJs3;
     var elementJs, outlineSVGData, _state$getIn, _elementJs$structure_, _elementJs$structure_2, _elementJs$structure_3, cds, _cds$find, _elementJs2, currentCdsId, cdsIdx, ttph, updatedStructureJson, catalogElements, catalogElementKeys, catalogItem, k, _catalogElements$cata, tempPlaceholderArray, _catalogItem$structur, newTempPlaceholderArray, mergedTempPlaceholder;
-    return _regeneratorRuntime.wrap(function (_context7) {
-      while (1) switch (_context7.prev = _context7.next) {
+    return _regeneratorRuntime.wrap(function (_context5) {
+      while (1) switch (_context5.prev = _context5.next) {
         case 0:
           if (!isEmpty(element === null || element === void 0 ? void 0 : element.name)) {
-            _context7.next = 1;
+            _context5.next = 1;
             break;
           }
-          return _context7.abrupt("return");
+          return _context5.abrupt("return");
         case 1:
           // clone element
           elementJs = Object.assign({}, element); // if (isEmpty(catalog?.elements[element.name])) {
-          _context7.next = 2;
+          _context5.next = 2;
           return loadSVGsByItem(elementJs);
         case 2:
-          outlineSVGData = _context7.sent;
+          outlineSVGData = _context5.sent;
           if (!(((_elementJs = elementJs) === null || _elementJs === void 0 ? void 0 : _elementJs.type) === 'cabinet')) {
-            _context7.next = 4;
+            _context5.next = 4;
             break;
           }
           // move the tempPlaceholder of current door style to first of tempPlaceholders array
@@ -605,13 +226,13 @@ function _addItemToCatalog() {
             }
           });
           if (isEmpty((_elementJs$structure_3 = elementJs.structure_json) === null || _elementJs$structure_3 === void 0 ? void 0 : _elementJs$structure_3.tempPlaceholders)) {
-            _context7.next = 4;
+            _context5.next = 4;
             break;
           }
-          _context7.next = 3;
+          _context5.next = 3;
           return updateCabinetPayload(elementJs);
         case 3:
-          elementJs = _context7.sent;
+          elementJs = _context5.sent;
         case 4:
           elementJs = _objectSpread(_objectSpread({}, elementJs), {}, {
             outlineSVGData: outlineSVGData,
@@ -628,18 +249,18 @@ function _addItemToCatalog() {
           k = 0;
         case 5:
           if (!(k < catalogElementKeys.length)) {
-            _context7.next = 7;
+            _context5.next = 7;
             break;
           }
           if (!(((_catalogElements$cata = catalogElements[catalogElementKeys[k]]) === null || _catalogElements$cata === void 0 ? void 0 : _catalogElements$cata.itemID) === elementJs.itemID)) {
-            _context7.next = 6;
+            _context5.next = 6;
             break;
           }
           catalogItem = catalogElements[catalogElementKeys[k]];
-          return _context7.abrupt("continue", 7);
+          return _context5.abrupt("continue", 7);
         case 6:
           k++;
-          _context7.next = 5;
+          _context5.next = 5;
           break;
         case 7:
           // get old tempPlaceholder array from catalog item
@@ -670,9 +291,9 @@ function _addItemToCatalog() {
           }
         case 8:
         case "end":
-          return _context7.stop();
+          return _context5.stop();
       }
-    }, _callee6);
+    }, _callee5);
   }));
   return _addItemToCatalog.apply(this, arguments);
 }
@@ -1032,15 +653,15 @@ function getElement(objProps, state) {
   }
   return curObject;
 }
-function loadMoldingSvg(_x9) {
+function loadMoldingSvg(_x8) {
   return _loadMoldingSvg.apply(this, arguments);
 }
 function _loadMoldingSvg() {
-  _loadMoldingSvg = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7(molding) {
-    return _regeneratorRuntime.wrap(function (_context8) {
-      while (1) switch (_context8.prev = _context8.next) {
+  _loadMoldingSvg = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6(molding) {
+    return _regeneratorRuntime.wrap(function (_context6) {
+      while (1) switch (_context6.prev = _context6.next) {
         case 0:
-          return _context8.abrupt("return", new Promise(function (resolve, reject) {
+          return _context6.abrupt("return", new Promise(function (resolve, reject) {
             var url = molding === null || molding === void 0 ? void 0 : molding.shape_svg;
             if (!url) {
               // Skip if no SVG URL available
@@ -1062,9 +683,9 @@ function _loadMoldingSvg() {
           }));
         case 1:
         case "end":
-          return _context8.stop();
+          return _context6.stop();
       }
-    }, _callee7);
+    }, _callee6);
   }));
   return _loadMoldingSvg.apply(this, arguments);
 }
@@ -1205,43 +826,43 @@ function mergeSameElements(projectItemsCatalog) {
   }
   return result;
 }
-export function handleExternalEvent(_x0) {
+export function handleExternalEvent(_x9) {
   return _handleExternalEvent.apply(this, arguments);
 }
 function _handleExternalEvent() {
-  _handleExternalEvent = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee0(props) {
+  _handleExternalEvent = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee9(props) {
     var _evt$payload3, _evt$payload4;
-    var evt, state, layerId, layer, _evt$payload, _state$catalog, cdsItems, itemKeys, _loop6, i, newScene, tempState, _props$onInternalEven, sLineCnt, element, _state$viewer2D, _evt$payload$initialP, mouseX, mouseY, v2d, vPosX, vPosY, layerID, defaulTitle, _evt$payload5, doorStyle, itemCDS, applyScope, _evt$payload5$itemIds, itemIds, _layerId, allItems, targetItems, idSet, selectedItemIds, _cdsItems, _loop7, _i2, _props$onInternalEven2, _evt$payload6, roomShapeType, width, height, measurementUnit, _doorStyle, value, _value, _evt$payload7, moldingInfo, isGlobal, distElement, _distElement, _evt$payload8, option, _value2, _layerId2, _layer, _layer$getIn, selectedLines, selectedHoles, selectedItems, _i4, _i5, _i6, _evt$payload9, _evt$payload0, _evt$payload1, _evt$payload10, _layerID, _layer2, orginalItemInfo, originalItem, originalItemPos, replaceItem, _props$onInternalEven3, sceneData, currentTexture, _t5, _t6, _t7;
-    return _regeneratorRuntime.wrap(function (_context11) {
-      while (1) switch (_context11.prev = _context11.next) {
+    var evt, state, layerId, layer, _evt$payload, _state$catalog, cdsItems, itemKeys, _loop3, i, newScene, tempState, _props$onInternalEven, sLineCnt, element, _state$viewer2D, _evt$payload$initialP, mouseX, mouseY, v2d, vPosX, vPosY, layerID, defaulTitle, _evt$payload5, doorStyle, itemCDS, applyScope, _evt$payload5$itemIds, itemIds, _layerId, allItems, targetItems, idSet, selectedItemIds, _cdsItems, _loop4, _i2, _props$onInternalEven2, _evt$payload6, roomShapeType, width, height, measurementUnit, _doorStyle, value, _value, _evt$payload7, moldingInfo, isGlobal, distElement, _distElement, _evt$payload8, option, _value2, _layerId2, _layer, _layer$getIn, selectedLines, selectedHoles, selectedItems, _i4, _i5, _i6, _evt$payload9, _evt$payload0, _evt$payload1, _evt$payload10, _layerID, _layer2, orginalItemInfo, originalItem, originalItemPos, replaceItem, _props$onInternalEven3, sceneData, currentTexture, _t2, _t3, _t4;
+    return _regeneratorRuntime.wrap(function (_context1) {
+      while (1) switch (_context1.prev = _context1.next) {
         case 0:
           // console.log('***external event****', props.externalEvent);
           evt = props.externalEvent;
           state = getPlannerStateFromProps(props);
           if (state) {
-            _context11.next = 1;
+            _context1.next = 1;
             break;
           }
-          return _context11.abrupt("return");
+          return _context1.abrupt("return");
         case 1:
           layerId = state.getIn(['scene', 'selectedLayer']);
           layer = state.getIn(['scene', 'layers', layerId]);
-          _t5 = evt === null || evt === void 0 ? void 0 : evt.type;
-          _context11.next = _t5 === EXTERNAL_EVENT_LOAD_PROJECT ? 2 : _t5 === EXTERNAL_EVENT_TOGGLE_TO_3D ? 7 : _t5 === EXTERNAL_EVENT_TOGGLE_TO_2D ? 8 : _t5 === EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 9 : _t5 === EXTERNAL_EVENT_ADD_WALL ? 10 : _t5 === EXTERNAL_EVENT_ADD_ITEM ? 11 : _t5 === EXTERNAL_EVENT_ADD_HOLE ? 14 : _t5 === EXTERNAL_EVENT_ROTATE_PAN ? 15 : _t5 === EXTERNAL_EVENT_MOVE_PAN ? 15 : _t5 === EXTERNAL_EVENT_NEW_PROJECT ? 16 : _t5 === EXTERNAL_EVENT_CHANGE_DOORSTYLE ? 17 : _t5 === EXTERNAL_EVENT_ADD_ROOM_SHAPE ? 25 : _t5 === EXTERNAL_EVENT_ZOOM_IN ? 26 : _t5 === EXTERNAL_EVENT_ZOOM_OUT ? 27 : _t5 === EXTERNAL_EVENT_CENTERING_2D ? 28 : _t5 === EXTERNAL_EVENT_UNDO ? 29 : _t5 === EXTERNAL_EVENT_REDO ? 30 : _t5 === EXTERNAL_EVENT_SET_MOLDING ? 31 : _t5 === EXTERNAL_EVENT_DUPLICATE_ELEMENT ? 33 : _t5 === EXTERNAL_EVENT_DELETE_ELEMENT ? 34 : _t5 === EXTERNAL_EVENT_PROJECT_SETTING ? 35 : _t5 === EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? 44 : _t5 === EXTERNAL_EVENT_UPDATE_PROPERTY ? 44 : _t5 === EXTERNAL_EVENT_REPLACE_CABINET ? 45 : _t5 === EXTERNAL_EVENT_SET_FINISHING ? 47 : _t5 === EXTERNAL_EVENT_SYNC_SCENE ? 48 : 49;
+          _t2 = evt === null || evt === void 0 ? void 0 : evt.type;
+          _context1.next = _t2 === EXTERNAL_EVENT_LOAD_PROJECT ? 2 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_3D ? 7 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_2D ? 8 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 9 : _t2 === EXTERNAL_EVENT_ADD_WALL ? 10 : _t2 === EXTERNAL_EVENT_ADD_ITEM ? 11 : _t2 === EXTERNAL_EVENT_ADD_HOLE ? 14 : _t2 === EXTERNAL_EVENT_ROTATE_PAN ? 15 : _t2 === EXTERNAL_EVENT_MOVE_PAN ? 15 : _t2 === EXTERNAL_EVENT_NEW_PROJECT ? 16 : _t2 === EXTERNAL_EVENT_CHANGE_DOORSTYLE ? 17 : _t2 === EXTERNAL_EVENT_ADD_ROOM_SHAPE ? 25 : _t2 === EXTERNAL_EVENT_ZOOM_IN ? 26 : _t2 === EXTERNAL_EVENT_ZOOM_OUT ? 27 : _t2 === EXTERNAL_EVENT_CENTERING_2D ? 28 : _t2 === EXTERNAL_EVENT_UNDO ? 29 : _t2 === EXTERNAL_EVENT_REDO ? 30 : _t2 === EXTERNAL_EVENT_SET_MOLDING ? 31 : _t2 === EXTERNAL_EVENT_DUPLICATE_ELEMENT ? 33 : _t2 === EXTERNAL_EVENT_DELETE_ELEMENT ? 34 : _t2 === EXTERNAL_EVENT_PROJECT_SETTING ? 35 : _t2 === EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? 44 : _t2 === EXTERNAL_EVENT_UPDATE_PROPERTY ? 44 : _t2 === EXTERNAL_EVENT_REPLACE_CABINET ? 45 : _t2 === EXTERNAL_EVENT_SET_FINISHING ? 47 : _t2 === EXTERNAL_EVENT_SYNC_SCENE ? 48 : 49;
           break;
         case 2:
           if (!(evt !== null && evt !== void 0 && evt.payload)) {
-            _context11.next = 6;
+            _context1.next = 6;
             break;
           }
           // prepare item data request
           cdsItems = [];
           itemKeys = evt !== null && evt !== void 0 && (_evt$payload = evt.payload) !== null && _evt$payload !== void 0 && (_evt$payload = _evt$payload.layers['layer-1']) !== null && _evt$payload !== void 0 && _evt$payload.items ? Object.keys(evt.payload.layers['layer-1'].items) : [];
-          _loop6 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop6() {
+          _loop3 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop3() {
             var _evt$payload2, _it$properties, _it$properties2, _it$properties3, _it$doorStyle2;
             var it;
-            return _regeneratorRuntime.wrap(function (_context0) {
-              while (1) switch (_context0.prev = _context0.next) {
+            return _regeneratorRuntime.wrap(function (_context8) {
+              while (1) switch (_context8.prev = _context8.next) {
                 case 0:
                   it = evt === null || evt === void 0 || (_evt$payload2 = evt.payload) === null || _evt$payload2 === void 0 || (_evt$payload2 = _evt$payload2.layers['layer-1']) === null || _evt$payload2 === void 0 ? void 0 : _evt$payload2.items[itemKeys[i]]; //////// check altitude of item property and change length from _length (convert length from 'in' fo 'cm')
                   if (it !== null && it !== void 0 && (_it$properties = it.properties) !== null && _it$properties !== void 0 && (_it$properties = _it$properties.altitude) !== null && _it$properties !== void 0 && _it$properties.length && it !== null && it !== void 0 && (_it$properties2 = it.properties) !== null && _it$properties2 !== void 0 && (_it$properties2 = _it$properties2.altitude) !== null && _it$properties2 !== void 0 && _it$properties2._unit && it !== null && it !== void 0 && (_it$properties3 = it.properties) !== null && _it$properties3 !== void 0 && (_it$properties3 = _it$properties3.altitude) !== null && _it$properties3 !== void 0 && _it$properties3._length && it.properties.altitude.length !== convert(it.properties.altitude._length).from(it.properties.altitude._unit).to('cm')) {
@@ -1262,20 +883,20 @@ function _handleExternalEvent() {
                   });
                 case 1:
                 case "end":
-                  return _context0.stop();
+                  return _context8.stop();
               }
-            }, _loop6);
+            }, _loop3);
           });
           i = 0;
         case 3:
           if (!(i < itemKeys.length)) {
-            _context11.next = 5;
+            _context1.next = 5;
             break;
           }
-          return _context11.delegateYield(_loop6(), "t0", 4);
+          return _context1.delegateYield(_loop3(), "t0", 4);
         case 4:
           i++;
-          _context11.next = 3;
+          _context1.next = 3;
           break;
         case 5:
           newScene = new Scene(evt === null || evt === void 0 ? void 0 : evt.payload);
@@ -1290,63 +911,63 @@ function _handleExternalEvent() {
                 cdsItems: cdsItems
               }
             }, /*#__PURE__*/function () {
-              var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee8(result) {
+              var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7(result) {
                 var rt, _i;
-                return _regeneratorRuntime.wrap(function (_context9) {
-                  while (1) switch (_context9.prev = _context9.next) {
+                return _regeneratorRuntime.wrap(function (_context7) {
+                  while (1) switch (_context7.prev = _context7.next) {
                     case 0:
                       rt = mergeSameElements(result === null || result === void 0 ? void 0 : result.elements);
                       _i = 0;
                     case 1:
                       if (!(_i < (rt === null || rt === void 0 ? void 0 : rt.length))) {
-                        _context9.next = 3;
+                        _context7.next = 3;
                         break;
                       }
-                      _context9.next = 2;
+                      _context7.next = 2;
                       return addItemToCatalog(rt[_i], tempState, props.catalog, props.projectActions);
                     case 2:
                       _i++;
-                      _context9.next = 1;
+                      _context7.next = 1;
                       break;
                     case 3:
                       props.projectActions.loadProject(evt.payload);
                     case 4:
                     case "end":
-                      return _context9.stop();
+                      return _context7.stop();
                   }
-                }, _callee8);
+                }, _callee7);
               }));
-              return function (_x1) {
+              return function (_x0) {
                 return _ref3.apply(this, arguments);
               };
             }());
           } else props.projectActions.loadProject(evt.payload);
         case 6:
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 7:
           props.projectActions.unselectAll();
           props.projectActions.setMode(MODE_IDLE_3D);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 8:
           props.projectActions.setMode(MODE_IDLE);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 9:
           sLineCnt = layer.selected.lines.size;
           if (sLineCnt > 0) props.projectActions.setMode(MODE_ELEVATION_VIEW);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 10:
           if (state.mode === MODE_IDLE || state.mode === MODE_2D_PAN) props.linesActions.selectToolDrawingLine('wall');else {
             props.projectActions.setMode(MODE_IDLE);
             props.linesActions.selectToolDrawingLine('wall');
           }
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 11:
           if (isEmpty(evt === null || evt === void 0 ? void 0 : evt.payload)) {
-            _context11.next = 13;
+            _context1.next = 13;
             break;
           }
           element = evt.payload;
-          _context11.next = 12;
+          _context1.next = 12;
           return addItemToCatalog(element, state, props.catalog, props.projectActions);
         case 12:
           // start drawing item
@@ -1370,18 +991,18 @@ function _handleExternalEvent() {
           props.projectActions.pushLastSelectedCatalogElementToHistory(element);
           props.projectActions.setIsCabinetDrawing(true);
         case 13:
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 14:
           ARRAY_3D_MODES.includes(state.mode) ? props.holesActions.selectToolDrawingHole3D(evt === null || evt === void 0 || (_evt$payload3 = evt.payload) === null || _evt$payload3 === void 0 ? void 0 : _evt$payload3.holeName) : props.holesActions.selectToolDrawingHole(evt === null || evt === void 0 || (_evt$payload4 = evt.payload) === null || _evt$payload4 === void 0 ? void 0 : _evt$payload4.holeName);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 15:
           moveAndRotatePan2D3D(evt.type, props, evt.payload, state);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 16:
           defaulTitle = 'Untitle';
           props.projectActions.newProject();
           props.projectActions.rename(defaulTitle);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 17:
           _evt$payload5 = evt.payload, doorStyle = _evt$payload5.doorStyle, itemCDS = _evt$payload5.itemCDS, applyScope = _evt$payload5.applyScope, _evt$payload5$itemIds = _evt$payload5.itemIds, itemIds = _evt$payload5$itemIds === void 0 ? [] : _evt$payload5$itemIds;
           _layerId = state.getIn(['scene', 'selectedLayer']);
@@ -1396,27 +1017,27 @@ function _handleExternalEvent() {
             // itemIds contains item.id (instance IDs)
             idSet = new Set(itemIds);
           }
-          _t6 = applyScope;
-          _context11.next = _t6 === DOORSTYLE_SCOPE_ALL ? 18 : _t6 === DOORSTYLE_SCOPE_SINGLE ? 19 : _t6 === DOORSTYLE_SCOPE_MULTIPLE ? 19 : 20;
+          _t3 = applyScope;
+          _context1.next = _t3 === DOORSTYLE_SCOPE_ALL ? 18 : _t3 === DOORSTYLE_SCOPE_SINGLE ? 19 : _t3 === DOORSTYLE_SCOPE_MULTIPLE ? 19 : 20;
           break;
         case 18:
           targetItems = Object.values(allItems);
-          return _context11.abrupt("continue", 21);
+          return _context1.abrupt("continue", 21);
         case 19:
           targetItems = Object.values(allItems).filter(function (item) {
             var _idSet;
             return (_idSet = idSet) === null || _idSet === void 0 ? void 0 : _idSet.has(item.id);
           });
-          return _context11.abrupt("continue", 21);
+          return _context1.abrupt("continue", 21);
         case 20:
-          return _context11.abrupt("continue", 21);
+          return _context1.abrupt("continue", 21);
         case 21:
           _cdsItems = [];
-          _loop7 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop7() {
+          _loop4 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop4() {
             var _itemCDS$find;
             var item, cdsId;
-            return _regeneratorRuntime.wrap(function (_context10) {
-              while (1) switch (_context10.prev = _context10.next) {
+            return _regeneratorRuntime.wrap(function (_context0) {
+              while (1) switch (_context0.prev = _context0.next) {
                 case 0:
                   item = targetItems[_i2];
                   cdsId = (_itemCDS$find = itemCDS.find(function (itCDS) {
@@ -1437,20 +1058,20 @@ function _handleExternalEvent() {
                   }
                 case 1:
                 case "end":
-                  return _context10.stop();
+                  return _context0.stop();
               }
-            }, _loop7);
+            }, _loop4);
           });
           _i2 = 0;
         case 22:
           if (!(_i2 < targetItems.length)) {
-            _context11.next = 24;
+            _context1.next = 24;
             break;
           }
-          return _context11.delegateYield(_loop7(), "t1", 23);
+          return _context1.delegateYield(_loop4(), "t1", 23);
         case 23:
           _i2++;
-          _context11.next = 22;
+          _context1.next = 22;
           break;
         case 24:
           if (_cdsItems.length > 0) {
@@ -1460,44 +1081,44 @@ function _handleExternalEvent() {
                 cdsItems: _cdsItems
               }
             }, /*#__PURE__*/function () {
-              var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee9(result) {
+              var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee8(result) {
                 var rt, _i3;
-                return _regeneratorRuntime.wrap(function (_context1) {
-                  while (1) switch (_context1.prev = _context1.next) {
+                return _regeneratorRuntime.wrap(function (_context9) {
+                  while (1) switch (_context9.prev = _context9.next) {
                     case 0:
                       rt = mergeSameElements(result === null || result === void 0 ? void 0 : result.elements);
                       _i3 = 0;
                     case 1:
                       if (!(_i3 < (rt === null || rt === void 0 ? void 0 : rt.length))) {
-                        _context1.next = 3;
+                        _context9.next = 3;
                         break;
                       }
-                      _context1.next = 2;
+                      _context9.next = 2;
                       return addItemToCatalog(rt[_i3], state, props.catalog, props.projectActions);
                     case 2:
                       _i3++;
-                      _context1.next = 1;
+                      _context9.next = 1;
                       break;
                     case 3:
                       props.itemsActions.setDoorStyle(doorStyle, itemCDS, applyScope, itemIds);
                     case 4:
                     case "end":
-                      return _context1.stop();
+                      return _context9.stop();
                   }
-                }, _callee9);
+                }, _callee8);
               }));
-              return function (_x10) {
+              return function (_x1) {
                 return _ref4.apply(this, arguments);
               };
             }());
           } else {
             props.itemsActions.setDoorStyle(doorStyle, itemCDS, applyScope, itemIds);
           }
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 25:
           _evt$payload6 = evt.payload, roomShapeType = _evt$payload6.roomShapeType, width = _evt$payload6.width, height = _evt$payload6.height, measurementUnit = _evt$payload6.measurementUnit, _doorStyle = _evt$payload6.doorStyle;
           props.projectActions.createRoomWithShape(roomShapeType, width, height, measurementUnit, _doorStyle);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 26:
           value = state.getIn(['viewer2D']).toJS();
           value.a += 0.1;
@@ -1505,7 +1126,7 @@ function _handleExternalEvent() {
           value.e -= value.SVGWidth * 0.1 / 2;
           value.f -= value.SVGHeight * 0.1 / 2;
           updateViwer2D(value, props.viewer2DActions);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 27:
           _value = state.getIn(['viewer2D']).toJS();
           _value.a -= 0.1;
@@ -1513,62 +1134,62 @@ function _handleExternalEvent() {
           _value.e += _value.SVGWidth * 0.1 / 2;
           _value.f += _value.SVGHeight * 0.1 / 2;
           updateViwer2D(_value, props.viewer2DActions);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 28:
           centering2D(state, props.viewer2DActions);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 29:
           props.projectActions.undo();
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 30:
           props.projectActions.redo();
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 31:
           _evt$payload7 = evt.payload, moldingInfo = _evt$payload7.moldingInfo, isGlobal = _evt$payload7.isGlobal;
-          _context11.next = 32;
+          _context1.next = 32;
           return loadMoldingSvg(moldingInfo);
         case 32:
           props.itemsActions.setMolding(moldingInfo, isGlobal);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 33:
           distElement = getElement(evt.payload, state);
           if (distElement) props.itemsActions.duplicateSelected(distElement, props.onInternalEvent);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 34:
           _distElement = getElement(evt.payload, state);
           if (_distElement) props.projectActions.remove(_distElement);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 35:
           _evt$payload8 = evt.payload, option = _evt$payload8.option, _value2 = _evt$payload8.value;
-          _t7 = option;
-          _context11.next = _t7 === PROJECT_SETTING_OPTION.CHANGE_MEASUREMENT_UNIT ? 36 : _t7 === PROJECT_SETTING_OPTION.UPDATE_CEIL_HEIGHT ? 37 : _t7 === PROJECT_SETTING_OPTION.CHANGE_WALL_LENGTH_MEASURE ? 38 : _t7 === PROJECT_SETTING_OPTION.CHANGE_BASE_CABINET_MEASURE ? 39 : _t7 === PROJECT_SETTING_OPTION.CHANGE_WALL_CABINET_MEASURE ? 40 : _t7 === PROJECT_SETTING_OPTION.CHANGE_WINDOW_DOOR_MEASURE ? 41 : 42;
+          _t4 = option;
+          _context1.next = _t4 === PROJECT_SETTING_OPTION.CHANGE_MEASUREMENT_UNIT ? 36 : _t4 === PROJECT_SETTING_OPTION.UPDATE_CEIL_HEIGHT ? 37 : _t4 === PROJECT_SETTING_OPTION.CHANGE_WALL_LENGTH_MEASURE ? 38 : _t4 === PROJECT_SETTING_OPTION.CHANGE_BASE_CABINET_MEASURE ? 39 : _t4 === PROJECT_SETTING_OPTION.CHANGE_WALL_CABINET_MEASURE ? 40 : _t4 === PROJECT_SETTING_OPTION.CHANGE_WINDOW_DOOR_MEASURE ? 41 : 42;
           break;
         case 36:
           props.viewer2DActions.updateCeilHeight(convert(layer.ceilHeight).from(layer.unit).to(_value2));
           props.viewer2DActions.updateCeilHeightUnit(_value2);
           props.viewer3DActions.update3DCeilHeightUnit(_value2);
           props.viewer3DActions.update3DCeilHeight(convert(layer.ceilHeight).from(layer.unit).to(_value2));
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 37:
           props.viewer2DActions.updateCeilHeight(_value2);
           props.viewer3DActions.update3DCeilHeight(_value2);
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 38:
           props.viewer2DActions.changeWallLengthMeasure(_value2);
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 39:
           props.viewer2DActions.changeBaseCabinetMeasure(_value2);
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 40:
           props.viewer2DActions.changeWallCabinetMeasure(_value2);
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 41:
           props.viewer2DActions.changeWindowDoorMeasure(_value2);
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 42:
-          return _context11.abrupt("continue", 43);
+          return _context1.abrupt("continue", 43);
         case 43:
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 44:
           _layerId2 = state.getIn(['scene', 'selectedLayer']);
           _layer = state.getIn(['scene', 'layers', _layerId2]);
@@ -1576,13 +1197,13 @@ function _handleExternalEvent() {
           for (_i4 = 0; _i4 < selectedLines.size; _i4++) (evt === null || evt === void 0 ? void 0 : evt.type) === EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(_layer.getIn(['lines', selectedLines.get(_i4)]), evt.payload, state, _layer, props.catalog, props.projectActions, evt.callback) : updatePropertyOfSelectedElement(_layer.getIn(['lines', selectedLines.get(_i4)]), evt.payload, props.catalog, props.projectActions, evt.callback);
           for (_i5 = 0; _i5 < selectedHoles.size; _i5++) (evt === null || evt === void 0 ? void 0 : evt.type) === EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(_layer.getIn(['holes', selectedHoles.get(_i5)]), evt.payload, state, _layer, props.catalog, props.projectActions, evt.callback) : updatePropertyOfSelectedElement(_layer.getIn(['holes', selectedHoles.get(_i5)]), evt.payload, props.catalog, props.projectActions, evt.callback);
           for (_i6 = 0; _i6 < selectedItems.size; _i6++) (evt === null || evt === void 0 ? void 0 : evt.type) === EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(_layer.getIn(['items', selectedItems.get(_i6)]), evt.payload, state, _layer, props.catalog, props.projectActions, evt.callback) : updatePropertyOfSelectedElement(_layer.getIn(['items', selectedItems.get(_i6)]), evt.payload, props.catalog, props.projectActions, evt.callback);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 45:
           _layerID = state.scene.selectedLayer;
           _layer2 = state.scene.getIn(['layers', _layerID]).toJS();
           orginalItemInfo = evt === null || evt === void 0 || (_evt$payload9 = evt.payload) === null || _evt$payload9 === void 0 ? void 0 : _evt$payload9.orginalItemInfo;
           originalItem = _layer2 === null || _layer2 === void 0 ? void 0 : _layer2.items[orginalItemInfo.id];
-          _context11.next = 46;
+          _context1.next = 46;
           return addItemToCatalog(evt.payload.replaceItemInfo, state, props.catalog, props.projectActions);
         case 46:
           originalItemPos = {
@@ -1599,14 +1220,18 @@ function _handleExternalEvent() {
             }
           };
           props.itemsActions.replaceItem(originalItemPos, originalItem, replaceItem);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 47:
           setFinishing(props, state, evt.payload);
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 48:
           sceneData = state.scene.toJS(); // get molding data for "ReviewForQuote"
           currentTexture = layer.doorStyle !== null || layer.doorStyle !== undefined ? layer.doorStyle : props.state.doorStyle.toJS();
           sceneData.layers[layerId].moldingData = getMoldingDataOfScene2(layer, props.catalog, currentTexture);
+
+          // get skin panel data
+          sceneData.layers[layerId].skinPanelData = computeSkinPanels(layer);
+
           // send scene object from 3DTool to HostApp using internalEvent
           (_props$onInternalEven3 = props.onInternalEvent) === null || _props$onInternalEven3 === void 0 || _props$onInternalEven3.call(props, {
             type: INTERNAL_EVENT_SYNC_SCENE,
@@ -1614,12 +1239,12 @@ function _handleExternalEvent() {
               scene: sceneData
             }
           });
-          return _context11.abrupt("continue", 49);
+          return _context1.abrupt("continue", 49);
         case 49:
         case "end":
-          return _context11.stop();
+          return _context1.stop();
       }
-    }, _callee0);
+    }, _callee9);
   }));
   return _handleExternalEvent.apply(this, arguments);
 }