kitchen-simulator 3.12.0-test.3 → 3.13.0

package/es/class/item.js

@@ -12,7 +12,7 @@ import { INSTALLATION_SUFFIX_TYPE, INTERNAL_EVENT_DRAW_ELEMENT, MODE_DRAGGING_IT
 import { debugUtil, updatePayloadOfInternalEvent } from "../utils/helper";
 import { isUndefined } from 'util';
 import { hasMoldingLayout } from "../utils/molding";
-import { getInstallationSuffix } from "../components/viewer2d/utils";
+import { getInstallationSuffix, isEmpty } from "../components/viewer2d/utils";
 import { historyPush } from "../utils/history";
 var allItemRect;
 var allItemSnap;
@@ -29,9 +29,11 @@ var Item = /*#__PURE__*/function () {
   return _createClass(Item, null, [{
     key: "create",
     value: function create(state, layerID, type, x, y, width, height, rotation, isDuplication) {
+      var _item;
       var molding = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : [];
       var isInitialPos = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
       var refItem = arguments.length > 11 && arguments[11] !== undefined ? arguments[11] : null;
+      var counterTopURI = arguments.length > 12 && arguments[12] !== undefined ? arguments[12] : null;
       var itemID = IDBroker.acquireID();
       var item = state.catalog.factoryElement(type, {
         id: itemID,
@@ -160,6 +162,9 @@ var Item = /*#__PURE__*/function () {
         }
       };
       item.category === 'cabinet' && setSizeOfItemByDoorStyle();
+      if (counterTopURI || (_item = item) !== null && _item !== void 0 && _item.counterTop) {
+        item.counterTop.uri = counterTopURI;
+      }
       item = this.updateDoorHandle(item, state.getIn(['scene', 'layers', layerID]));
       state = state.setIn(['scene', 'layers', layerID, 'items', itemID], item);
       if (item.type.includes('Light')) {
@@ -331,17 +336,17 @@ var Item = /*#__PURE__*/function () {
             if (isRect) {
               var _this$create2 = this.create(state, layerID, sceneComponentType, x - width * Math.cos(rotRad), y - width * Math.sin(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                 _stateI = _this$create2.updatedState,
-                _item = _this$create2.item;
-              duplicatedElement = _item;
-              if (_item === null) {
+                _item2 = _this$create2.item;
+              duplicatedElement = _item2;
+              if (_item2 === null) {
                 alert('There are no Door Colors in this cabinet.');
                 state = state.merge({
                   mode: MODE_IDLE,
                   drawingSupport: new Map()
                 });
               } else {
-                state = Item.select(_stateI, layerID, _item.id).updatedState;
-                state = state.setIn(['drawingSupport', 'currentID'], _item.id);
+                state = Item.select(_stateI, layerID, _item2.id).updatedState;
+                state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
               }
             } else {
               var _val2 = {
@@ -358,17 +363,17 @@ var Item = /*#__PURE__*/function () {
               if (isRectDown) {
                 var _this$create3 = this.create(state, layerID, sceneComponentType, x - depth * Math.sin(rotRad), y - depth * Math.cos(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                   _stateI2 = _this$create3.updatedState,
-                  _item2 = _this$create3.item;
-                duplicatedElement = _item2;
-                if (_item2 === null) {
+                  _item3 = _this$create3.item;
+                duplicatedElement = _item3;
+                if (_item3 === null) {
                   alert('There are no Door Colors in this cabinet.');
                   state = state.merge({
                     mode: MODE_IDLE,
                     drawingSupport: new Map()
                   });
                 } else {
-                  state = Item.select(_stateI2, layerID, _item2.id).updatedState;
-                  state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
+                  state = Item.select(_stateI2, layerID, _item3.id).updatedState;
+                  state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
                 }
               } else {
                 var _val3 = {
@@ -385,17 +390,17 @@ var Item = /*#__PURE__*/function () {
                 if (isRectUp) {
                   var _this$create4 = this.create(state, layerID, sceneComponentType, x + depth * Math.sin(rotRad), y + depth * Math.cos(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                     _stateI3 = _this$create4.updatedState,
-                    _item3 = _this$create4.item;
-                  duplicatedElement = _item3;
-                  if (_item3 === null) {
+                    _item4 = _this$create4.item;
+                  duplicatedElement = _item4;
+                  if (_item4 === null) {
                     alert('There are no Door Colors in this cabinet.');
                     state = state.merge({
                       mode: MODE_IDLE,
                       drawingSupport: new Map()
                     });
                   } else {
-                    state = Item.select(_stateI3, layerID, _item3.id).updatedState;
-                    state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
+                    state = Item.select(_stateI3, layerID, _item4.id).updatedState;
+                    state = state.setIn(['drawingSupport', 'currentID'], _item4.id);
                   }
                 } else {
                   console.log('there is no space');
@@ -532,8 +537,14 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "replaceItem",
     value: function replaceItem(state, selectedPos, currentObject, selectedObject) {
+      var _currentObject$counte;
+      var counterTopURI = '';
+      if (!isEmpty(currentObject === null || currentObject === void 0 || (_currentObject$counte = currentObject.counterTop) === null || _currentObject$counte === void 0 ? void 0 : _currentObject$counte.uri)) {
+        var _currentObject$counte2;
+        counterTopURI = currentObject === null || currentObject === void 0 || (_currentObject$counte2 = currentObject.counterTop) === null || _currentObject$counte2 === void 0 ? void 0 : _currentObject$counte2.uri;
+      } else if (!isEmpty(state.getIn(['scene', 'layers', 'layer-1', 'counterTop']))) counterTopURI = state.getIn(['scene', 'layers', 'layer-1', 'counterTop']).uri;else counterTopURI = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
       state = this.remove(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
-      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false).updatedState;
+      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false, [], false, null, counterTopURI).updatedState;
       // state = this.select(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
       return {
         updatedState: state

package/es/class/project.js

@@ -835,8 +835,8 @@ var Project = /*#__PURE__*/function () {
       });
       var _viewer2D = state.viewer2D;
       var viewer = _viewer2D.toJS();
-      width = convert(width).from('in').to('cm');
-      height = convert(height).from('in').to('cm');
+      width = convert(width).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
+      height = convert(height).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
       var layerID = state.scene.selectedLayer;
       state = Item.setInitialDoorStyle(state, doorStyle).updatedState;
       if (isEmpty(viewer)) return {

package/es/index.js

@@ -1,4 +1,3 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
@@ -6,8 +5,6 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConst
 import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
 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; }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
@@ -249,10 +246,10 @@ export function renderKitchenSimulator(container) {
 
   // ✅ Reuse existing API for same container
   if (container[API_KEY]) {
-    var _api$__render;
-    var _api = container[API_KEY];
-    (_api$__render = _api.__render) === null || _api$__render === void 0 || _api$__render.call(_api, props); // will merge via lastProps inside api (after patch)
-    return _api;
+    var _container$API_KEY$__, _container$API_KEY;
+    // update render with latest props (safe)
+    (_container$API_KEY$__ = (_container$API_KEY = container[API_KEY]).__render) === null || _container$API_KEY$__ === void 0 || _container$API_KEY$__.call(_container$API_KEY, props);
+    return container[API_KEY];
   }
 
   // ✅ Reuse root for same container
@@ -447,79 +444,10 @@ export function renderKitchenSimulator(container) {
       }
     }]);
   }(React.Component);
-  var ro = null;
-  var roEl = null;
-  var roRaf = 0;
-  function installContentBoxObserver() {
-    var _lastProps$width2, _lastProps$height2;
-    if (typeof window === 'undefined') return;
-    if (typeof ResizeObserver === 'undefined') return;
-    var el = document.getElementById('content-box');
-    if (!el) return; // tool won't crash if element isn't there yet
-
-    roEl = el;
-    var syncFromEl = function syncFromEl(entry) {
-      var _lastProps$width, _lastProps$height;
-      // Prefer contentBoxSize when available; fallback to getBoundingClientRect.
-      var w = 0,
-        h = 0;
-      var cbs = entry === null || entry === void 0 ? void 0 : entry.contentBoxSize;
-      if (cbs) {
-        var _box$inlineSize, _box$blockSize;
-        // contentBoxSize can be array (Chrome) or single object (Firefox)
-        var box = Array.isArray(cbs) ? cbs[0] : cbs;
-        w = (_box$inlineSize = box === null || box === void 0 ? void 0 : box.inlineSize) !== null && _box$inlineSize !== void 0 ? _box$inlineSize : 0;
-        h = (_box$blockSize = box === null || box === void 0 ? void 0 : box.blockSize) !== null && _box$blockSize !== void 0 ? _box$blockSize : 0;
-      }
-      if (!w || !h) {
-        var _rect = roEl.getBoundingClientRect();
-        w = _rect.width;
-        h = _rect.height;
-      }
-      w = normalizeSize(w, (_lastProps$width = lastProps.width) !== null && _lastProps$width !== void 0 ? _lastProps$width : 1);
-      h = normalizeSize(h, (_lastProps$height = lastProps.height) !== null && _lastProps$height !== void 0 ? _lastProps$height : 1);
-
-      // avoid thrash: coalesce multiple observer callbacks into 1 RAF
-      if (roRaf) cancelAnimationFrame(roRaf);
-      roRaf = requestAnimationFrame(function () {
-        roRaf = 0;
-        if (destroyed) return;
-        // only update if changed (prevents infinite loops)
-        if (lastProps.width === w && lastProps.height === h) return;
-        // update props via existing render path
-        api.__render({
-          width: w,
-          height: h
-        });
-      });
-    };
-    ro = new ResizeObserver(function (entries) {
-      var entry = entries && entries[0];
-      if (!entry) return;
-      syncFromEl(entry);
-    });
-    ro.observe(el, {
-      box: 'content-box'
-    });
-
-    // initial sync (in case observer doesn't fire immediately)
-    var rect = el.getBoundingClientRect();
-    api.__render({
-      width: normalizeSize(rect.width, (_lastProps$width2 = lastProps.width) !== null && _lastProps$width2 !== void 0 ? _lastProps$width2 : 1),
-      height: normalizeSize(rect.height, (_lastProps$height2 = lastProps.height) !== null && _lastProps$height2 !== void 0 ? _lastProps$height2 : 1)
-    });
-  }
-  var lastProps = _objectSpread({}, props);
-  function normalizeSize(n) {
-    var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
-    var v = typeof n === 'string' ? parseFloat(n) : n;
-    return Number.isFinite(v) && v > 0 ? v : fallback;
-  }
   var api = {
     // internal: rerender wrapper with latest props if host calls renderKitchenSimulator again
     __render: function __render(nextProps) {
-      lastProps = _objectSpread(_objectSpread({}, lastProps), nextProps || {});
-      root.render(/*#__PURE__*/React.createElement(Wrapper, lastProps));
+      root.render(/*#__PURE__*/React.createElement(Wrapper, nextProps));
     },
     /**
      * Send one or many events (in order).
@@ -603,17 +531,6 @@ export function renderKitchenSimulator(container) {
           container[API_KEY] = null;
         }
       };
-      if (ro) {
-        try {
-          ro.disconnect();
-        } catch (_unused2) {}
-        ro = null;
-      }
-      roEl = null;
-      if (roRaf) {
-        cancelAnimationFrame(roRaf);
-        roRaf = 0;
-      }
 
       // Prefer microtask when available, otherwise macrotask
       if (typeof queueMicrotask === 'function') queueMicrotask(doUnmount);else setTimeout(doUnmount, 0);
@@ -623,20 +540,6 @@ export function renderKitchenSimulator(container) {
   // first render
   api.__render(props);
 
-  // Install observer after initial mount.
-  // If #content-box is created later, retry a few frames.
-  (function tryInstall() {
-    var attempt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-    if (destroyed) return;
-    installContentBoxObserver();
-    if (!ro && attempt < 30) {
-      // element not found yet; retry next frame for up to ~30 frames
-      requestAnimationFrame(function () {
-        return tryInstall(attempt + 1);
-      });
-    }
-  })();
-
   // store api on container so repeated calls reuse it
   container[API_KEY] = api;
   return api;

package/es/utils/geometry.js

@@ -1873,7 +1873,7 @@ export function getAllHoleRect(scene, val) {
   layer.lines.forEach(function (line) {
     line.holes.forEach(function (holeID) {
       var hole = layer.holes.get(holeID);
-      holes.push(hole);
+      if (hole) holes.push(hole);
     });
   });
   var i = 0;

package/lib/class/item.js

@@ -36,9 +36,11 @@ var Item = exports["default"] = /*#__PURE__*/function () {
   return (0, _createClass2["default"])(Item, null, [{
     key: "create",
     value: function create(state, layerID, type, x, y, width, height, rotation, isDuplication) {
+      var _item;
       var molding = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : [];
       var isInitialPos = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
       var refItem = arguments.length > 11 && arguments[11] !== undefined ? arguments[11] : null;
+      var counterTopURI = arguments.length > 12 && arguments[12] !== undefined ? arguments[12] : null;
       var itemID = _export2.IDBroker.acquireID();
       var item = state.catalog.factoryElement(type, {
         id: itemID,
@@ -167,6 +169,9 @@ var Item = exports["default"] = /*#__PURE__*/function () {
         }
       };
       item.category === 'cabinet' && setSizeOfItemByDoorStyle();
+      if (counterTopURI || (_item = item) !== null && _item !== void 0 && _item.counterTop) {
+        item.counterTop.uri = counterTopURI;
+      }
       item = this.updateDoorHandle(item, state.getIn(['scene', 'layers', layerID]));
       state = state.setIn(['scene', 'layers', layerID, 'items', itemID], item);
       if (item.type.includes('Light')) {
@@ -338,17 +343,17 @@ var Item = exports["default"] = /*#__PURE__*/function () {
             if (isRect) {
               var _this$create2 = this.create(state, layerID, sceneComponentType, x - width * Math.cos(rotRad), y - width * Math.sin(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                 _stateI = _this$create2.updatedState,
-                _item = _this$create2.item;
-              duplicatedElement = _item;
-              if (_item === null) {
+                _item2 = _this$create2.item;
+              duplicatedElement = _item2;
+              if (_item2 === null) {
                 alert('There are no Door Colors in this cabinet.');
                 state = state.merge({
                   mode: _constants.MODE_IDLE,
                   drawingSupport: new _immutable.Map()
                 });
               } else {
-                state = Item.select(_stateI, layerID, _item.id).updatedState;
-                state = state.setIn(['drawingSupport', 'currentID'], _item.id);
+                state = Item.select(_stateI, layerID, _item2.id).updatedState;
+                state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
               }
             } else {
               var _val2 = {
@@ -365,17 +370,17 @@ var Item = exports["default"] = /*#__PURE__*/function () {
               if (isRectDown) {
                 var _this$create3 = this.create(state, layerID, sceneComponentType, x - depth * Math.sin(rotRad), y - depth * Math.cos(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                   _stateI2 = _this$create3.updatedState,
-                  _item2 = _this$create3.item;
-                duplicatedElement = _item2;
-                if (_item2 === null) {
+                  _item3 = _this$create3.item;
+                duplicatedElement = _item3;
+                if (_item3 === null) {
                   alert('There are no Door Colors in this cabinet.');
                   state = state.merge({
                     mode: _constants.MODE_IDLE,
                     drawingSupport: new _immutable.Map()
                   });
                 } else {
-                  state = Item.select(_stateI2, layerID, _item2.id).updatedState;
-                  state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
+                  state = Item.select(_stateI2, layerID, _item3.id).updatedState;
+                  state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
                 }
               } else {
                 var _val3 = {
@@ -392,17 +397,17 @@ var Item = exports["default"] = /*#__PURE__*/function () {
                 if (isRectUp) {
                   var _this$create4 = this.create(state, layerID, sceneComponentType, x + depth * Math.sin(rotRad), y + depth * Math.cos(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                     _stateI3 = _this$create4.updatedState,
-                    _item3 = _this$create4.item;
-                  duplicatedElement = _item3;
-                  if (_item3 === null) {
+                    _item4 = _this$create4.item;
+                  duplicatedElement = _item4;
+                  if (_item4 === null) {
                     alert('There are no Door Colors in this cabinet.');
                     state = state.merge({
                       mode: _constants.MODE_IDLE,
                       drawingSupport: new _immutable.Map()
                     });
                   } else {
-                    state = Item.select(_stateI3, layerID, _item3.id).updatedState;
-                    state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
+                    state = Item.select(_stateI3, layerID, _item4.id).updatedState;
+                    state = state.setIn(['drawingSupport', 'currentID'], _item4.id);
                   }
                 } else {
                   console.log('there is no space');
@@ -539,8 +544,14 @@ var Item = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "replaceItem",
     value: function replaceItem(state, selectedPos, currentObject, selectedObject) {
+      var _currentObject$counte;
+      var counterTopURI = '';
+      if (!(0, _utils.isEmpty)(currentObject === null || currentObject === void 0 || (_currentObject$counte = currentObject.counterTop) === null || _currentObject$counte === void 0 ? void 0 : _currentObject$counte.uri)) {
+        var _currentObject$counte2;
+        counterTopURI = currentObject === null || currentObject === void 0 || (_currentObject$counte2 = currentObject.counterTop) === null || _currentObject$counte2 === void 0 ? void 0 : _currentObject$counte2.uri;
+      } else if (!(0, _utils.isEmpty)(state.getIn(['scene', 'layers', 'layer-1', 'counterTop']))) counterTopURI = state.getIn(['scene', 'layers', 'layer-1', 'counterTop']).uri;else counterTopURI = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
       state = this.remove(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
-      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false).updatedState;
+      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false, [], false, null, counterTopURI).updatedState;
       // state = this.select(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
       return {
         updatedState: state

package/lib/class/project.js

@@ -844,8 +844,8 @@ var Project = exports["default"] = /*#__PURE__*/function () {
       });
       var _viewer2D = state.viewer2D;
       var viewer = _viewer2D.toJS();
-      width = (0, _convertUnitsLite.convert)(width).from('in').to('cm');
-      height = (0, _convertUnitsLite.convert)(height).from('in').to('cm');
+      width = (0, _convertUnitsLite.convert)(width).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
+      height = (0, _convertUnitsLite.convert)(height).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
       var layerID = state.scene.selectedLayer;
       state = _export2.Item.setInitialDoorStyle(state, doorStyle).updatedState;
       if ((0, _helper.isEmpty)(viewer)) return {

package/lib/index.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 exports.renderKitchenSimulator = renderKitchenSimulator;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -18,8 +17,6 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = _interopRequireDefault(require("react"));
 var _LiteRenderer = _interopRequireDefault(require("./LiteRenderer"));
 var _client = require("react-dom/client");
-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) { (0, _defineProperty2["default"])(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; }
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
@@ -257,10 +254,10 @@ function renderKitchenSimulator(container) {
 
   // ✅ Reuse existing API for same container
   if (container[API_KEY]) {
-    var _api$__render;
-    var _api = container[API_KEY];
-    (_api$__render = _api.__render) === null || _api$__render === void 0 || _api$__render.call(_api, props); // will merge via lastProps inside api (after patch)
-    return _api;
+    var _container$API_KEY$__, _container$API_KEY;
+    // update render with latest props (safe)
+    (_container$API_KEY$__ = (_container$API_KEY = container[API_KEY]).__render) === null || _container$API_KEY$__ === void 0 || _container$API_KEY$__.call(_container$API_KEY, props);
+    return container[API_KEY];
   }
 
   // ✅ Reuse root for same container
@@ -455,79 +452,10 @@ function renderKitchenSimulator(container) {
       }
     }]);
   }(_react["default"].Component);
-  var ro = null;
-  var roEl = null;
-  var roRaf = 0;
-  function installContentBoxObserver() {
-    var _lastProps$width2, _lastProps$height2;
-    if (typeof window === 'undefined') return;
-    if (typeof ResizeObserver === 'undefined') return;
-    var el = document.getElementById('content-box');
-    if (!el) return; // tool won't crash if element isn't there yet
-
-    roEl = el;
-    var syncFromEl = function syncFromEl(entry) {
-      var _lastProps$width, _lastProps$height;
-      // Prefer contentBoxSize when available; fallback to getBoundingClientRect.
-      var w = 0,
-        h = 0;
-      var cbs = entry === null || entry === void 0 ? void 0 : entry.contentBoxSize;
-      if (cbs) {
-        var _box$inlineSize, _box$blockSize;
-        // contentBoxSize can be array (Chrome) or single object (Firefox)
-        var box = Array.isArray(cbs) ? cbs[0] : cbs;
-        w = (_box$inlineSize = box === null || box === void 0 ? void 0 : box.inlineSize) !== null && _box$inlineSize !== void 0 ? _box$inlineSize : 0;
-        h = (_box$blockSize = box === null || box === void 0 ? void 0 : box.blockSize) !== null && _box$blockSize !== void 0 ? _box$blockSize : 0;
-      }
-      if (!w || !h) {
-        var _rect = roEl.getBoundingClientRect();
-        w = _rect.width;
-        h = _rect.height;
-      }
-      w = normalizeSize(w, (_lastProps$width = lastProps.width) !== null && _lastProps$width !== void 0 ? _lastProps$width : 1);
-      h = normalizeSize(h, (_lastProps$height = lastProps.height) !== null && _lastProps$height !== void 0 ? _lastProps$height : 1);
-
-      // avoid thrash: coalesce multiple observer callbacks into 1 RAF
-      if (roRaf) cancelAnimationFrame(roRaf);
-      roRaf = requestAnimationFrame(function () {
-        roRaf = 0;
-        if (destroyed) return;
-        // only update if changed (prevents infinite loops)
-        if (lastProps.width === w && lastProps.height === h) return;
-        // update props via existing render path
-        api.__render({
-          width: w,
-          height: h
-        });
-      });
-    };
-    ro = new ResizeObserver(function (entries) {
-      var entry = entries && entries[0];
-      if (!entry) return;
-      syncFromEl(entry);
-    });
-    ro.observe(el, {
-      box: 'content-box'
-    });
-
-    // initial sync (in case observer doesn't fire immediately)
-    var rect = el.getBoundingClientRect();
-    api.__render({
-      width: normalizeSize(rect.width, (_lastProps$width2 = lastProps.width) !== null && _lastProps$width2 !== void 0 ? _lastProps$width2 : 1),
-      height: normalizeSize(rect.height, (_lastProps$height2 = lastProps.height) !== null && _lastProps$height2 !== void 0 ? _lastProps$height2 : 1)
-    });
-  }
-  var lastProps = _objectSpread({}, props);
-  function normalizeSize(n) {
-    var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
-    var v = typeof n === 'string' ? parseFloat(n) : n;
-    return Number.isFinite(v) && v > 0 ? v : fallback;
-  }
   var api = {
     // internal: rerender wrapper with latest props if host calls renderKitchenSimulator again
     __render: function __render(nextProps) {
-      lastProps = _objectSpread(_objectSpread({}, lastProps), nextProps || {});
-      root.render(/*#__PURE__*/_react["default"].createElement(Wrapper, lastProps));
+      root.render(/*#__PURE__*/_react["default"].createElement(Wrapper, nextProps));
     },
     /**
      * Send one or many events (in order).
@@ -611,17 +539,6 @@ function renderKitchenSimulator(container) {
           container[API_KEY] = null;
         }
       };
-      if (ro) {
-        try {
-          ro.disconnect();
-        } catch (_unused2) {}
-        ro = null;
-      }
-      roEl = null;
-      if (roRaf) {
-        cancelAnimationFrame(roRaf);
-        roRaf = 0;
-      }
 
       // Prefer microtask when available, otherwise macrotask
       if (typeof queueMicrotask === 'function') queueMicrotask(doUnmount);else setTimeout(doUnmount, 0);
@@ -631,20 +548,6 @@ function renderKitchenSimulator(container) {
   // first render
   api.__render(props);
 
-  // Install observer after initial mount.
-  // If #content-box is created later, retry a few frames.
-  (function tryInstall() {
-    var attempt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-    if (destroyed) return;
-    installContentBoxObserver();
-    if (!ro && attempt < 30) {
-      // element not found yet; retry next frame for up to ~30 frames
-      requestAnimationFrame(function () {
-        return tryInstall(attempt + 1);
-      });
-    }
-  })();
-
   // store api on container so repeated calls reuse it
   container[API_KEY] = api;
   return api;

package/lib/utils/geometry.js

@@ -1973,7 +1973,7 @@ function getAllHoleRect(scene, val) {
   layer.lines.forEach(function (line) {
     line.holes.forEach(function (holeID) {
       var hole = layer.holes.get(holeID);
-      holes.push(hole);
+      if (hole) holes.push(hole);
     });
   });
   var i = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchen-simulator",
-  "version": "3.12.0-test.3",
+  "version": "3.13.0",
   "description": "It is a kitchen simulator (self-contained micro-frontend).",
   "license": "MIT",
   "main": "lib/index.js",