kitchen-simulator 4.1.5-react-18 → 4.1.7-react-18

package/es/LiteKitchenConfigurator.js

@@ -108,7 +108,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
     _this.closeCabinetTB = _this.closeCabinetTB.bind(_this);
     _this.closeFinishingTB = _this.closeFinishingTB.bind(_this);
     _this.closeApplianceTB = _this.closeApplianceTB.bind(_this);
-    _this.setToolbar = _this.setToolbar.bind(_this);
     _this.replaceCabinet = _this.replaceCabinet.bind(_this);
     _this.setSubmitToSave = _this.setSubmitToSave.bind(_this);
     _this.setSignOpen = _this.setSignOpen.bind(_this);
@@ -123,13 +122,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
   // Toolbar control functions
   _inherits(LiteKitchenConfigurator, _Component);
   return _createClass(LiteKitchenConfigurator, [{
-    key: "setToolbar",
-    value: function setToolbar(toolBarKey) {
-      this.setState({
-        toolbar: toolBarKey
-      });
-    }
-  }, {
     key: "setShowProperty",
     value: function setShowProperty(value) {
       this.setState({
@@ -412,7 +404,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
         catalog: this.props.catalog,
         state: extractedState,
         toolBar: this.state.toolbar,
-        setToolbar: this.setToolbar,
         replaceCabinet: this.replaceCabinet,
         keyDownEnable: !savePopupVisible && !quotePopupVisible && !assistPopupVisible
       }, props, {

package/es/components/content.js

@@ -14,7 +14,6 @@ export default function Content(_ref) {
     state = _ref.state,
     customContents = _ref.customContents,
     match = _ref.match,
-    setToolbar = _ref.setToolbar,
     replaceCabinet = _ref.replaceCabinet,
     keyDownEnable = _ref.keyDownEnable,
     catalog = _ref.catalog,
@@ -126,7 +125,6 @@ export default function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         keyDownEnable: keyDownEnable,
         catalog: catalog
@@ -137,7 +135,6 @@ export default function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         keyDownEnable: keyDownEnable,
         downloadFlag: false,
@@ -178,7 +175,6 @@ export default function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         onInternalEvent: onInternalEvent
       });
@@ -193,7 +189,6 @@ export default function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         keyDownEnable: keyDownEnable,
         downloadFlag: false,

package/es/components/viewer2d/viewer2d.js

@@ -127,7 +127,6 @@ export default function Viewer2D(_ref) {
   var state = _ref.state,
     width = _ref.width,
     height = _ref.height,
-    setToolbar = _ref.setToolbar,
     replaceCabinet = _ref.replaceCabinet,
     onInternalEvent = _ref.onInternalEvent;
   var _useAppContext = useAppContext(),
@@ -834,7 +833,6 @@ export default function Viewer2D(_ref) {
             verticesActions.beginDraggingVertex(elementData.layer, elementData.id, x, y, state.snapMask);
             break;
           case 'items':
-            setToolbar('');
             current_sel_obj_id = elementData.id;
             if (elementData.part === 'rotation-anchor') itemsActions.beginRotatingItem(elementData.layer, elementData.id, x, y);else if (elementData.part === 'remove') break;else if (elementData.part === 'duplicate') break;else if (elementData.part === 'warning_edit') break;else {
               // closes the setting dialog
@@ -869,9 +867,6 @@ export default function Viewer2D(_ref) {
     // setRulerEdit(null);
     var event = viewerEvent.originalEvent;
     var bbox = event.target.getBoundingClientRect();
-    if (!mode.includes('ING')) {
-      setToolbar('');
-    }
     // bbox.width = event.target.getBBox().width;
     // bbox.height = event.target.getBBox().height;
     if (event.target.tagName === 'rect') {

package/es/components/viewer3d/front3D.js

@@ -8,7 +8,6 @@ export default function Front3D(_ref) {
   var width = _ref.width,
     height = _ref.height,
     state = _ref.state,
-    setToolbar = _ref.setToolbar,
     replaceCabinet = _ref.replaceCabinet,
     keyDownEnable = _ref.keyDownEnable,
     catalog = _ref.catalog;
@@ -22,15 +21,6 @@ export default function Front3D(_ref) {
     k++;
     setMode(state.get('mode'));
   }
-  var mouseUpEvent = function mouseUpEvent(event) {
-    setToolbar('');
-  };
-  useEffect(function () {
-    if (!isEmpty(document.getElementById('front'))) document.getElementById('front').addEventListener('mouseup', mouseUpEvent);
-    return function () {
-      if (!isEmpty(document.getElementById('front'))) document.getElementById('front').removeEventListener('mouseup', mouseUpEvent);
-    };
-  }, []);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("svg", {
     width: sceneWidth,
     height: sceneHeight,
@@ -53,7 +43,6 @@ export default function Front3D(_ref) {
     state: state,
     width: width,
     height: height,
-    setToolbar: setToolbar,
     replaceCabinet: replaceCabinet,
     keyDownEnable: keyDownEnable,
     downloadFlag: false

package/es/components/viewer3d/viewer3d-first-person.js

@@ -24,6 +24,7 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
     var _this;
     _classCallCheck(this, Viewer3DFirstPerson);
     _this = _callSuper(this, Viewer3DFirstPerson, [props]);
+    _this.canvasWrapperRef = /*#__PURE__*/React.createRef();
     _this.width = props.width;
     _this.height = props.height;
     _this.stopRendering = false;
@@ -57,7 +58,7 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
       };
       var state = this.props.state;
       var data = state.scene;
-      var canvasWrapper = ReactDOM.findDOMNode(this.refs.canvasWrapper);
+      var canvasWrapper = this.canvasWrapperRef.current;
       var scene3D = new Three.Scene();
 
       // As I need to show the pointer above all scene objects, I use this workaround http://stackoverflow.com/a/13309722
@@ -300,7 +301,7 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       return /*#__PURE__*/React.createElement('div', {
-        ref: 'canvasWrapper'
+        ref: this.canvasWrapperRef
       });
     }
   }]);

package/es/components/viewer3d/viewer3d.js

@@ -52,6 +52,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
     _this.width = props.width;
     _this.height = props.height;
     _this.renderingID = 0;
+    _this.canvasWrapperRef = /*#__PURE__*/React.createRef();
     var mode = props.state.mode;
     if (!window.__elevationRendererDownload) {
       window.__elevationRendererDownload = {};
@@ -1288,7 +1289,6 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         }
         if (_this2.props.state.mode == MODE_DRAWING_ITEM_3D) return;
         if (isSelected) {
-          !_this2.props.downloadFlag && _this2.props.setToolbar('');
           if (intersects.length > 0 && !isNaN(intersects[0].distance)) {
             var _i1;
             for (_i1 = 0; _i1 < intersects.length; _i1++) {
@@ -1393,9 +1393,6 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         }
         scene3D.remove(angleObj);
         scene3D.remove(toolObj);
-        if (!_this2.props.downloadFlag && !_this2.props.state.mode.includes('ING')) {
-          _this2.props.setToolbar('');
-        }
         if (_this2.props.state.mode == MODE_DRAWING_ITEM_3D) {
           if (Point.x > _this2.props.state.scene.width) Point.x = _this2.props.state.width;
           if (Point.y > _this2.props.state.scene.height) Point.y = _this2.props.state.height;
@@ -2193,7 +2190,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
       }
 
       // Add the output of the renderer to the html element
-      var canvasWrapper = ReactDOM.findDOMNode(this.refs.canvasWrapper);
+      var canvasWrapper = this.canvasWrapperRef.current;
       canvasWrapper && canvasWrapper.appendChild(this.renderer.domElement);
 
       //
@@ -2674,7 +2671,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         this.renderer.domElement.style.opacity = '1';
         !this.props.downloadFlag && document.getElementById('front') && (document.getElementById('front').style.display = 'block');
         return /*#__PURE__*/React.createElement('div', {
-          ref: 'canvasWrapper'
+          ref: this.canvasWrapperRef
         });
       }
     }

package/es/index.js

@@ -9,6 +9,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import React from 'react';
 import { createRoot } from 'react-dom/client';
 import LiteRenderer from "./LiteRenderer";
+var ROOT_KEY = '__kitchenSimulatorRoot__';
 export function renderKitchenSimulator(container) {
   var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var apiRef = null;
@@ -25,8 +26,7 @@ export function renderKitchenSimulator(container) {
       apiRef = {
         enqueueExternalEvent: function enqueueExternalEvent(ev) {
           return _this.enqueue(ev);
-        },
-        unmount: function unmount() {}
+        }
       };
       return _this;
     }
@@ -48,11 +48,7 @@ export function renderKitchenSimulator(container) {
           return;
         }
         this.processing = true;
-
-        // Separate task => prevents React 18 batching from collapsing updates
         setTimeout(function () {
-          // setting null first ensures `prevProps.externalEvent !== externalEvent`
-          // even if two events are referentially equal or key logic is weird
           _this2.setState({
             externalEvent: null
           }, function () {
@@ -66,9 +62,7 @@ export function renderKitchenSimulator(container) {
       key: "componentDidUpdate",
       value: function componentDidUpdate(prevProps, prevState) {
         var _this3 = this;
-        // When the event was delivered, schedule the next one
         if (prevState.externalEvent !== this.state.externalEvent) {
-          // Give LiteKitchenConfigurator a chance to react in its componentDidUpdate
           setTimeout(function () {
             return _this3.processNext();
           }, 0);
@@ -82,8 +76,12 @@ export function renderKitchenSimulator(container) {
         }));
       }
     }]);
-  }(React.Component);
-  var root = createRoot(container);
+  }(React.Component); // ✅ reuse existing root if present
+  var root = container[ROOT_KEY];
+  if (!root) {
+    root = createRoot(container);
+    container[ROOT_KEY] = root;
+  }
   root.render(/*#__PURE__*/React.createElement(Wrapper, props));
   return {
     updateExternalEvent: function updateExternalEvent(newExternalEvent) {
@@ -91,7 +89,10 @@ export function renderKitchenSimulator(container) {
       (_apiRef = apiRef) === null || _apiRef === void 0 || (_apiRef$enqueueExtern = _apiRef.enqueueExternalEvent) === null || _apiRef$enqueueExtern === void 0 || _apiRef$enqueueExtern.call(_apiRef, newExternalEvent);
     },
     unmount: function unmount() {
-      root.unmount();
+      var _container$ROOT_KEY, _container$ROOT_KEY$u;
+      // ✅ unmount and clear the stored root
+      (_container$ROOT_KEY = container[ROOT_KEY]) === null || _container$ROOT_KEY === void 0 || (_container$ROOT_KEY$u = _container$ROOT_KEY.unmount) === null || _container$ROOT_KEY$u === void 0 || _container$ROOT_KEY$u.call(_container$ROOT_KEY);
+      container[ROOT_KEY] = null;
       apiRef = null;
     }
   };

package/lib/LiteKitchenConfigurator.js

@@ -117,7 +117,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
     _this.closeCabinetTB = _this.closeCabinetTB.bind(_this);
     _this.closeFinishingTB = _this.closeFinishingTB.bind(_this);
     _this.closeApplianceTB = _this.closeApplianceTB.bind(_this);
-    _this.setToolbar = _this.setToolbar.bind(_this);
     _this.replaceCabinet = _this.replaceCabinet.bind(_this);
     _this.setSubmitToSave = _this.setSubmitToSave.bind(_this);
     _this.setSignOpen = _this.setSignOpen.bind(_this);
@@ -132,13 +131,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
   // Toolbar control functions
   (0, _inherits2["default"])(LiteKitchenConfigurator, _Component);
   return (0, _createClass2["default"])(LiteKitchenConfigurator, [{
-    key: "setToolbar",
-    value: function setToolbar(toolBarKey) {
-      this.setState({
-        toolbar: toolBarKey
-      });
-    }
-  }, {
     key: "setShowProperty",
     value: function setShowProperty(value) {
       this.setState({
@@ -421,7 +413,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
         catalog: this.props.catalog,
         state: extractedState,
         toolBar: this.state.toolbar,
-        setToolbar: this.setToolbar,
         replaceCabinet: this.replaceCabinet,
         keyDownEnable: !savePopupVisible && !quotePopupVisible && !assistPopupVisible
       }, props, {

package/lib/components/content.js

@@ -24,7 +24,6 @@ function Content(_ref) {
     state = _ref.state,
     customContents = _ref.customContents,
     match = _ref.match,
-    setToolbar = _ref.setToolbar,
     replaceCabinet = _ref.replaceCabinet,
     keyDownEnable = _ref.keyDownEnable,
     catalog = _ref.catalog,
@@ -136,7 +135,6 @@ function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         keyDownEnable: keyDownEnable,
         catalog: catalog
@@ -147,7 +145,6 @@ function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         keyDownEnable: keyDownEnable,
         downloadFlag: false,
@@ -188,7 +185,6 @@ function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         onInternalEvent: onInternalEvent
       });
@@ -203,7 +199,6 @@ function Content(_ref) {
         state: state,
         width: width,
         height: height,
-        setToolbar: setToolbar,
         replaceCabinet: replaceCabinet,
         keyDownEnable: keyDownEnable,
         downloadFlag: false,

package/lib/components/viewer2d/viewer2d.js

@@ -135,7 +135,6 @@ function Viewer2D(_ref) {
   var state = _ref.state,
     width = _ref.width,
     height = _ref.height,
-    setToolbar = _ref.setToolbar,
     replaceCabinet = _ref.replaceCabinet,
     onInternalEvent = _ref.onInternalEvent;
   var _useAppContext = (0, _useAppContext2.useAppContext)(),
@@ -842,7 +841,6 @@ function Viewer2D(_ref) {
             verticesActions.beginDraggingVertex(elementData.layer, elementData.id, x, y, state.snapMask);
             break;
           case 'items':
-            setToolbar('');
             current_sel_obj_id = elementData.id;
             if (elementData.part === 'rotation-anchor') itemsActions.beginRotatingItem(elementData.layer, elementData.id, x, y);else if (elementData.part === 'remove') break;else if (elementData.part === 'duplicate') break;else if (elementData.part === 'warning_edit') break;else {
               // closes the setting dialog
@@ -877,9 +875,6 @@ function Viewer2D(_ref) {
     // setRulerEdit(null);
     var event = viewerEvent.originalEvent;
     var bbox = event.target.getBoundingClientRect();
-    if (!mode.includes('ING')) {
-      setToolbar('');
-    }
     // bbox.width = event.target.getBBox().width;
     // bbox.height = event.target.getBBox().height;
     if (event.target.tagName === 'rect') {

package/lib/components/viewer3d/front3D.js

@@ -17,7 +17,6 @@ function Front3D(_ref) {
   var width = _ref.width,
     height = _ref.height,
     state = _ref.state,
-    setToolbar = _ref.setToolbar,
     replaceCabinet = _ref.replaceCabinet,
     keyDownEnable = _ref.keyDownEnable,
     catalog = _ref.catalog;
@@ -31,15 +30,6 @@ function Front3D(_ref) {
     k++;
     setMode(state.get('mode'));
   }
-  var mouseUpEvent = function mouseUpEvent(event) {
-    setToolbar('');
-  };
-  (0, _react.useEffect)(function () {
-    if (!(0, _utils.isEmpty)(document.getElementById('front'))) document.getElementById('front').addEventListener('mouseup', mouseUpEvent);
-    return function () {
-      if (!(0, _utils.isEmpty)(document.getElementById('front'))) document.getElementById('front').removeEventListener('mouseup', mouseUpEvent);
-    };
-  }, []);
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("svg", {
     width: sceneWidth,
     height: sceneHeight,
@@ -62,7 +52,6 @@ function Front3D(_ref) {
     state: state,
     width: width,
     height: height,
-    setToolbar: setToolbar,
     replaceCabinet: replaceCabinet,
     keyDownEnable: keyDownEnable,
     downloadFlag: false

package/lib/components/viewer3d/viewer3d-first-person.js

@@ -31,6 +31,7 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
     var _this;
     (0, _classCallCheck2["default"])(this, Viewer3DFirstPerson);
     _this = _callSuper(this, Viewer3DFirstPerson, [props]);
+    _this.canvasWrapperRef = /*#__PURE__*/_react["default"].createRef();
     _this.width = props.width;
     _this.height = props.height;
     _this.stopRendering = false;
@@ -64,7 +65,7 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
       };
       var state = this.props.state;
       var data = state.scene;
-      var canvasWrapper = _reactDom["default"].findDOMNode(this.refs.canvasWrapper);
+      var canvasWrapper = this.canvasWrapperRef.current;
       var scene3D = new Three.Scene();
 
       // As I need to show the pointer above all scene objects, I use this workaround http://stackoverflow.com/a/13309722
@@ -307,7 +308,7 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
     key: "render",
     value: function render() {
       return /*#__PURE__*/_react["default"].createElement('div', {
-        ref: 'canvasWrapper'
+        ref: this.canvasWrapperRef
       });
     }
   }]);

package/lib/components/viewer3d/viewer3d.js

@@ -58,6 +58,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
     _this.width = props.width;
     _this.height = props.height;
     _this.renderingID = 0;
+    _this.canvasWrapperRef = /*#__PURE__*/_react["default"].createRef();
     var mode = props.state.mode;
     if (!window.__elevationRendererDownload) {
       window.__elevationRendererDownload = {};
@@ -1294,7 +1295,6 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         }
         if (_this2.props.state.mode == _constants.MODE_DRAWING_ITEM_3D) return;
         if (isSelected) {
-          !_this2.props.downloadFlag && _this2.props.setToolbar('');
           if (intersects.length > 0 && !isNaN(intersects[0].distance)) {
             var _i1;
             for (_i1 = 0; _i1 < intersects.length; _i1++) {
@@ -1399,9 +1399,6 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         }
         scene3D.remove(angleObj);
         scene3D.remove(toolObj);
-        if (!_this2.props.downloadFlag && !_this2.props.state.mode.includes('ING')) {
-          _this2.props.setToolbar('');
-        }
         if (_this2.props.state.mode == _constants.MODE_DRAWING_ITEM_3D) {
           if (Point.x > _this2.props.state.scene.width) Point.x = _this2.props.state.width;
           if (Point.y > _this2.props.state.scene.height) Point.y = _this2.props.state.height;
@@ -2199,7 +2196,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       }
 
       // Add the output of the renderer to the html element
-      var canvasWrapper = _reactDom["default"].findDOMNode(this.refs.canvasWrapper);
+      var canvasWrapper = this.canvasWrapperRef.current;
       canvasWrapper && canvasWrapper.appendChild(this.renderer.domElement);
 
       //
@@ -2680,7 +2677,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         this.renderer.domElement.style.opacity = '1';
         !this.props.downloadFlag && document.getElementById('front') && (document.getElementById('front').style.display = 'block');
         return /*#__PURE__*/_react["default"].createElement('div', {
-          ref: 'canvasWrapper'
+          ref: this.canvasWrapperRef
         });
       }
     }

package/lib/index.js

@@ -17,6 +17,7 @@ var _client = require("react-dom/client");
 var _LiteRenderer = _interopRequireDefault(require("./LiteRenderer"));
 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; })(); }
+var ROOT_KEY = '__kitchenSimulatorRoot__';
 function renderKitchenSimulator(container) {
   var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var apiRef = null;
@@ -33,8 +34,7 @@ function renderKitchenSimulator(container) {
       apiRef = {
         enqueueExternalEvent: function enqueueExternalEvent(ev) {
           return _this.enqueue(ev);
-        },
-        unmount: function unmount() {}
+        }
       };
       return _this;
     }
@@ -56,11 +56,7 @@ function renderKitchenSimulator(container) {
           return;
         }
         this.processing = true;
-
-        // Separate task => prevents React 18 batching from collapsing updates
         setTimeout(function () {
-          // setting null first ensures `prevProps.externalEvent !== externalEvent`
-          // even if two events are referentially equal or key logic is weird
           _this2.setState({
             externalEvent: null
           }, function () {
@@ -74,9 +70,7 @@ function renderKitchenSimulator(container) {
       key: "componentDidUpdate",
       value: function componentDidUpdate(prevProps, prevState) {
         var _this3 = this;
-        // When the event was delivered, schedule the next one
         if (prevState.externalEvent !== this.state.externalEvent) {
-          // Give LiteKitchenConfigurator a chance to react in its componentDidUpdate
           setTimeout(function () {
             return _this3.processNext();
           }, 0);
@@ -90,8 +84,12 @@ function renderKitchenSimulator(container) {
         }));
       }
     }]);
-  }(_react["default"].Component);
-  var root = (0, _client.createRoot)(container);
+  }(_react["default"].Component); // ✅ reuse existing root if present
+  var root = container[ROOT_KEY];
+  if (!root) {
+    root = (0, _client.createRoot)(container);
+    container[ROOT_KEY] = root;
+  }
   root.render(/*#__PURE__*/_react["default"].createElement(Wrapper, props));
   return {
     updateExternalEvent: function updateExternalEvent(newExternalEvent) {
@@ -99,7 +97,10 @@ function renderKitchenSimulator(container) {
       (_apiRef = apiRef) === null || _apiRef === void 0 || (_apiRef$enqueueExtern = _apiRef.enqueueExternalEvent) === null || _apiRef$enqueueExtern === void 0 || _apiRef$enqueueExtern.call(_apiRef, newExternalEvent);
     },
     unmount: function unmount() {
-      root.unmount();
+      var _container$ROOT_KEY, _container$ROOT_KEY$u;
+      // ✅ unmount and clear the stored root
+      (_container$ROOT_KEY = container[ROOT_KEY]) === null || _container$ROOT_KEY === void 0 || (_container$ROOT_KEY$u = _container$ROOT_KEY.unmount) === null || _container$ROOT_KEY$u === void 0 || _container$ROOT_KEY$u.call(_container$ROOT_KEY);
+      container[ROOT_KEY] = null;
       apiRef = null;
     }
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchen-simulator",
-  "version": "4.1.5-react-18",
+  "version": "4.1.7-react-18",
   "description": "It is a kitchen simulator (self-contained micro-frontend).",
   "license": "MIT",
   "main": "lib/index.js",