kitchen-simulator 1.0.0-DIY-1119

package/es/events/external/handleExternalEvent.util.js

@@ -0,0 +1,1099 @@
+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 _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+var _excluded = ["ccdf"];
+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 { MODE_DRAWING_LINE, ATT_ITEM_POS, ATT_LINE_LENGTH, ATT_VERTEXT_ONE, ATT_VERTEXT_TWO, ATT_HOLE_OFFSET_A, ATT_HOLE_OFFSET_B, UNIT_CENTIMETER, UNIT_INCH, PROP_FLIP_DOOR_HANDLE, PROP_OPEN_DOORS, ELEMENT_HOLE, ELEMENT_ITEM, ELEMENT_LINE } from "../../constants";
+import { isEmpty } from "../../utils/helper";
+import exporter from "../../catalog/utils/exporter";
+import { render2DItem, render3DItem, render3DApplianceItem, render3DLightingItem } from "../../catalog/utils/item-loader";
+import { convert } from "../../utils/convert-units-lite";
+import { GeometryUtils, MathUtils } from "../../utils/export";
+import { returnReplaceableDeepSearchType } from "../../components/viewer2d/utils";
+import { SVGLoader } from 'three/addons/loaders/SVGLoader';
+import { calcDistancesFromHoleToNearestOneOrWall } from "../../utils/geometry";
+import { loadJSONWithFallback } from "../../shared/domain/asset/load-asset-json";
+import { isCornerCabinet } from "../../shared/domain/cabinet-corner";
+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 __svgCache = new Map(); // url -> Promise<svgData|null>
+
+/********Parse TempPlaceholder from cabinetPayloadData **************/
+function parseTempPlaceholdersFromCabinetPayload(_x) {
+  return _parseTempPlaceholdersFromCabinetPayload.apply(this, arguments);
+}
+/***** Update cabinetPayloadData with updatedTempPlaceholders *****/
+function _parseTempPlaceholdersFromCabinetPayload() {
+  _parseTempPlaceholdersFromCabinetPayload = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(cabinetPayload) {
+    var _cabinetPayload$struc;
+    var keys, gltfEntries, temp, tempPlaceholdersData, k, _cabinetPayload$struc3, el, tempData, doorKey, drawerKey, fixedKey, doorPHs, drawerPHs, has_single_door, fixedPHs;
+    return _regeneratorRuntime.wrap(function (_context4) {
+      while (1) switch (_context4.prev = _context4.next) {
+        case 0:
+          keys = Object.keys((_cabinetPayload$struc = cabinetPayload.structure_json) !== null && _cabinetPayload$struc !== void 0 ? _cabinetPayload$struc : {}); // Load all referenced .gltf JSONs in parallel.
+          // NOTE: loadJSON() already has a per-URL promise cache, so duplicates are de-duped across calls.
+          gltfEntries = keys.map(function (name) {
+            var _cabinetPayload$struc2;
+            return {
+              name: name,
+              link: (_cabinetPayload$struc2 = cabinetPayload.structure_json) === null || _cabinetPayload$struc2 === void 0 ? void 0 : _cabinetPayload$struc2[name]
+            };
+          }).filter(function (_ref3) {
+            var _link$toString, _link$toString2;
+            var link = _ref3.link;
+            return (link === null || link === void 0 || (_link$toString = link.toString) === null || _link$toString === void 0 || (_link$toString = _link$toString.call(link)) === null || _link$toString === void 0 ? void 0 : _link$toString.includes('.gltf')) && (link === null || link === void 0 || (_link$toString2 = link.toString) === null || _link$toString2 === void 0 || (_link$toString2 = _link$toString2.call(link)) === null || _link$toString2 === void 0 ? void 0 : _link$toString2.startsWith('http'));
+          });
+          _context4.next = 1;
+          return Promise.all(gltfEntries.map(/*#__PURE__*/function () {
+            var _ref5 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(_ref4) {
+              var name, link, _t2, _t3;
+              return _regeneratorRuntime.wrap(function (_context3) {
+                while (1) switch (_context3.prev = _context3.next) {
+                  case 0:
+                    name = _ref4.name, link = _ref4.link;
+                    _t2 = name;
+                    _context3.next = 1;
+                    return loadJSONWithFallback(link);
+                  case 1:
+                    _t3 = _context3.sent;
+                    return _context3.abrupt("return", {
+                      name: _t2,
+                      data: _t3
+                    });
+                  case 2:
+                  case "end":
+                    return _context3.stop();
+                }
+              }, _callee3);
+            }));
+            return function (_x9) {
+              return _ref5.apply(this, arguments);
+            };
+          }()));
+        case 1:
+          temp = _context4.sent;
+          tempPlaceholdersData = [];
+          for (k = 0; 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); k++) {
+            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 _t$data;
+              var nodes = t === null || t === void 0 || (_t$data = t.data) === null || _t$data === void 0 ? void 0 : _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 _cabinetPayload$ccdf_;
+                      tempData['sink'] = tempData['sink'] || [];
+                      tempData['sink'].push(element.name);
+                      // Resolve sink asset via ccdf.assets3d based on placeholder_name
+                      var sinkPlaceholderName = sink_match[1]; // e.g. sink_farm_large
+                      var assets3d = cabinetPayload === null || cabinetPayload === void 0 || (_cabinetPayload$ccdf_ = cabinetPayload.ccdf_list) === null || _cabinetPayload$ccdf_ === void 0 || (_cabinetPayload$ccdf_ = _cabinetPayload$ccdf_.find(function (ccdf) {
+                        return ccdf.cabinet_id === cabinetPayload.itemID;
+                      })) === null || _cabinetPayload$ccdf_ === void 0 ? void 0 : _cabinetPayload$ccdf_.assets3d;
+                      var sinkAsset = !isEmpty(assets3d) && Array.isArray(assets3d) && assets3d.find(function (a) {
+                        return a && (a.placeholder_name === sinkPlaceholderName || a.placeholder_name.startsWith('sink_')) && a.gltf;
+                      });
+                      if (sinkAsset !== null && sinkAsset !== void 0 && sinkAsset.gltf && cabinetPayload !== null && cabinetPayload !== void 0 && cabinetPayload.structure_json) cabinetPayload.structure_json.sink = sinkAsset.gltf;
+                    } 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_temp$data$nodes, _ph_temp;
+                      var ph_drawer_door_handle = (_ph_temp$data$nodes = (_ph_temp = ph_temp) === null || _ph_temp === void 0 || (_ph_temp = _ph_temp.data) === null || _ph_temp === void 0 ? void 0 : _ph_temp.nodes) !== null && _ph_temp$data$nodes !== void 0 ? _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 _loop3 = function _loop3() {
+                      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++) {
+                      _loop3();
+                    }
+                  } 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 (isCornerCabinet(cabinetPayload)) {
+                      if (tempData['base_door' + t.name.slice(-2)] && 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)] && 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)] && 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 _loop4 = function _loop4() {
+                      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++) {
+                      _loop4();
+                    }
+                  } 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: el,
+              placeholders: tempData,
+              structure: cabinetPayload.structure_json.tempPlaceholders[k].structure
+            });
+          }
+          return _context4.abrupt("return", tempPlaceholdersData);
+        case 2:
+        case "end":
+          return _context4.stop();
+      }
+    }, _callee4);
+  }));
+  return _parseTempPlaceholdersFromCabinetPayload.apply(this, arguments);
+}
+function updateCabinetPayload(_x2) {
+  return _updateCabinetPayload.apply(this, arguments);
+}
+function _updateCabinetPayload() {
+  _updateCabinetPayload = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(cabinetPayload) {
+    var tempPlaceholders, cabinetPayloadKeys, i;
+    return _regeneratorRuntime.wrap(function (_context5) {
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          tempPlaceholders = [];
+          _context5.next = 1;
+          return parseTempPlaceholdersFromCabinetPayload(cabinetPayload);
+        case 1:
+          tempPlaceholders = _context5.sent;
+          cabinetPayloadKeys = Object.keys(cabinetPayload);
+          for (i = 0; i < cabinetPayloadKeys.length; i++) {
+            if (cabinetPayloadKeys[i] === 'structure_json') {
+              // cabinetPayload[cabinetPayloadKeys[i]]['placeholders'] =
+              //   cabinetPayload[cabinetPayloadKeys[i]]['tempPlaceholders'][0]
+              //     ?.placeholders ?? [];
+
+              cabinetPayload[cabinetPayloadKeys[i]]['placeholders'] = tempPlaceholders[0].placeholders;
+              cabinetPayload[cabinetPayloadKeys[i]]['tempPlaceholders'] = tempPlaceholders;
+            }
+          }
+          return _context5.abrupt("return", cabinetPayload);
+        case 2:
+        case "end":
+          return _context5.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(_x3) {
+    return _ref.apply(this, arguments);
+  };
+}();
+
+// Keep ccdf variants on the catalog definition as `ccdf_list[]`.
+// External ADD/REPLACE provides a single `ccdf` object; normalize it into `ccdf_list`.
+function populateCCDFList(param) {
+  // clone except ccdf
+  // instead, in catalog definition, ccdf variants are stored in `ccdf_list[]`
+  var ccdf = param.ccdf,
+    definition = _objectWithoutProperties(param, _excluded);
+  if (!isEmpty(ccdf)) {
+    definition.ccdf_list = Array.isArray(definition.ccdf_list) ? definition.ccdf_list : [];
+    // Merge by ccdf record id when available, else by door_finish_id.
+    if (!definition.ccdf_list.some(function (x) {
+      return !!(ccdf !== null && ccdf !== void 0 && ccdf.id) && (x === null || x === void 0 ? void 0 : x.id) === ccdf.id || !!(ccdf !== null && ccdf !== void 0 && ccdf.door_finish_id) && (x === null || x === void 0 ? void 0 : x.door_finish_id) === ccdf.door_finish_id;
+    })) {
+      definition.ccdf_list.push(ccdf);
+    }
+  }
+  return definition;
+}
+export 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) {
+    var _elementJs, _elementJs$structure_, _elementJs$structure_2, _elementJs$structure_3, _elementJs$structure_4, _elementJs3;
+    var elementJs, outlineSVGData, _state$getIn, cds, _cds$find, _elementJs2, currentCdsId, cdsIdx, ttph, updatedStructureJson, catalogElements, catalogElementKeys, catalogItem, k, _catalogElements$cata, tempPlaceholderArray, _catalogItem$structur, newTempPlaceholderArray, mergedTempPlaceholder;
+    return _regeneratorRuntime.wrap(function (_context6) {
+      while (1) switch (_context6.prev = _context6.next) {
+        case 0:
+          if (!isEmpty(element === null || element === void 0 ? void 0 : element.name)) {
+            _context6.next = 1;
+            break;
+          }
+          return _context6.abrupt("return");
+        case 1:
+          elementJs = populateCCDFList(element); // if (isEmpty(catalog?.elements[element.name])) {
+          _context6.next = 2;
+          return loadSVGsByItem(elementJs);
+        case 2:
+          outlineSVGData = _context6.sent;
+          if (((_elementJs = elementJs) === null || _elementJs === void 0 ? void 0 : _elementJs.type) === 'cabinet') {
+            // 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 = (_elementJs$structure_ = elementJs.structure_json) !== null && _elementJs$structure_ !== void 0 && _elementJs$structure_.tempPlaceholders ? _objectSpread(_objectSpread({}, elementJs.structure_json), (_elementJs$structure_2 = (_elementJs$structure_3 = elementJs.structure_json) === null || _elementJs$structure_3 === void 0 || (_elementJs$structure_3 = _elementJs$structure_3.tempPlaceholders[0]) === null || _elementJs$structure_3 === void 0 ? void 0 : _elementJs$structure_3.structure) !== null && _elementJs$structure_2 !== void 0 ? _elementJs$structure_2 : {}) : _objectSpread({}, elementJs.structure_json);
+          elementJs.structure_json = updatedStructureJson;
+          elementJs = _objectSpread(_objectSpread({}, elementJs), {}, {
+            cds: {
+              data: [_objectSpread({}, elementJs.customer_property)],
+              itemID: elementJs.itemID
+            }
+          });
+          if (isEmpty((_elementJs$structure_4 = elementJs.structure_json) === null || _elementJs$structure_4 === void 0 ? void 0 : _elementJs$structure_4.tempPlaceholders)) {
+            _context6.next = 4;
+            break;
+          }
+          _context6.next = 3;
+          return updateCabinetPayload(elementJs);
+        case 3:
+          elementJs = _context6.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)) {
+            _context6.next = 7;
+            break;
+          }
+          if (!(((_catalogElements$cata = catalogElements[catalogElementKeys[k]]) === null || _catalogElements$cata === void 0 ? void 0 : _catalogElements$cata.itemID) === elementJs.itemID)) {
+            _context6.next = 6;
+            break;
+          }
+          catalogItem = catalogElements[catalogElementKeys[k]];
+          return _context6.abrupt("continue", 7);
+        case 6:
+          k++;
+          _context6.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 _context6.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);
+}
+export 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:
+          case ATT_HOLE_OFFSET_B:
+            {
+              var _curHole$properties$g, _curHole$properties;
+              /**** changing left distance ****/
+              var curHole = element;
+              // parent line of curHole
+              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);
+              // move curHole
+              var _calcDistancesFromHol = calcDistancesFromHoleToNearestOneOrWall(curHole, layer),
+                distLeft = _calcDistancesFromHol.distLeft,
+                distRight = _calcDistancesFromHol.distRight; // old distArray
+              var mDistance = attributeName === ATT_HOLE_OFFSET_A ? distLeft - value.get('length') : value.get('length') - distRight; // movement distance
+              var xp = x0 + (lineLength * curHole.offset - mDistance) * Math.cos(alpha);
+              var yp = y0 + (lineLength * curHole.offset - mDistance) * Math.sin(alpha);
+              var offset = GeometryUtils.pointPositionOnLineSegment(x0, y0, x1, y1, xp, yp);
+              // make temp hole for calc new distArray
+              var newHole = {
+                id: curHole.id,
+                line: curHole.line,
+                offset: offset,
+                x: xp,
+                y: yp,
+                properties: new Map({
+                  width: new Map({
+                    length: (_curHole$properties$g = (_curHole$properties = curHole.properties) === null || _curHole$properties === void 0 || (_curHole$properties = _curHole$properties.get('width')) === null || _curHole$properties === void 0 ? void 0 : _curHole$properties.get('length')) !== null && _curHole$properties$g !== void 0 ? _curHole$properties$g : 0
+                  })
+                })
+              };
+              var newDistArray = calcDistancesFromHoleToNearestOneOrWall(newHole, layer);
+              var offsetUnit = attributesFormData.getIn(['offsetA', '_unit']);
+              var offsetA = new Map({
+                length: newDistArray.distLeft,
+                _length: convert(newDistArray.distLeft).from(UNIT_CENTIMETER).to(offsetUnit),
+                _unit: offsetUnit
+              });
+              var offsetB = new Map({
+                length: newDistArray.distRight,
+                _length: convert(newDistArray.distRight).from(UNIT_CENTIMETER).to(offsetUnit),
+                _unit: offsetUnit
+              });
+              attributesFormData = attributesFormData.set('offset', offset).set('offsetA', offsetA).set('offsetB', offsetB);
+              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());
+}
+export 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());
+}
+export 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;
+}
+export function loadMoldingSvg(_x8) {
+  return _loadMoldingSvg.apply(this, arguments);
+}
+function _loadMoldingSvg() {
+  _loadMoldingSvg = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7(molding) {
+    return _regeneratorRuntime.wrap(function (_context7) {
+      while (1) switch (_context7.prev = _context7.next) {
+        case 0:
+          return _context7.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$xml2, _data$xml$viewBox$ani2, _data$xml3, _data$xml4, _data$xml$width$animV, _data$xml5, _data$xml6, _data$xml$height$anim, _data$xml7, _data$xml8, _ref6, _ref7;
+              // Some SVGs omit a viewBox; fall back to width/height to avoid 0 dimensions.
+              // 0/invalid svg_width/svg_height later causes NaN/Infinity vertex positions in 3D molding meshes.
+              var viewBoxWidth = (_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 : (_data$xml2 = data.xml) === null || _data$xml2 === void 0 || (_data$xml2 = _data$xml2.viewBox) === null || _data$xml2 === void 0 || (_data$xml2 = _data$xml2.baseVal) === null || _data$xml2 === void 0 ? void 0 : _data$xml2.width;
+              var viewBoxHeight = (_data$xml$viewBox$ani2 = (_data$xml3 = data.xml) === null || _data$xml3 === void 0 || (_data$xml3 = _data$xml3.viewBox) === null || _data$xml3 === void 0 || (_data$xml3 = _data$xml3.animVal) === null || _data$xml3 === void 0 ? void 0 : _data$xml3.height) !== null && _data$xml$viewBox$ani2 !== void 0 ? _data$xml$viewBox$ani2 : (_data$xml4 = data.xml) === null || _data$xml4 === void 0 || (_data$xml4 = _data$xml4.viewBox) === null || _data$xml4 === void 0 || (_data$xml4 = _data$xml4.baseVal) === null || _data$xml4 === void 0 ? void 0 : _data$xml4.height;
+              var attrWidth = (_data$xml$width$animV = (_data$xml5 = data.xml) === null || _data$xml5 === void 0 || (_data$xml5 = _data$xml5.width) === null || _data$xml5 === void 0 || (_data$xml5 = _data$xml5.animVal) === null || _data$xml5 === void 0 ? void 0 : _data$xml5.value) !== null && _data$xml$width$animV !== void 0 ? _data$xml$width$animV : (_data$xml6 = data.xml) === null || _data$xml6 === void 0 || (_data$xml6 = _data$xml6.width) === null || _data$xml6 === void 0 || (_data$xml6 = _data$xml6.baseVal) === null || _data$xml6 === void 0 ? void 0 : _data$xml6.value;
+              var attrHeight = (_data$xml$height$anim = (_data$xml7 = data.xml) === null || _data$xml7 === void 0 || (_data$xml7 = _data$xml7.height) === null || _data$xml7 === void 0 || (_data$xml7 = _data$xml7.animVal) === null || _data$xml7 === void 0 ? void 0 : _data$xml7.value) !== null && _data$xml$height$anim !== void 0 ? _data$xml$height$anim : (_data$xml8 = data.xml) === null || _data$xml8 === void 0 || (_data$xml8 = _data$xml8.height) === null || _data$xml8 === void 0 || (_data$xml8 = _data$xml8.baseVal) === null || _data$xml8 === void 0 ? void 0 : _data$xml8.value;
+              var svg_width = Number((_ref6 = viewBoxWidth !== null && viewBoxWidth !== void 0 ? viewBoxWidth : attrWidth) !== null && _ref6 !== void 0 ? _ref6 : 0);
+              var svg_height = Number((_ref7 = viewBoxHeight !== null && viewBoxHeight !== void 0 ? viewBoxHeight : attrHeight) !== null && _ref7 !== void 0 ? _ref7 : 0);
+              molding.data = {
+                paths: data.paths,
+                svg_width: Number.isFinite(svg_width) ? svg_width : 0,
+                svg_height: Number.isFinite(svg_height) ? svg_height : 0
+              };
+              resolve();
+            }, null, function (error) {
+              console.error(error);
+              reject(error);
+            });
+          }));
+        case 1:
+        case "end":
+          return _context7.stop();
+      }
+    }, _callee7);
+  }));
+  return _loadMoldingSvg.apply(this, arguments);
+}
+export 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 prepareMoldingCCDFList(doorStyle, moldingData) {
+  var moldingCCDFs = [];
+  for (var i = 0; i < moldingData.length; i++) {
+    var _molding$ccdf$catalog, _molding$ccdf, _molding$ccdf$cabinet, _molding$ccdf2, _doorStyle$id, _molding$long_name;
+    var molding = moldingData[i];
+    moldingCCDFs.push({
+      sizeinfo: molding.sizeinfo,
+      catalog_cabinet_sku: (_molding$ccdf$catalog = molding === null || molding === void 0 || (_molding$ccdf = molding.ccdf) === null || _molding$ccdf === void 0 ? void 0 : _molding$ccdf.catalog_cabinet_sku) !== null && _molding$ccdf$catalog !== void 0 ? _molding$ccdf$catalog : molding.sku_number,
+      cabinet_id: (_molding$ccdf$cabinet = molding === null || molding === void 0 || (_molding$ccdf2 = molding.ccdf) === null || _molding$ccdf2 === void 0 ? void 0 : _molding$ccdf2.cabinet_id) !== null && _molding$ccdf$cabinet !== void 0 ? _molding$ccdf$cabinet : molding.itemID,
+      ccdf: molding.ccdf,
+      target_door_finish_id: (_doorStyle$id = doorStyle === null || doorStyle === void 0 ? void 0 : doorStyle.id) !== null && _doorStyle$id !== void 0 ? _doorStyle$id : null,
+      long_name: (_molding$long_name = molding === null || molding === void 0 ? void 0 : molding.long_name) !== null && _molding$long_name !== void 0 ? _molding$long_name : null,
+      id: molding.itemID
+    });
+  }
+  return moldingCCDFs;
+}