kitchen-simulator 11.0.0-react.18 → 11.1.0

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

@@ -1,1622 +0,0 @@
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _typeof from "@babel/runtime/helpers/esm/typeof";
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import { Map } from 'immutable';
-import { EXTERNAL_EVENT_ADD_WALL, EXTERNAL_EVENT_TOGGLE_TO_3D, EXTERNAL_EVENT_TOGGLE_TO_2D, EXTERNAL_EVENT_TOGGLE_TO_ELEVATION, EXTERNAL_EVENT_MOVE_PAN, MODE_IDLE, MODE_2D_PAN, EXTERNAL_EVENT_ADD_ITEM, ARRAY_3D_MODES, MODE_IDLE_3D, MODE_ELEVATION_VIEW, MODE_DRAWING_LINE, TOP, BOTTOM, LEFT, RIGHT, EXTERNAL_EVENT_NEW_PROJECT, EXTERNAL_EVENT_CHANGE_DOORSTYLE, EXTERNAL_EVENT_ADD_ROOM_SHAPE, EXTERNAL_EVENT_ZOOM_IN, EXTERNAL_EVENT_ZOOM_OUT, EXTERNAL_EVENT_UNDO, EXTERNAL_EVENT_REDO, EXTERNAL_EVENT_SET_MOLDING, EXTERNAL_EVENT_PROJECT_SETTING, PROJECT_SETTING_OPTION, EXTERNAL_EVENT_SYNC_SCENE, INTERNAL_EVENT_SYNC_SCENE, EXTERNAL_EVENT_UPDATE_ATTRIBUTE, ATT_ITEM_POS, ATT_LINE_LENGTH, ATT_VERTEXT_ONE, ATT_VERTEXT_TWO, ATT_HOLE_OFFSET_A, ATT_HOLE_OFFSET_B, UNIT_CENTIMETER, UNIT_INCH, EXTERNAL_EVENT_UPDATE_PROPERTY, PROP_FLIP_DOOR_HANDLE, PROP_OPEN_DOORS, EXTERNAL_EVENT_LOAD_PROJECT, INTERNAL_EVENT_ITEMS_CATALOG, EXTERNAL_EVENT_ADD_HOLE, EXTERNAL_EVENT_CENTERING_2D, EXTERNAL_EVENT_DUPLICATE_ELEMENT, EXTERNAL_EVENT_DELETE_ELEMENT, ELEMENT_HOLE, ELEMENT_ITEM, ELEMENT_LINE, EXTERNAL_EVENT_REPLACE_CABINET, FINISHING_TYPE, EXTERNAL_EVENT_SET_FINISHING, EXTERNAL_EVENT_ROTATE_PAN } from "../constants";
-import { isEmpty, updateViwer2D, centering2D } from "./helper";
-import exporter from "../catalog/utils/exporter";
-import { render2DItem, render3DItem, render3DApplianceItem, render3DLightingItem } from "../catalog/utils/item-loader";
-import { convert } from "./convert-units-lite";
-import { GeometryUtils, MathUtils } from "./export";
-import { returnReplaceableDeepSearchType } from "../components/viewer2d/utils";
-import { SVGLoader } from 'three/addons/loaders/SVGLoader.js';
-import { getMoldingDataOfScene2 } from "./molding";
-import { Scene, State } from "../models";
-var PRECISION = 2;
-
-// ---- compatibility: supports old + optimized props shapes ----
-export function getPlannerStateFromProps(props) {
-  var _props$state;
-  // New optimized path
-  if (props !== null && props !== void 0 && props.extractedState) return props.extractedState;
-
-  // Old path
-  if (props !== null && props !== void 0 && (_props$state = props.state) !== null && _props$state !== void 0 && _props$state.get) {
-    var kc = props.state.get('KitchenConfigurator');
-    if (kc) return kc;
-  }
-  return null;
-}
-
-// ---- caches: avoid re-fetch/re-parse costs (no behavior change) ----
-var __jsonCache = new Map(); // url -> Promise<any>
-var __svgCache = new Map(); // url -> Promise<svgData|null>
-function loadJSON(_x) {
-  return _loadJSON.apply(this, arguments);
-}
-/********Parse TempPlaceholder from cabinetPayloadData **************/
-function _loadJSON() {
-  _loadJSON = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(path) {
-    var p;
-    return _regeneratorRuntime.wrap(function (_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
-        case 0:
-          if (path) {
-            _context3.next = 1;
-            break;
-          }
-          return _context3.abrupt("return", null);
-        case 1:
-          if (!__jsonCache.has(path)) {
-            _context3.next = 2;
-            break;
-          }
-          return _context3.abrupt("return", __jsonCache.get(path));
-        case 2:
-          p = new Promise(function (resolve, reject) {
-            var xhr = new XMLHttpRequest();
-            xhr.onreadystatechange = function () {
-              if (xhr.readyState === XMLHttpRequest.DONE) {
-                if (xhr.status === 200) resolve(JSON.parse(xhr.responseText));else reject(xhr);
-              }
-            };
-            xhr.open('GET', path, true);
-            xhr.send();
-          });
-          __jsonCache.set(path, p);
-          return _context3.abrupt("return", p);
-        case 3:
-        case "end":
-          return _context3.stop();
-      }
-    }, _callee3);
-  }));
-  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) {
-  return _updateCabinetPayload.apply(this, arguments);
-}
-function _updateCabinetPayload() {
-  _updateCabinetPayload = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(cabinetPayload) {
-    var cabinetPayloadKeys, i, _cabinetPayload$cabin, _cabinetPayload$cabin2;
-    return _regeneratorRuntime.wrap(function (_context6) {
-      while (1) switch (_context6.prev = _context6.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);
-        case 1:
-        case "end":
-          return _context6.stop();
-      }
-    }, _callee5);
-  }));
-  return _updateCabinetPayload.apply(this, arguments);
-}
-var loadSVGsByItem = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(item) {
-    var url, p;
-    return _regeneratorRuntime.wrap(function (_context2) {
-      while (1) switch (_context2.prev = _context2.next) {
-        case 0:
-          if (item !== null && item !== void 0 && item.outline) {
-            _context2.next = 1;
-            break;
-          }
-          return _context2.abrupt("return", null);
-        case 1:
-          url = item.outline;
-          if (!__svgCache.has(url)) {
-            _context2.next = 2;
-            break;
-          }
-          return _context2.abrupt("return", __svgCache.get(url));
-        case 2:
-          p = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-            var _parsed$xml$viewBox, _parsed$xml$viewBox2, response, svgText, loader, parsed, _t;
-            return _regeneratorRuntime.wrap(function (_context) {
-              while (1) switch (_context.prev = _context.next) {
-                case 0:
-                  _context.prev = 0;
-                  _context.next = 1;
-                  return fetch(url, {
-                    cache: 'force-cache'
-                  });
-                case 1:
-                  response = _context.sent;
-                  _context.next = 2;
-                  return response.text();
-                case 2:
-                  svgText = _context.sent;
-                  loader = new SVGLoader();
-                  parsed = loader.parse(svgText);
-                  if (!isEmpty(parsed.paths)) {
-                    _context.next = 3;
-                    break;
-                  }
-                  return _context.abrupt("return", null);
-                case 3:
-                  return _context.abrupt("return", {
-                    paths: parsed.paths,
-                    svgWidth: parseFloat(parsed.xml.getAttribute('width')) || ((_parsed$xml$viewBox = parsed.xml.viewBox) === null || _parsed$xml$viewBox === void 0 || (_parsed$xml$viewBox = _parsed$xml$viewBox.animVal) === null || _parsed$xml$viewBox === void 0 ? void 0 : _parsed$xml$viewBox.width) || 0,
-                    svgHeight: parseFloat(parsed.xml.getAttribute('height')) || ((_parsed$xml$viewBox2 = parsed.xml.viewBox) === null || _parsed$xml$viewBox2 === void 0 || (_parsed$xml$viewBox2 = _parsed$xml$viewBox2.animVal) === null || _parsed$xml$viewBox2 === void 0 ? void 0 : _parsed$xml$viewBox2.height) || 0,
-                    reverse: !parseFloat(parsed.xml.getAttribute('height'))
-                  });
-                case 4:
-                  _context.prev = 4;
-                  _t = _context["catch"](0);
-                  console.error('Failed to load SVG:', url, _t);
-                  return _context.abrupt("return", null);
-                case 5:
-                case "end":
-                  return _context.stop();
-              }
-            }, _callee, null, [[0, 4]]);
-          }))();
-          __svgCache.set(url, p);
-          return _context2.abrupt("return", p);
-        case 3:
-        case "end":
-          return _context2.stop();
-      }
-    }, _callee2);
-  }));
-  return function loadSVGsByItem(_x4) {
-    return _ref.apply(this, arguments);
-  };
-}();
-function addItemToCatalog(_x5, _x6, _x7, _x8) {
-  return _addItemToCatalog.apply(this, arguments);
-} // Get attributs of current selected element
-function _addItemToCatalog() {
-  _addItemToCatalog = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6(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) {
-        case 0:
-          if (!isEmpty(element === null || element === void 0 ? void 0 : element.name)) {
-            _context7.next = 1;
-            break;
-          }
-          return _context7.abrupt("return");
-        case 1:
-          // clone element
-          elementJs = Object.assign({}, element); // if (isEmpty(catalog?.elements[element.name])) {
-          _context7.next = 2;
-          return loadSVGsByItem(elementJs);
-        case 2:
-          outlineSVGData = _context7.sent;
-          if (!(((_elementJs = elementJs) === null || _elementJs === void 0 ? void 0 : _elementJs.type) === 'cabinet')) {
-            _context7.next = 4;
-            break;
-          }
-          // move the tempPlaceholder of current door style to first of tempPlaceholders array
-          cds = (_state$getIn = state.getIn(['scene', 'layers', 'layer-1', 'doorStyle'])) === null || _state$getIn === void 0 ? void 0 : _state$getIn.cds;
-          if (cds) {
-            currentCdsId = (_cds$find = cds.find(function (c) {
-              return c.itemID === elementJs.itemID;
-            })) === null || _cds$find === void 0 ? void 0 : _cds$find.cabinet_door_style_id;
-            cdsIdx = (_elementJs2 = elementJs) === null || _elementJs2 === void 0 || (_elementJs2 = _elementJs2.structure_json) === null || _elementJs2 === void 0 || (_elementJs2 = _elementJs2.tempPlaceholders) === null || _elementJs2 === void 0 ? void 0 : _elementJs2.findIndex(function (tph) {
-              return tph.id === currentCdsId;
-            }); // swap
-            if (currentCdsId && cdsIdx >= 0) {
-              ttph = elementJs.structure_json.tempPlaceholders[0];
-              elementJs.structure_json.tempPlaceholders[0] = elementJs.structure_json.tempPlaceholders[cdsIdx];
-              elementJs.structure_json.tempPlaceholders[cdsIdx] = ttph;
-            }
-          }
-          // make placeholders of element and tempPlaceholder
-          updatedStructureJson = _objectSpread(_objectSpread({}, elementJs.structure_json), (_elementJs$structure_ = (_elementJs$structure_2 = elementJs.structure_json) === null || _elementJs$structure_2 === void 0 || (_elementJs$structure_2 = _elementJs$structure_2.tempPlaceholders[0]) === null || _elementJs$structure_2 === void 0 ? void 0 : _elementJs$structure_2.structure) !== null && _elementJs$structure_ !== void 0 ? _elementJs$structure_ : {});
-          elementJs.structure_json = updatedStructureJson;
-          elementJs = _objectSpread(_objectSpread({}, elementJs), {}, {
-            cds: {
-              data: [_objectSpread({}, elementJs.customer_property)],
-              itemID: elementJs.itemID
-            }
-          });
-          if (isEmpty((_elementJs$structure_3 = elementJs.structure_json) === null || _elementJs$structure_3 === void 0 ? void 0 : _elementJs$structure_3.tempPlaceholders)) {
-            _context7.next = 4;
-            break;
-          }
-          _context7.next = 3;
-          return updateCabinetPayload(elementJs);
-        case 3:
-          elementJs = _context7.sent;
-        case 4:
-          elementJs = _objectSpread(_objectSpread({}, elementJs), {}, {
-            outlineSVGData: outlineSVGData,
-            type: elementJs.type,
-            render2DItem: render2DItem
-          });
-          if (elementJs.type === 'appliance' || elementJs.type === 'furnishing') elementJs.render3DItem = render3DApplianceItem;else if (elementJs.type === 'lighting') elementJs.render3DItem = render3DLightingItem;else elementJs.render3DItem = render3DItem;
-
-          /***** join new tempPlaceholder to the old element - start *****/
-          // get catalog item by itemID
-          catalogElements = state.getIn(['catalog', 'elements']).toJS();
-          catalogElementKeys = Object.keys(catalogElements);
-          catalogItem = null;
-          k = 0;
-        case 5:
-          if (!(k < catalogElementKeys.length)) {
-            _context7.next = 7;
-            break;
-          }
-          if (!(((_catalogElements$cata = catalogElements[catalogElementKeys[k]]) === null || _catalogElements$cata === void 0 ? void 0 : _catalogElements$cata.itemID) === elementJs.itemID)) {
-            _context7.next = 6;
-            break;
-          }
-          catalogItem = catalogElements[catalogElementKeys[k]];
-          return _context7.abrupt("continue", 7);
-        case 6:
-          k++;
-          _context7.next = 5;
-          break;
-        case 7:
-          // get old tempPlaceholder array from catalog item
-          tempPlaceholderArray = null;
-          if (!isEmpty(catalogItem)) {
-            tempPlaceholderArray = (_catalogItem$structur = catalogItem.structure_json) === null || _catalogItem$structur === void 0 ? void 0 : _catalogItem$structur.tempPlaceholders;
-          }
-
-          // join new tempPlaceholder array to old one
-          newTempPlaceholderArray = [];
-          (_elementJs3 = elementJs) === null || _elementJs3 === void 0 || (_elementJs3 = _elementJs3.structure_json) === null || _elementJs3 === void 0 || (_elementJs3 = _elementJs3.tempPlaceholders) === null || _elementJs3 === void 0 || _elementJs3.forEach(function (tph) {
-            var _tempPlaceholderArray;
-            if (!((_tempPlaceholderArray = tempPlaceholderArray) !== null && _tempPlaceholderArray !== void 0 && _tempPlaceholderArray.some(function (otph) {
-              return otph.id === tph.id;
-            }))) newTempPlaceholderArray.push(tph);
-          });
-          mergedTempPlaceholder = null;
-          if (isEmpty(tempPlaceholderArray)) mergedTempPlaceholder = newTempPlaceholderArray;else if (isEmpty(newTempPlaceholderArray)) mergedTempPlaceholder = tempPlaceholderArray;else mergedTempPlaceholder = [].concat(_toConsumableArray(tempPlaceholderArray), newTempPlaceholderArray);
-
-          // rplace new array to the elementJS
-          if (!isEmpty(mergedTempPlaceholder)) elementJs.structure_json.tempPlaceholders = mergedTempPlaceholder;
-          /***** join new tempPlaceholder to the old element - end *****/
-
-          elementJs = exporter(elementJs);
-          if (catalogInstance !== null && catalogInstance !== void 0 && catalogInstance.validateElement(elementJs)) {
-            catalogInstance.registerElement(elementJs);
-            projectActions.addElementToCatalog(elementJs);
-          }
-        case 8:
-        case "end":
-          return _context7.stop();
-      }
-    }, _callee6);
-  }));
-  return _addItemToCatalog.apply(this, arguments);
-}
-function initAttrData(element, layer, state) {
-  element = _typeof(element.misc) === 'object' ? element.set('misc', new Map(element.misc)) : element;
-  switch (element.prototype) {
-    case 'items':
-      {
-        return new Map(element);
-      }
-    case 'lines':
-      {
-        var v_a = layer.vertices.get(element.vertices.get(0));
-        var v_b = layer.vertices.get(element.vertices.get(1));
-        var distance = GeometryUtils.pointsDistance(v_a.x, v_a.y, v_b.x, v_b.y);
-        var _unit = element.misc.get('_unitLength') || UNIT_INCH;
-        var _length = convert(distance).from(UNIT_CENTIMETER).to(_unit);
-        if (state.mode == MODE_DRAWING_LINE) {
-          return new Map({
-            vertexOne: v_a,
-            vertexTwo: v_b,
-            lineLength: new Map({
-              length: distance,
-              _length: _length,
-              _unit: _unit
-            }),
-            focus: element.focus
-          });
-        } else {
-          var allLines = layer.lines.toArray();
-          var relatedLine = allLines.filter(function (line) {
-            return line.vertices.toArray().includes(v_b.id) && line.id != element.id;
-          })[0];
-          var relatedVertexID = relatedLine && (relatedLine.vertices.toArray()[0] == v_b.id ? relatedLine.vertices.toArray()[1] : relatedLine.vertices.toArray()[0]);
-          var v_d = relatedVertexID && layer.getIn(['vertices', relatedVertexID]);
-          var lineToExtend = relatedVertexID && allLines.filter(function (line) {
-            return line.vertices.toArray().includes(relatedVertexID) && line.id != relatedLine.id;
-          })[0];
-          var v_c = lineToExtend && layer.getIn(['vertices', lineToExtend.vertices.toArray()[0] == v_d.id ? lineToExtend.vertices.toArray()[1] : lineToExtend.vertices.toArray()[0]]);
-          return new Map({
-            vertexOne: v_a,
-            vertexTwo: v_b,
-            vertexThree: v_c,
-            vertexFour: v_d,
-            lineToExtend: lineToExtend,
-            lineLength: new Map({
-              length: distance,
-              _length: _length,
-              _unit: _unit
-            }),
-            focus: element.focus
-          });
-        }
-      }
-    case 'holes':
-      {
-        var line = layer.lines.get(element.line);
-        var _layer$vertices$get = layer.vertices.get(line.vertices.get(0)),
-          x0 = _layer$vertices$get.x,
-          y0 = _layer$vertices$get.y;
-        var _layer$vertices$get2 = layer.vertices.get(line.vertices.get(1)),
-          x1 = _layer$vertices$get2.x,
-          y1 = _layer$vertices$get2.y;
-        var lineLength = GeometryUtils.pointsDistance(x0, y0, x1, y1);
-        var startAt = lineLength * element.offset - element.properties.get('width').get('length') / 2;
-        var endAt = lineLength - lineLength * element.offset - element.properties.get('width').get('length') / 2;
-        var _unitA = element.misc.get('_unitA') || UNIT_INCH;
-        var _lengthA = convert(x0 > x1 ? endAt : startAt).from(UNIT_CENTIMETER).to(_unitA);
-        var _unitB = element.misc.get('_unitB') || UNIT_INCH;
-        var _lengthB = convert(x0 > x1 ? startAt : endAt).from(UNIT_CENTIMETER).to(_unitB);
-        return new Map({
-          offset: element.offset,
-          offsetA: new Map({
-            length: MathUtils.toFixedFloat(x0 > x1 ? endAt : startAt, PRECISION),
-            _length: MathUtils.toFixedFloat(_lengthA, PRECISION),
-            _unit: _unitA
-          }),
-          offsetB: new Map({
-            length: MathUtils.toFixedFloat(x0 > x1 ? startAt : endAt, PRECISION),
-            _length: MathUtils.toFixedFloat(_lengthB, PRECISION),
-            _unit: _unitB
-          })
-        });
-      }
-    case 'areas':
-      {
-        return new Map({});
-      }
-    default:
-      return null;
-  }
-}
-// Get properties of current selected element
-function initPropData(element, catalog) {
-  var mapped = {};
-  if (!catalog.elements.hasOwnProperty(element.type) && !(!catalog.elements[element.type] && !!catalog.elements[returnReplaceableDeepSearchType(element.type)])) {
-    console.log("Last Selected ".concat(element.type, " Element does not exist in catalog."));
-    return new Map(mapped);
-  }
-  var catalogElement = catalog.getElement(element.type);
-  var isFiller = catalogElement.long_name ? catalogElement.long_name.toUpperCase().includes('FILLER') : false;
-  if (isFiller) {
-    var height = {
-      defaultValue: element.properties.get('height').toJS(),
-      label: 'Height',
-      type: 'length-measure'
-    };
-    var depth = {
-      defaultValue: element.properties.get('depth').toJS(),
-      label: 'Depth',
-      type: 'length-measure'
-    };
-    catalogElement.properties = {
-      altitude: catalogElement.properties.altitude,
-      width: catalogElement.properties.width,
-      height: height,
-      depth: depth,
-      flip_doorhandle: catalogElement.properties.flip_doorhandle,
-      resize_and_scaling: catalogElement.properties.resize_and_scaling
-    };
-  }
-  for (var name in catalogElement.properties) {
-    mapped[name] = new Map({
-      currentValue: element.properties.has(name) ? element.properties.get(name) : fromJS(catalogElement.properties[name].defaultValue),
-      configs: catalogElement.properties[name]
-    });
-  }
-  return new Map(mapped);
-}
-function updateAttributeOfSelectedElement(element, attrPayload, state, layer, catalog, projectActions) {
-  var _attributesFormData;
-  var callback = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : null;
-  var layerID = state.scene.selectedLayer;
-  var layerUnit = state.getIn(['scene', 'layers', layerID, 'unit']);
-  var attributesFormData = initAttrData(element, layer, state);
-  var value = attrPayload.value;
-  var attributeName = attrPayload.attributeName;
-  // pre process
-  if (attributeName === ATT_ITEM_POS) {
-    // calculate the new position of movement
-    var rotRad = (value.directionAng + element.rotation) / 180 * Math.PI;
-    var newX = element.x + convert((value.oldDistance - value.newDistance) * Math.cos(rotRad)).from(layerUnit).to('cm');
-    var newY = element.y + convert((value.oldDistance - value.newDistance) * Math.sin(rotRad)).from(layerUnit).to('cm');
-    value = {
-      x: newX,
-      y: newY
-    };
-  } else if (attributeName === ATT_LINE_LENGTH || attributeName === ATT_HOLE_OFFSET_A || attributeName === ATT_HOLE_OFFSET_B) {
-    var att = attributesFormData.has(attributeName) ? attributesFormData.get(attributeName) : element[attributeName];
-    if (att) value = att.merge({
-      _length: value,
-      _unit: layerUnit,
-      length: convert(value).from(layerUnit).to(UNIT_CENTIMETER)
-    });
-  }
-  // make the new attrivutes
-  switch (element.prototype) {
-    case 'items':
-      {
-        if (attributeName == ATT_ITEM_POS) {
-          var xVal = value.x;
-          var yVal = value.y;
-          attributesFormData = attributesFormData.set('x', xVal);
-          attributesFormData = attributesFormData.set('y', yVal);
-        } else {
-          attributesFormData = attributesFormData.set(attributeName, value);
-        }
-        // update the distances from wall
-        var _GeometryUtils$calcDi = GeometryUtils.calcDistancesFromItemToWalls(attributesFormData, layer),
-          PointArray = _GeometryUtils$calcDi.PointArray;
-        attributesFormData = attributesFormData.set('distArray', PointArray);
-        break;
-      }
-    case 'lines':
-      {
-        switch (attributeName) {
-          case ATT_LINE_LENGTH:
-            {
-              var v_0 = attributesFormData.get('vertexOne');
-              var v_1 = attributesFormData.get('vertexTwo');
-              var v_b_new = GeometryUtils.extendLine(v_0.x, v_0.y, v_1.x, v_1.y, value.get('length'), PRECISION);
-              attributesFormData = attributesFormData.withMutations(function (attr) {
-                attr.set('vertexTwo', v_1.merge(v_b_new));
-                attr.set('lineLength', value);
-              });
-              break;
-            }
-          case ATT_VERTEXT_ONE:
-          case ATT_VERTEXT_TWO:
-            {
-              attributesFormData = attributesFormData.withMutations(function (attr) {
-                attr.set(attributeName, attr.get(attributeName).merge(value));
-                var newDistance = GeometryUtils.verticesDistance(attr.get('vertexOne'), attr.get('vertexTwo'));
-                attr.mergeIn(['lineLength'], attr.get('lineLength').merge({
-                  length: newDistance,
-                  _length: convert(newDistance).from(UNIT_CENTIMETER).to(attr.get('lineLength').get('_unit'))
-                }));
-              });
-              break;
-            }
-          default:
-            {
-              attributesFormData = attributesFormData.set(attributeName, value);
-              break;
-            }
-        }
-        break;
-      }
-    case 'holes':
-      {
-        switch (attributeName) {
-          case ATT_HOLE_OFFSET_A:
-            {
-              var line = layer.lines.get(element.line);
-              var _layer$vertices$get3 = layer.vertices.get(line.vertices.get(0)),
-                x0 = _layer$vertices$get3.x,
-                y0 = _layer$vertices$get3.y;
-              var _layer$vertices$get4 = layer.vertices.get(line.vertices.get(1)),
-                x1 = _layer$vertices$get4.x,
-                y1 = _layer$vertices$get4.y;
-              var alpha = GeometryUtils.angleBetweenTwoPoints(x0, y0, x1, y1);
-              var lineLength = GeometryUtils.pointsDistance(x0, y0, x1, y1);
-              var widthLength = element.properties.get('width').get('length');
-              var halfWidthLength = widthLength / 2;
-              var lengthValue = value.get('length');
-              lengthValue = Math.max(lengthValue, 0);
-              lengthValue = Math.min(lengthValue, lineLength - widthLength);
-              var xp = (lengthValue + halfWidthLength) * Math.cos(alpha) + x0;
-              var yp = (lengthValue + halfWidthLength) * Math.sin(alpha) + y0;
-              var offset = GeometryUtils.pointPositionOnLineSegment(x0, y0, x1, y1, xp, yp);
-              /*
-              if (x0 > x1) offset = 1 - offset;
-              */
-              var endAt = MathUtils.toFixedFloat(lineLength - lineLength * offset - halfWidthLength, PRECISION);
-              var offsetUnit = attributesFormData.getIn(['offsetB', '_unit']);
-              var offsetB = new Map({
-                length: endAt,
-                _length: convert(endAt).from(UNIT_CENTIMETER).to(offsetUnit),
-                _unit: offsetUnit
-              });
-              attributesFormData = attributesFormData.set('offsetB', offsetB).set('offset', offset);
-              var offsetAttribute = new Map({
-                length: MathUtils.toFixedFloat(lengthValue, PRECISION),
-                _unit: value.get('_unit'),
-                _length: MathUtils.toFixedFloat(convert(lengthValue).from(UNIT_CENTIMETER).to(value.get('_unit')), PRECISION)
-              });
-              attributesFormData = attributesFormData.set(attributeName, offsetAttribute);
-              break;
-            }
-          case ATT_HOLE_OFFSET_B:
-            {
-              var _line = layer.lines.get(element.line);
-              var _layer$vertices$get5 = layer.vertices.get(_line.vertices.get(0)),
-                _x9 = _layer$vertices$get5.x,
-                _y = _layer$vertices$get5.y;
-              var _layer$vertices$get6 = layer.vertices.get(_line.vertices.get(1)),
-                _x0 = _layer$vertices$get6.x,
-                _y2 = _layer$vertices$get6.y;
-              var _alpha = GeometryUtils.angleBetweenTwoPoints(_x9, _y, _x0, _y2);
-              var _lineLength = GeometryUtils.pointsDistance(_x9, _y, _x0, _y2);
-              var _widthLength = element.properties.get('width').get('length');
-              var _halfWidthLength = _widthLength / 2;
-              var _lengthValue = value.get('length');
-              _lengthValue = Math.max(_lengthValue, 0);
-              _lengthValue = Math.min(_lengthValue, _lineLength - _widthLength);
-              var _xp = _x0 - (_lengthValue + _halfWidthLength) * Math.cos(_alpha);
-              var _yp = _y2 - (_lengthValue + _halfWidthLength) * Math.sin(_alpha);
-              var _offset = GeometryUtils.pointPositionOnLineSegment(_x9, _y, _x0, _y2, _xp, _yp);
-              /*
-              if (x0 > x1) offset = 1 - offset;
-              */
-              var startAt = MathUtils.toFixedFloat(_lineLength * _offset - _halfWidthLength, PRECISION);
-              var _offsetUnit = attributesFormData.getIn(['offsetA', '_unit']);
-              var offsetA = new Map({
-                length: startAt,
-                _length: convert(startAt).from(UNIT_CENTIMETER).to(_offsetUnit),
-                _unit: _offsetUnit
-              });
-              attributesFormData = attributesFormData.set('offsetA', offsetA).set('offset', _offset);
-              var _offsetAttribute = new Map({
-                length: MathUtils.toFixedFloat(_lengthValue, PRECISION),
-                _unit: value.get('_unit'),
-                _length: MathUtils.toFixedFloat(convert(_lengthValue).from(UNIT_CENTIMETER).to(value.get('_unit')), PRECISION)
-              });
-              attributesFormData = attributesFormData.set(attributeName, _offsetAttribute);
-              break;
-            }
-          default:
-            {
-              attributesFormData = attributesFormData.set(attributeName, value);
-              break;
-            }
-        }
-        break;
-      }
-    default:
-      break;
-  }
-
-  // update attribute action
-  switch (element.prototype) {
-    case 'items':
-      {
-        projectActions.setItemsAttributes(attributesFormData);
-        break;
-      }
-    case 'lines':
-      {
-        projectActions.setLinesAttributes(attributesFormData);
-        break;
-      }
-    case 'holes':
-      {
-        projectActions.setHolesAttributes(attributesFormData);
-        break;
-      }
-  }
-
-  // invoke callback
-  if (callback) callback((_attributesFormData = attributesFormData) === null || _attributesFormData === void 0 ? void 0 : _attributesFormData.toJS());
-}
-function updatePropertyOfSelectedElement(element, propertyPayload, catalog,
-// class instance of Catalog, get from props
-projectActions) {
-  var _propertiesFormData;
-  var callback = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
-  var propertiesFormData = initPropData(element, catalog);
-  var value = propertyPayload.value;
-  var propertyName = propertyPayload.propertyName;
-  // make new properties
-  if (propertyName === PROP_FLIP_DOOR_HANDLE && element.properties.get(PROP_OPEN_DOORS)) {
-    alert('Doors are already open.');
-    return;
-  }
-  propertiesFormData = propertiesFormData.setIn([propertyName, 'currentValue'], value);
-
-  // update property action
-  if (propertiesFormData) {
-    var properties = propertiesFormData.map(function (data) {
-      return data.get('currentValue');
-    });
-    projectActions.setProperties(properties);
-  }
-
-  // invoke callback
-  if (callback) callback((_propertiesFormData = propertiesFormData) === null || _propertiesFormData === void 0 ? void 0 : _propertiesFormData.toJS());
-}
-function getElement(objProps, state) {
-  var layerID = state.scene.selectedLayer;
-  var curObject = null;
-  if (!isEmpty(objProps === null || objProps === void 0 ? void 0 : objProps.elementPrototype) && !isEmpty(objProps === null || objProps === void 0 ? void 0 : objProps.elementId)) curObject = state.getIn(['scene', 'layers', layerID, objProps.elementPrototype, objProps.elementId]);else {
-    // if no specified object property then get the first selected element
-    var layer = state.scene.layers.get(state.scene.selectedLayer);
-    var selected = [];
-    layer.selected.forEach(function (data, prototype) {
-      if (prototype == 'vertices') return;
-      if (data.size > 0) {
-        var values = data.toJS();
-        for (var i = 0; i < values.length; i++) {
-          selected.push({
-            type: prototype,
-            id: values[i]
-          });
-        }
-      }
-    });
-    if (selected.length === 1) {
-      var selData = selected[0];
-      switch (selData.type) {
-        case ELEMENT_HOLE:
-          curObject = layer.holes.get(selData.id);
-          break;
-        case ELEMENT_ITEM:
-          curObject = layer.items.get(selData.id);
-          break;
-        case ELEMENT_LINE:
-          curObject = layer.lines.get(selData.id);
-          break;
-      }
-    }
-  }
-  return curObject;
-}
-function loadMoldingSvg(_x1) {
-  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) {
-        case 0:
-          return _context8.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
-              return resolve();
-            }
-            var loader = new SVGLoader();
-            loader.load(url, function (data) {
-              var _data$xml$viewBox$ani, _data$xml, _data$xml$viewBox$ani2, _data$xml2;
-              molding.data = {
-                paths: data.paths,
-                svg_width: (_data$xml$viewBox$ani = (_data$xml = data.xml) === null || _data$xml === void 0 || (_data$xml = _data$xml.viewBox) === null || _data$xml === void 0 || (_data$xml = _data$xml.animVal) === null || _data$xml === void 0 ? void 0 : _data$xml.width) !== null && _data$xml$viewBox$ani !== void 0 ? _data$xml$viewBox$ani : 0,
-                svg_height: (_data$xml$viewBox$ani2 = (_data$xml2 = data.xml) === null || _data$xml2 === void 0 || (_data$xml2 = _data$xml2.viewBox) === null || _data$xml2 === void 0 || (_data$xml2 = _data$xml2.animVal) === null || _data$xml2 === void 0 ? void 0 : _data$xml2.height) !== null && _data$xml$viewBox$ani2 !== void 0 ? _data$xml$viewBox$ani2 : 0
-              };
-              resolve();
-            }, null, function (error) {
-              console.error(error);
-              reject(error);
-            });
-          }));
-        case 1:
-        case "end":
-          return _context8.stop();
-      }
-    }, _callee7);
-  }));
-  return _loadMoldingSvg.apply(this, arguments);
-}
-function setFinishing(props, state, payload) {
-  switch (payload.category) {
-    case FINISHING_TYPE.WALL_COLOR:
-      if (state.mode !== MODE_ELEVATION_VIEW) props.itemsActions.setWallColor(payload.color);
-      break;
-    case FINISHING_TYPE.COUNTER_TOP:
-      props.itemsActions.setCounterTop({
-        uri: payload.texture
-      });
-      break;
-    case FINISHING_TYPE.FLOOR_STYLE:
-      if (state.mode !== MODE_ELEVATION_VIEW) props.areaActions.setFloorStyles({
-        uri: payload.texture
-      });
-      break;
-    case FINISHING_TYPE.BACKSPLASH:
-      if (state.mode !== MODE_ELEVATION_VIEW) props.itemsActions.setBacksplash({
-        uri: payload.texture
-      });
-      break;
-    case FINISHING_TYPE.DOOR_HANDLE:
-      props.itemsActions.setDoorHandle(payload.gltf);
-      break;
-  }
-}
-function moveAndRotatePan2D3D(eventType, props, payload, state) {
-  if (eventType === EXTERNAL_EVENT_MOVE_PAN) {
-    var moveType = payload.moveType,
-      moveValue = payload.moveValue;
-    var value = state.getIn(['viewer2D']).toJS();
-    if (state.mode === MODE_IDLE) {
-      switch (moveType) {
-        case TOP:
-          value.f -= moveValue;
-          break;
-        case BOTTOM:
-          value.f += moveValue;
-          break;
-        case RIGHT:
-          value.e += moveValue;
-          break;
-        case LEFT:
-          value.e -= moveValue;
-          break;
-      }
-      updateViwer2D(value, props.viewer2DActions);
-    } else if (state.mode === MODE_IDLE_3D) {
-      switch (moveType) {
-        case TOP:
-          window.interval = setTimeout(function () {
-            window.tDKeyDown({
-              keyCode: 38
-            });
-          }, 50);
-          break;
-        case BOTTOM:
-          window.interval = setTimeout(function () {
-            window.tDKeyDown({
-              keyCode: 40
-            });
-          }, 50);
-          break;
-        case RIGHT:
-          window.interval = setTimeout(function () {
-            window.tDKeyDown({
-              keyCode: 37
-            });
-          }, 50);
-          break;
-        case LEFT:
-          window.interval = setTimeout(function () {
-            window.tDKeyDown({
-              keyCode: 39
-            });
-          }, 50);
-          break;
-      }
-    }
-  } else if (eventType === EXTERNAL_EVENT_ROTATE_PAN) {
-    var rotateType = payload.rotateType;
-    switch (rotateType) {
-      case TOP:
-        window.interval = setTimeout(function () {
-          window.SPKeyDown({
-            keyCode: 87
-          });
-        }, 50);
-        break;
-      case BOTTOM:
-        window.interval = setTimeout(function () {
-          window.SPKeyDown({
-            keyCode: 83
-          });
-        }, 50);
-        break;
-      case RIGHT:
-        window.interval = setTimeout(function () {
-          window.SPKeyDown({
-            keyCode: 68
-          });
-        }, 50);
-        break;
-      case LEFT:
-        window.interval = setTimeout(function () {
-          window.SPKeyDown({
-            keyCode: 65
-          });
-        }, 50);
-        break;
-    }
-  }
-}
-function mergeSameElements(projectItemsCatalog) {
-  var result = [];
-  var _loop = function _loop(i) {
-    var idx = result.findIndex(function (v) {
-      return v.itemID === projectItemsCatalog[i].itemID;
-    });
-    if (idx < 0) result.push(projectItemsCatalog[i]);else {
-      var _loop2 = function _loop2(j) {
-        var _result$idx$structure, _result$idx$structure2;
-        var idx2 = (_result$idx$structure = result[idx].structure_json) === null || _result$idx$structure === void 0 || (_result$idx$structure = _result$idx$structure.tempPlaceholders) === null || _result$idx$structure === void 0 ? void 0 : _result$idx$structure.findIndex(function (v) {
-          return v.id === projectItemsCatalog[i].structure_json.tempPlaceholders[j].id;
-        });
-        if (idx2 < 0) (_result$idx$structure2 = result[idx].structure_json) === null || _result$idx$structure2 === void 0 || (_result$idx$structure2 = _result$idx$structure2.tempPlaceholders) === null || _result$idx$structure2 === void 0 || _result$idx$structure2.push(projectItemsCatalog[i].structure_json.tempPlaceholders[j]);else result[idx].structure_json.tempPlaceholders[idx2] = projectItemsCatalog[i].structure_json.tempPlaceholders[j];
-      };
-      for (var j = 0; j < ((_projectItemsCatalog$ = projectItemsCatalog[i].structure_json) === null || _projectItemsCatalog$ === void 0 || (_projectItemsCatalog$ = _projectItemsCatalog$.tempPlaceholders) === null || _projectItemsCatalog$ === void 0 ? void 0 : _projectItemsCatalog$.length); j++) {
-        var _projectItemsCatalog$;
-        _loop2(j);
-      }
-    }
-  };
-  for (var i = 0; i < (projectItemsCatalog === null || projectItemsCatalog === void 0 ? void 0 : projectItemsCatalog.length); i++) {
-    _loop(i);
-  }
-  return result;
-}
-export function handleExternalEvent(_x10) {
-  return _handleExternalEvent.apply(this, arguments);
-}
-function _handleExternalEvent() {
-  _handleExternalEvent = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee0(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, _Object$keys, _evt$payload5, doorStyle, itemCDS, isAll, _layerId, _cdsItems, allItems, selectedItemId, _itemKeys, _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;
-    return _regeneratorRuntime.wrap(function (_context11) {
-      while (1) switch (_context11.prev = _context11.next) {
-        case 0:
-          // console.log('***external event****', props.externalEvent);
-          evt = props.externalEvent;
-          state = getPlannerStateFromProps(props);
-          if (state) {
-            _context11.next = 1;
-            break;
-          }
-          return _context11.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 ? 21 : _t5 === EXTERNAL_EVENT_ZOOM_IN ? 22 : _t5 === EXTERNAL_EVENT_ZOOM_OUT ? 23 : _t5 === EXTERNAL_EVENT_CENTERING_2D ? 24 : _t5 === EXTERNAL_EVENT_UNDO ? 25 : _t5 === EXTERNAL_EVENT_REDO ? 26 : _t5 === EXTERNAL_EVENT_SET_MOLDING ? 27 : _t5 === EXTERNAL_EVENT_DUPLICATE_ELEMENT ? 29 : _t5 === EXTERNAL_EVENT_DELETE_ELEMENT ? 30 : _t5 === EXTERNAL_EVENT_PROJECT_SETTING ? 31 : _t5 === EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? 40 : _t5 === EXTERNAL_EVENT_UPDATE_PROPERTY ? 40 : _t5 === EXTERNAL_EVENT_REPLACE_CABINET ? 41 : _t5 === EXTERNAL_EVENT_SET_FINISHING ? 43 : _t5 === EXTERNAL_EVENT_SYNC_SCENE ? 44 : 45;
-          break;
-        case 2:
-          if (!(evt !== null && evt !== void 0 && evt.payload)) {
-            _context11.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() {
-            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) {
-                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')) {
-                    it.properties.altitude.length = convert(it.properties.altitude._length).from(it.properties.altitude._unit).to('cm');
-                  }
-                  /////////
-                  if (!cdsItems.some(function (v) {
-                    var _it$doorStyle;
-                    return it.itemID === v.itemID && it.name === v.name && ((_it$doorStyle = it.doorStyle) === null || _it$doorStyle === void 0 || (_it$doorStyle = _it$doorStyle.doorStyles) === null || _it$doorStyle === void 0 ? void 0 : _it$doorStyle.cabinet_door_style_id) === v.cdsId;
-                  })) cdsItems.push({
-                    itemID: it.itemID,
-                    prototype: it.prototype,
-                    category: it.category,
-                    name: it.name,
-                    type: it.type,
-                    sku_number: it.sku_number,
-                    cdsId: (_it$doorStyle2 = it.doorStyle) === null || _it$doorStyle2 === void 0 || (_it$doorStyle2 = _it$doorStyle2.doorStyles) === null || _it$doorStyle2 === void 0 ? void 0 : _it$doorStyle2.cabinet_door_style_id
-                  });
-                case 1:
-                case "end":
-                  return _context0.stop();
-              }
-            }, _loop6);
-          });
-          i = 0;
-        case 3:
-          if (!(i < itemKeys.length)) {
-            _context11.next = 5;
-            break;
-          }
-          return _context11.delegateYield(_loop6(), "t0", 4);
-        case 4:
-          i++;
-          _context11.next = 3;
-          break;
-        case 5:
-          newScene = new Scene(evt === null || evt === void 0 ? void 0 : evt.payload);
-          tempState = new State({
-            scene: newScene.toJS(),
-            catalog: (_state$catalog = state.catalog) === null || _state$catalog === void 0 ? void 0 : _state$catalog.toJS()
-          }); // request item catalog data to host app
-          if (cdsItems.length > 0) {
-            (_props$onInternalEven = props.onInternalEvent) === null || _props$onInternalEven === void 0 || _props$onInternalEven.call(props, {
-              type: INTERNAL_EVENT_ITEMS_CATALOG,
-              value: {
-                cdsItems: cdsItems
-              }
-            }, /*#__PURE__*/function () {
-              var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee8(result) {
-                var rt, _i;
-                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);
-                      _i = 0;
-                    case 1:
-                      if (!(_i < (rt === null || rt === void 0 ? void 0 : rt.length))) {
-                        _context9.next = 3;
-                        break;
-                      }
-                      _context9.next = 2;
-                      return addItemToCatalog(rt[_i], tempState, props.catalog, props.projectActions);
-                    case 2:
-                      _i++;
-                      _context9.next = 1;
-                      break;
-                    case 3:
-                      props.projectActions.loadProject(evt.payload);
-                    case 4:
-                    case "end":
-                      return _context9.stop();
-                  }
-                }, _callee8);
-              }));
-              return function (_x11) {
-                return _ref3.apply(this, arguments);
-              };
-            }());
-          } else props.projectActions.loadProject(evt.payload);
-        case 6:
-          return _context11.abrupt("continue", 45);
-        case 7:
-          props.projectActions.unselectAll();
-          props.projectActions.setMode(MODE_IDLE_3D);
-          return _context11.abrupt("continue", 45);
-        case 8:
-          props.projectActions.setMode(MODE_IDLE);
-          return _context11.abrupt("continue", 45);
-        case 9:
-          sLineCnt = layer.selected.lines.size;
-          if (sLineCnt > 0) props.projectActions.setMode(MODE_ELEVATION_VIEW);
-          return _context11.abrupt("continue", 45);
-        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", 45);
-        case 11:
-          if (isEmpty(evt === null || evt === void 0 ? void 0 : evt.payload)) {
-            _context11.next = 13;
-            break;
-          }
-          element = evt.payload;
-          _context11.next = 12;
-          return addItemToCatalog(element, state, props.catalog, props.projectActions);
-        case 12:
-          // start drawing item
-          if (ARRAY_3D_MODES.includes(state.mode)) {
-            // in 3d view
-            props.itemsActions.selectToolDrawingItem3D(element.name);
-          } else {
-            // in 2d view
-            // create cabinet
-            props.itemsActions.selectToolDrawingItem(element.name);
-            // mapping the initial position of client coord to viewer2D coord
-            _evt$payload$initialP = evt.payload.initialPosition, mouseX = _evt$payload$initialP.mouseX, mouseY = _evt$payload$initialP.mouseY;
-            v2d = (_state$viewer2D = state.viewer2D) === null || _state$viewer2D === void 0 ? void 0 : _state$viewer2D.toJS();
-            if (mouseX && mouseY && v2d) {
-              vPosX = (mouseX - v2d.e) / v2d.a;
-              vPosY = (mouseY - v2d.f) / v2d.d;
-              layerID = state.scene.selectedLayer; // move cabinet to initial position
-              props.itemsActions.updateDrawingItem(layerID, vPosX, -vPosY + state.scene.height, true);
-            }
-          }
-          props.projectActions.pushLastSelectedCatalogElementToHistory(element);
-          props.projectActions.setIsCabinetDrawing(true);
-        case 13:
-          return _context11.abrupt("continue", 45);
-        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", 45);
-        case 15:
-          moveAndRotatePan2D3D(evt.type, props, evt.payload, state);
-          return _context11.abrupt("continue", 45);
-        case 16:
-          defaulTitle = 'Untitle';
-          props.projectActions.newProject();
-          props.projectActions.rename(defaulTitle);
-          return _context11.abrupt("continue", 45);
-        case 17:
-          _evt$payload5 = evt.payload, doorStyle = _evt$payload5.doorStyle, itemCDS = _evt$payload5.itemCDS, isAll = _evt$payload5.isAll; // prepare item data request
-          _layerId = state.getIn(['scene', 'selectedLayer']);
-          _cdsItems = [];
-          allItems = state.getIn(['scene', 'layers', _layerId, 'items']).toJS();
-          selectedItemId = state.getIn(['scene', 'layers', _layerId]).selected.items.toJS()[0];
-          _itemKeys = isAll ? (_Object$keys = Object.keys(allItems)) !== null && _Object$keys !== void 0 ? _Object$keys : [] : [selectedItemId];
-          _loop7 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop7() {
-            var _itemCDS$find;
-            var item, cdsId;
-            return _regeneratorRuntime.wrap(function (_context10) {
-              while (1) switch (_context10.prev = _context10.next) {
-                case 0:
-                  item = allItems[_itemKeys[_i2]];
-                  cdsId = (_itemCDS$find = itemCDS.find(function (itCDS) {
-                    return itCDS.itemID === item.itemID;
-                  })) === null || _itemCDS$find === void 0 ? void 0 : _itemCDS$find.cabinet_door_style_id;
-                  if (cdsId && !_cdsItems.some(function (v) {
-                    return item.itemID === v.itemID && item.name === v.name && cdsId === v.cdsId;
-                  })) _cdsItems.push({
-                    itemID: item.itemID,
-                    prototype: item.prototype,
-                    category: item.category,
-                    name: item.name,
-                    type: item.type,
-                    sku_number: item.sku_number,
-                    cdsId: cdsId
-                  });
-                case 1:
-                case "end":
-                  return _context10.stop();
-              }
-            }, _loop7);
-          });
-          _i2 = 0;
-        case 18:
-          if (!(_i2 < _itemKeys.length)) {
-            _context11.next = 20;
-            break;
-          }
-          return _context11.delegateYield(_loop7(), "t1", 19);
-        case 19:
-          _i2++;
-          _context11.next = 18;
-          break;
-        case 20:
-          // request item catalog data to host app
-          if (_cdsItems.length > 0) {
-            (_props$onInternalEven2 = props.onInternalEvent) === null || _props$onInternalEven2 === void 0 || _props$onInternalEven2.call(props, {
-              type: INTERNAL_EVENT_ITEMS_CATALOG,
-              value: {
-                cdsItems: _cdsItems
-              }
-            }, /*#__PURE__*/function () {
-              var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee9(result) {
-                var rt, _i3;
-                return _regeneratorRuntime.wrap(function (_context1) {
-                  while (1) switch (_context1.prev = _context1.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;
-                        break;
-                      }
-                      _context1.next = 2;
-                      return addItemToCatalog(rt[_i3], state, props.catalog, props.projectActions);
-                    case 2:
-                      _i3++;
-                      _context1.next = 1;
-                      break;
-                    case 3:
-                      props.itemsActions.setDoorStyle(doorStyle, itemCDS, isAll);
-                    case 4:
-                    case "end":
-                      return _context1.stop();
-                  }
-                }, _callee9);
-              }));
-              return function (_x12) {
-                return _ref4.apply(this, arguments);
-              };
-            }());
-          } else props.itemsActions.setDoorStyle(doorStyle, itemCDS, isAll);
-          return _context11.abrupt("continue", 45);
-        case 21:
-          _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", 45);
-        case 22:
-          value = state.getIn(['viewer2D']).toJS();
-          value.a += 0.1;
-          value.d += 0.1;
-          value.e -= value.SVGWidth * 0.1 / 2;
-          value.f -= value.SVGHeight * 0.1 / 2;
-          updateViwer2D(value, props.viewer2DActions);
-          return _context11.abrupt("continue", 45);
-        case 23:
-          _value = state.getIn(['viewer2D']).toJS();
-          _value.a -= 0.1;
-          _value.d -= 0.1;
-          _value.e += _value.SVGWidth * 0.1 / 2;
-          _value.f += _value.SVGHeight * 0.1 / 2;
-          updateViwer2D(_value, props.viewer2DActions);
-          return _context11.abrupt("continue", 45);
-        case 24:
-          centering2D(state, props.viewer2DActions);
-          return _context11.abrupt("continue", 45);
-        case 25:
-          props.projectActions.undo();
-          return _context11.abrupt("continue", 45);
-        case 26:
-          props.projectActions.redo();
-          return _context11.abrupt("continue", 45);
-        case 27:
-          _evt$payload7 = evt.payload, moldingInfo = _evt$payload7.moldingInfo, isGlobal = _evt$payload7.isGlobal;
-          _context11.next = 28;
-          return loadMoldingSvg(moldingInfo);
-        case 28:
-          props.itemsActions.setMolding(moldingInfo, isGlobal);
-          return _context11.abrupt("continue", 45);
-        case 29:
-          distElement = getElement(evt.payload, state);
-          if (distElement) props.itemsActions.duplicateSelected(distElement, props.onInternalEvent);
-          return _context11.abrupt("continue", 45);
-        case 30:
-          _distElement = getElement(evt.payload, state);
-          if (_distElement) props.projectActions.remove(_distElement);
-          return _context11.abrupt("continue", 45);
-        case 31:
-          _evt$payload8 = evt.payload, option = _evt$payload8.option, _value2 = _evt$payload8.value;
-          _t6 = option;
-          _context11.next = _t6 === PROJECT_SETTING_OPTION.CHANGE_MEASUREMENT_UNIT ? 32 : _t6 === PROJECT_SETTING_OPTION.UPDATE_CEIL_HEIGHT ? 33 : _t6 === PROJECT_SETTING_OPTION.CHANGE_WALL_LENGTH_MEASURE ? 34 : _t6 === PROJECT_SETTING_OPTION.CHANGE_BASE_CABINET_MEASURE ? 35 : _t6 === PROJECT_SETTING_OPTION.CHANGE_WALL_CABINET_MEASURE ? 36 : _t6 === PROJECT_SETTING_OPTION.CHANGE_WINDOW_DOOR_MEASURE ? 37 : 38;
-          break;
-        case 32:
-          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", 39);
-        case 33:
-          props.viewer2DActions.updateCeilHeight(_value2);
-          props.viewer3DActions.update3DCeilHeight(_value2);
-          return _context11.abrupt("continue", 39);
-        case 34:
-          props.viewer2DActions.changeWallLengthMeasure(_value2);
-          return _context11.abrupt("continue", 39);
-        case 35:
-          props.viewer2DActions.changeBaseCabinetMeasure(_value2);
-          return _context11.abrupt("continue", 39);
-        case 36:
-          props.viewer2DActions.changeWallCabinetMeasure(_value2);
-          return _context11.abrupt("continue", 39);
-        case 37:
-          props.viewer2DActions.changeWindowDoorMeasure(_value2);
-          return _context11.abrupt("continue", 39);
-        case 38:
-          return _context11.abrupt("continue", 39);
-        case 39:
-          return _context11.abrupt("continue", 45);
-        case 40:
-          _layerId2 = state.getIn(['scene', 'selectedLayer']);
-          _layer = state.getIn(['scene', 'layers', _layerId2]);
-          _layer$getIn = _layer.getIn(['selected']), selectedLines = _layer$getIn.lines, selectedHoles = _layer$getIn.holes, selectedItems = _layer$getIn.items;
-          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", 45);
-        case 41:
-          _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 = 42;
-          return addItemToCatalog(evt.payload.replaceItemInfo, state, props.catalog, props.projectActions);
-        case 42:
-          originalItemPos = {
-            rotation: originalItem.rotation,
-            selectedItemId: originalItem.id,
-            x: originalItem.x,
-            y: originalItem.y
-          };
-          replaceItem = {
-            name: evt === null || evt === void 0 || (_evt$payload0 = evt.payload) === null || _evt$payload0 === void 0 || (_evt$payload0 = _evt$payload0.replaceItemInfo) === null || _evt$payload0 === void 0 ? void 0 : _evt$payload0.name,
-            info: {
-              width: evt === null || evt === void 0 || (_evt$payload1 = evt.payload) === null || _evt$payload1 === void 0 || (_evt$payload1 = _evt$payload1.replaceItemInfo) === null || _evt$payload1 === void 0 || (_evt$payload1 = _evt$payload1.sizeinfo) === null || _evt$payload1 === void 0 ? void 0 : _evt$payload1.width,
-              height: evt === null || evt === void 0 || (_evt$payload10 = evt.payload) === null || _evt$payload10 === void 0 || (_evt$payload10 = _evt$payload10.replaceItemInfo) === null || _evt$payload10 === void 0 || (_evt$payload10 = _evt$payload10.sizeinfo) === null || _evt$payload10 === void 0 ? void 0 : _evt$payload10.height
-            }
-          };
-          props.itemsActions.replaceItem(originalItemPos, originalItem, replaceItem);
-          return _context11.abrupt("continue", 45);
-        case 43:
-          setFinishing(props, state, evt.payload);
-          return _context11.abrupt("continue", 45);
-        case 44:
-          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);
-          // 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,
-            value: {
-              scene: sceneData
-            }
-          });
-          return _context11.abrupt("continue", 45);
-        case 45:
-        case "end":
-          return _context11.stop();
-      }
-    }, _callee0);
-  }));
-  return _handleExternalEvent.apply(this, arguments);
-}