kitchen-simulator 5.10.9-react.18 → 5.10.11-react.18

package/es/LiteKitchenConfigurator.js

@@ -43,6 +43,10 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
     var _this;
     _classCallCheck(this, LiteKitchenConfigurator);
     _this = _callSuper(this, LiteKitchenConfigurator, [props]);
+    _this._catalogInitRequested = false;
+    _this._lastHandledExternalEvent = null;
+    _this._handlingExternalEvent = false;
+    _this._scheduledExternalEventRaf = null;
     _this.state = {
       savePopupVisible: false,
       quotePopupVisible: false,
@@ -292,30 +296,86 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function componentDidMount() {
       var _extractedState$getIn;
-      window.forRedo = [];
       var _this$props = this.props,
         catalog = _this$props.catalog,
         extractedState = _this$props.extractedState,
         projectActions = _this$props.projectActions;
       var catalogReady = extractedState === null || extractedState === void 0 || (_extractedState$getIn = extractedState.getIn) === null || _extractedState$getIn === void 0 ? void 0 : _extractedState$getIn.call(extractedState, ['catalog', 'ready']);
-      if (!catalogReady) projectActions.initCatalog(catalog);
+      if (!catalogReady && !this._catalogInitRequested) {
+        this._catalogInitRequested = true;
+        console.log('[LiteKitchenConfigurator] initCatalog (mount)');
+        projectActions.initCatalog(catalog);
+      }
     }
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
-      var _extractedState$getIn2;
+      var _this2 = this,
+        _extractedState$getIn2;
       var _this$props2 = this.props,
         externalEvent = _this$props2.externalEvent,
         extractedState = _this$props2.extractedState,
         projectActions = _this$props2.projectActions,
         catalog = _this$props2.catalog;
 
-      // same behavior: handle external event when it changes
-      if (prevProps.externalEvent !== externalEvent) {
-        handleExternalEvent(this.props);
+      // ---- (A) External event handling (snapshot + defer) ----
+      if (prevProps.externalEvent !== externalEvent && externalEvent) {
+        if (this._lastHandledExternalEvent === externalEvent) {
+          console.warn('[LiteKitchenConfigurator] externalEvent already handled (same ref), skipping');
+        } else if (this._handlingExternalEvent) {
+          console.warn('[LiteKitchenConfigurator] externalEvent handling already in progress, skipping');
+        } else {
+          this._lastHandledExternalEvent = externalEvent;
+          this._handlingExternalEvent = true;
+
+          // capture props snapshot corresponding to this event
+          var propsSnapshot = this.props;
+          var type = (externalEvent === null || externalEvent === void 0 ? void 0 : externalEvent.type) || 'unknown';
+          if (this._scheduledExternalEventRaf) {
+            cancelAnimationFrame(this._scheduledExternalEventRaf);
+            this._scheduledExternalEventRaf = null;
+          }
+          this._scheduledExternalEventRaf = requestAnimationFrame(function () {
+            _this2._scheduledExternalEventRaf = null;
+            console.time("[handleExternalEvent] ".concat(type));
+            try {
+              // IMPORTANT: use snapshot so handler sees matching props
+              handleExternalEvent(propsSnapshot);
+            } catch (e) {
+              console.error('[LiteKitchenConfigurator] handleExternalEvent crashed', e);
+            } finally {
+              console.timeEnd("[handleExternalEvent] ".concat(type));
+
+              // clear flag in a macrotask so we definitely yield once
+              setTimeout(function () {
+                _this2._handlingExternalEvent = false;
+              }, 0);
+            }
+          });
+        }
       }
+
+      // ---- (B) initCatalog: request once until ready ----
       var catalogReady = extractedState === null || extractedState === void 0 || (_extractedState$getIn2 = extractedState.getIn) === null || _extractedState$getIn2 === void 0 ? void 0 : _extractedState$getIn2.call(extractedState, ['catalog', 'ready']);
-      if (!catalogReady) projectActions.initCatalog(catalog);
+      if (catalogReady) {
+        if (this._catalogInitRequested) console.log('[LiteKitchenConfigurator] catalog ready');
+        this._catalogInitRequested = false;
+      } else {
+        if (!this._catalogInitRequested) {
+          this._catalogInitRequested = true;
+          console.log('[LiteKitchenConfigurator] initCatalog (update)');
+          projectActions.initCatalog(catalog);
+        }
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      // cleanup scheduled external event
+      if (this._scheduledExternalEventRaf) {
+        cancelAnimationFrame(this._scheduledExternalEventRaf);
+        this._scheduledExternalEventRaf = null;
+      }
     }
   }, {
     key: "isProjectEmpty",
@@ -365,7 +425,7 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this2 = this;
+      var _this3 = this;
       var _this$props3 = this.props,
         width = _this$props3.width,
         height = _this$props3.height,
@@ -381,7 +441,7 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
       var contentH = height;
       var extracted = this.getExtractedStateWithViewer2DInit(extractedState, width, height);
       var ctxValue = _objectSpread(_objectSpread({}, objectsMap(actions, function (actionNamespace) {
-        return _this2.props[actionNamespace];
+        return _this3.props[actionNamespace];
       })), {}, {
         translator: this.props.translator,
         catalog: this.props.catalog

package/es/index.js

@@ -21,13 +21,6 @@ import LiteRenderer from "./LiteRenderer";
 import { createRoot } from 'react-dom/client';
 var ROOT_KEY = '__kitchenSimulatorRoot__';
 var API_KEY = '__kitchenSimulatorApi__';
-
-/**
- * Debug logging
- * - Enable via:
- *   - window.__kitchenSimulatorDebug__ = true
- *   - or pass props.debug = true to renderKitchenSimulator(container, { debug: true })
- */
 function makeLogger(getEnabled) {
   var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '[kitchen-simulator]';
   var now = function now() {
@@ -38,7 +31,6 @@ function makeLogger(getEnabled) {
       if (v == null) return v;
       if (typeof v === 'string') return v;
       if (typeof v === 'number' || typeof v === 'boolean') return v;
-      // avoid huge logs
       return JSON.stringify(v, function (k, val) {
         if (k === 'children' || k === 'parent') return '[omitted]';
         if (typeof val === 'function') return '[fn]';
@@ -51,7 +43,6 @@ function makeLogger(getEnabled) {
   var log = function log() {
     var _console;
     if (!getEnabled()) return;
-    // eslint-disable-next-line no-console
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
@@ -60,7 +51,6 @@ function makeLogger(getEnabled) {
   var warn = function warn() {
     var _console2;
     if (!getEnabled()) return;
-    // eslint-disable-next-line no-console
     for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       args[_key2] = arguments[_key2];
     }
@@ -69,7 +59,6 @@ function makeLogger(getEnabled) {
   var error = function error() {
     var _console3;
     if (!getEnabled()) return;
-    // eslint-disable-next-line no-console
     for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
       args[_key3] = arguments[_key3];
     }
@@ -81,11 +70,6 @@ function makeLogger(getEnabled) {
     error: error
   };
 }
-function nextFrame() {
-  return new Promise(function (resolve) {
-    return requestAnimationFrame(resolve);
-  });
-}
 
 // DIY-714 [Temp Fix] Rewrite API URLs
 var API_HOST_REGEX = /(https?:\/\/)?(api\.diydesignspace\.com|api\.addovisuals\.com|127\.0\.0\.1:4002)/;
@@ -159,7 +143,7 @@ function installGltfTracker() {
     try {
       var _url$toString, _url$toString2;
       var s = typeof url === 'string' ? url : (_url$toString = url === null || url === void 0 || (_url$toString2 = url.toString) === null || _url$toString2 === void 0 ? void 0 : _url$toString2.call(url)) !== null && _url$toString !== void 0 ? _url$toString : '';
-      var u = s.toLowerCase().split('?')[0]; // ignore cache params
+      var u = s.toLowerCase().split('?')[0];
       return u.endsWith('.gltf') || u.endsWith('.glb') || u.endsWith('.bin') || u.endsWith('.ktx2') || u.endsWith('.hdr') || u.endsWith('.exr') || u.endsWith('.png') || u.endsWith('.jpg') || u.endsWith('.jpeg') || u.endsWith('.webp');
     } catch (_unused2) {
       return false;
@@ -181,7 +165,7 @@ function installGltfTracker() {
   };
   var subscribe = function subscribe(fn) {
     g.listeners.add(fn);
-    fn(g.inFlight); // sync emit on subscribe
+    fn(g.inFlight);
     return function () {
       return g.listeners["delete"](fn);
     };
@@ -191,7 +175,7 @@ function installGltfTracker() {
     if (g.installed) return;
     log('Installing GLTF tracker hooks');
 
-    // ---- XHR hook ----
+    // XHR hook
     var XHR = window.XMLHttpRequest;
     if (XHR !== null && XHR !== void 0 && (_XHR$prototype = XHR.prototype) !== null && _XHR$prototype !== void 0 && _XHR$prototype.open && XHR !== null && XHR !== void 0 && (_XHR$prototype2 = XHR.prototype) !== null && _XHR$prototype2 !== void 0 && _XHR$prototype2.send) {
       g.originalOpen = XHR.prototype.open;
@@ -199,12 +183,10 @@ function installGltfTracker() {
       XHR.prototype.open = function (method, url) {
         var _g$originalOpen;
         this.__is3dAssetRequest = is3dAssetUrl(url);
-        if (this.__is3dAssetRequest) {
-          log('XHR open (3D asset)', {
-            method: method,
-            url: url
-          });
-        }
+        if (this.__is3dAssetRequest) log('XHR open (3D asset)', {
+          method: method,
+          url: url
+        });
         for (var _len4 = arguments.length, rest = new Array(_len4 > 2 ? _len4 - 2 : 0), _key4 = 2; _key4 < _len4; _key4++) {
           rest[_key4 - 2] = arguments[_key4];
         }
@@ -240,7 +222,7 @@ function installGltfTracker() {
       warn('XHR hooks not installed (missing open/send)');
     }
 
-    // ---- fetch hook ----
+    // fetch hook
     g.originalFetch = window.fetch;
     if (typeof g.originalFetch === 'function') {
       window.fetch = /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
@@ -264,7 +246,7 @@ function installGltfTracker() {
               for (_len6 = _args2.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
                 args[_key6] = _args2[_key6];
               }
-              input = args[0], init = args[1]; // DIY-714 [Temp Fix] Rewrite API URLs
+              input = args[0], init = args[1];
               if (typeof input === 'string') {
                 input = rewriteApiUrl(input);
               } else if (input instanceof Request) {
@@ -320,34 +302,51 @@ function installGltfTracker() {
     }
     g.installed = true;
   };
-
-  // “No grace” but stable: idle must remain idle for 2 RAF frames
+  function nextFrame() {
+    return _nextFrame.apply(this, arguments);
+  }
+  function _nextFrame() {
+    _nextFrame = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
+      return _regeneratorRuntime.wrap(function (_context5) {
+        while (1) switch (_context5.prev = _context5.next) {
+          case 0:
+            return _context5.abrupt("return", new Promise(function (resolve) {
+              return requestAnimationFrame(resolve);
+            }));
+          case 1:
+          case "end":
+            return _context5.stop();
+        }
+      }, _callee5);
+    }));
+    return _nextFrame.apply(this, arguments);
+  }
   function waitStableIdle2Frames() {
     return _waitStableIdle2Frames.apply(this, arguments);
   }
   function _waitStableIdle2Frames() {
-    _waitStableIdle2Frames = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
-      return _regeneratorRuntime.wrap(function (_context5) {
-        while (1) switch (_context5.prev = _context5.next) {
+    _waitStableIdle2Frames = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
+      return _regeneratorRuntime.wrap(function (_context6) {
+        while (1) switch (_context6.prev = _context6.next) {
           case 0:
-            _context5.next = 1;
+            _context6.next = 1;
             return nextFrame();
           case 1:
             if (!(g.inFlight !== 0)) {
-              _context5.next = 2;
+              _context6.next = 2;
               break;
             }
-            return _context5.abrupt("return", false);
+            return _context6.abrupt("return", false);
           case 2:
-            _context5.next = 3;
+            _context6.next = 3;
             return nextFrame();
           case 3:
-            return _context5.abrupt("return", g.inFlight === 0);
+            return _context6.abrupt("return", g.inFlight === 0);
           case 4:
           case "end":
-            return _context5.stop();
+            return _context6.stop();
         }
-      }, _callee5);
+      }, _callee6);
     }));
     return _waitStableIdle2Frames.apply(this, arguments);
   }
@@ -365,8 +364,6 @@ function installGltfTracker() {
               timeoutMs: timeoutMs,
               inFlight: g.inFlight
             });
-
-            // Fast path
             _context4.next = 1;
             return waitStableIdle2Frames();
           case 1:
@@ -397,8 +394,6 @@ function installGltfTracker() {
                 error('waitForIdle timeout/reject', (_err$message = err === null || err === void 0 ? void 0 : err.message) !== null && _err$message !== void 0 ? _err$message : err);
                 reject(err);
               };
-
-              // ✅ Real timeout no matter what happens with inFlight changes
               var timer = setTimeout(function () {
                 finishErr(new Error('3D assets did not become idle within timeout'));
               }, timeoutMs);
@@ -415,8 +410,6 @@ function installGltfTracker() {
                         return _context3.abrupt("return");
                       case 1:
                         log('waitForIdle inFlight change', count);
-
-                        // Only care when it hits zero; otherwise we just wait
                         if (!(count !== 0)) {
                           _context3.next = 2;
                           break;
@@ -429,7 +422,6 @@ function installGltfTracker() {
                         stable = _context3.sent;
                         log('waitForIdle stable check', stable);
                         if (stable) finishOk();
-                        // else keep waiting
                       case 4:
                       case "end":
                         return _context3.stop();
@@ -494,6 +486,39 @@ export function renderKitchenSimulator(container) {
     warn = _makeLogger2.warn,
     error = _makeLogger2.error;
 
+  // ---- Long-task observer (find main-thread blocks) ----
+  var longTaskObserver = null;
+  if (typeof window !== 'undefined' && 'PerformanceObserver' in window) {
+    try {
+      longTaskObserver = new PerformanceObserver(function (list) {
+        var _iterator2 = _createForOfIteratorHelper(list.getEntries()),
+          _step2;
+        try {
+          for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+            var entry = _step2.value;
+            // entry.duration is the smoking gun when UI freezes
+            warn('Long task detected', {
+              name: entry.name,
+              duration: entry.duration,
+              startTime: entry.startTime
+            });
+          }
+        } catch (err) {
+          _iterator2.e(err);
+        } finally {
+          _iterator2.f();
+        }
+      });
+      // may throw in some browsers
+      longTaskObserver.observe({
+        entryTypes: ['longtask']
+      });
+      log('Long-task observer installed');
+    } catch (_unused3) {
+      // ignore
+    }
+  }
+
   // ✅ Reuse existing API
   if (container[API_KEY]) {
     var _container$API_KEY$__, _container$API_KEY;
@@ -502,14 +527,12 @@ export function renderKitchenSimulator(container) {
     return container[API_KEY];
   }
 
-  // ✅ Reuse root
+  // ✅ Root
   var root = container[ROOT_KEY];
   if (!root) {
     root = createRoot(container);
     container[ROOT_KEY] = root;
     log('Created new React root');
-  } else {
-    log('Reusing existing React root');
   }
   var setExternalEventFn = null;
   var destroyed = false;
@@ -517,61 +540,70 @@ export function renderKitchenSimulator(container) {
   var pendingMarkers = new Set();
   var MARKER = Symbol('marker');
   var gltfTracker = installGltfTracker(debugEnabled);
-
-  // FAST defaults (safe)
   var defaultFramesPerEvent = (_props$framesPerEvent = props.framesPerEvent) !== null && _props$framesPerEvent !== void 0 ? _props$framesPerEvent : 1;
   var waitForAssets = (_props$waitForGltfIdl = props.waitForGltfIdleAfterEachEvent) !== null && _props$waitForGltfIdl !== void 0 ? _props$waitForGltfIdl : true;
   var defaultTimeout = (_props$gltfTimeoutMs = props.gltfTimeoutMs) !== null && _props$gltfTimeoutMs !== void 0 ? _props$gltfTimeoutMs : 30000;
   var draining = false;
 
-  // ---- Loop detection / profiling helpers ----
-  var drainRunId = 0;
-  var eventSeq = 0;
-  var lastEvents = [];
-  var LAST_N = 40;
-  function summarizeEvent(ev) {
-    var _ref5, _ref6, _ev$type, _ev$payload, _ref7, _ev$id, _ev$payload2;
-    if (!ev) return ev;
-    var t = (_ref5 = (_ref6 = (_ev$type = ev === null || ev === void 0 ? void 0 : ev.type) !== null && _ev$type !== void 0 ? _ev$type : ev === null || ev === void 0 || (_ev$payload = ev.payload) === null || _ev$payload === void 0 ? void 0 : _ev$payload.mode) !== null && _ref6 !== void 0 ? _ref6 : ev === null || ev === void 0 ? void 0 : ev.name) !== null && _ref5 !== void 0 ? _ref5 : 'unknown';
-    var id = (_ref7 = (_ev$id = ev === null || ev === void 0 ? void 0 : ev.id) !== null && _ev$id !== void 0 ? _ev$id : ev === null || ev === void 0 || (_ev$payload2 = ev.payload) === null || _ev$payload2 === void 0 ? void 0 : _ev$payload2.id) !== null && _ref7 !== void 0 ? _ref7 : null;
-    return {
-      type: t,
-      id: id,
-      framesPerEvent: ev === null || ev === void 0 ? void 0 : ev.framesPerEvent,
-      waitForGltfIdleAfterEachEvent: ev === null || ev === void 0 ? void 0 : ev.waitForGltfIdleAfterEachEvent,
-      gltfTimeoutMs: ev === null || ev === void 0 ? void 0 : ev.gltfTimeoutMs
-    };
-  }
-  function recordEvent(ev) {
-    var s = summarizeEvent(ev);
-    lastEvents.push(s);
-    if (lastEvents.length > LAST_N) lastEvents.shift();
-  }
-  function dumpLoopHint() {
-    var context = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    warn('Possible infinite loop / stall detected', {
-      context: context,
-      destroyed: destroyed,
-      draining: draining,
-      queueLength: queue.length,
-      pendingMarkers: pendingMarkers.size,
-      gltfInFlight: gltfTracker.getInFlight(),
-      lastEvents: lastEvents
+  // ---- Ready gate (super important for first event) ----
+  var readyResolve = null;
+  var readyReject = null;
+  var readyPromise = new Promise(function (res, rej) {
+    readyResolve = res;
+    readyReject = rej;
+  });
+
+  // ---- RAF diagnostic wrapper ----
+  function nextFrameDiag() {
+    var label = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'raf';
+    var warnAfterMs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 250;
+    if (typeof window === 'undefined') return Promise.resolve();
+    return new Promise(function (resolve) {
+      var done = false;
+      var start = performance.now();
+      var t = setTimeout(function () {
+        var _document, _document2;
+        if (done) return;
+
+        // If this fires, RAF is not arriving (hidden tab / throttling) or main thread blocked
+        warn('RAF not fired within threshold', {
+          label: label,
+          warnAfterMs: warnAfterMs,
+          elapsedMs: performance.now() - start,
+          visibilityState: (_document = document) === null || _document === void 0 ? void 0 : _document.visibilityState,
+          hidden: (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.hidden,
+          gltfInFlight: gltfTracker.getInFlight(),
+          queueLength: queue.length,
+          draining: draining,
+          destroyed: destroyed
+        });
+
+        // Optional fail-open so you don't hang forever:
+        // If you want STRICT behavior, comment the next 2 lines and only keep logging.
+        done = true;
+        resolve();
+      }, warnAfterMs);
+      requestAnimationFrame(function () {
+        if (done) return;
+        done = true;
+        clearTimeout(t);
+        resolve();
+      });
     });
   }
   function isSyncScene(ev) {
-    var _ev$payload3;
-    return (ev === null || ev === void 0 ? void 0 : ev.type) === 'EXTERNAL_EVENT_SYNC_SCENE' || (ev === null || ev === void 0 || (_ev$payload3 = ev.payload) === null || _ev$payload3 === void 0 ? void 0 : _ev$payload3.mode) === 'sync-scene' || (ev === null || ev === void 0 ? void 0 : ev.__sync) === true;
+    var _ev$payload;
+    return (ev === null || ev === void 0 ? void 0 : ev.type) === 'EXTERNAL_EVENT_SYNC_SCENE' || (ev === null || ev === void 0 || (_ev$payload = ev.payload) === null || _ev$payload === void 0 ? void 0 : _ev$payload.mode) === 'sync-scene' || (ev === null || ev === void 0 ? void 0 : ev.__sync) === true;
   }
   function settle(_x2, _x3) {
     return _settle.apply(this, arguments);
   }
   function _settle() {
-    _settle = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7(ev, meta) {
-      var _ev$framesPerEvent, _ev$waitForGltfIdleAf, _ev$gltfTimeoutMs;
-      var frames, shouldWait, timeoutMs, i, start, _e$message2, _t2;
-      return _regeneratorRuntime.wrap(function (_context7) {
-        while (1) switch (_context7.prev = _context7.next) {
+    _settle = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee8(ev, meta) {
+      var _ev$framesPerEvent, _ev$waitForGltfIdleAf, _ev$gltfTimeoutMs, _document7, _document8;
+      var frames, shouldWait, timeoutMs, i, start;
+      return _regeneratorRuntime.wrap(function (_context8) {
+        while (1) switch (_context8.prev = _context8.next) {
           case 0:
             frames = (_ev$framesPerEvent = ev === null || ev === void 0 ? void 0 : ev.framesPerEvent) !== null && _ev$framesPerEvent !== void 0 ? _ev$framesPerEvent : defaultFramesPerEvent;
             shouldWait = (_ev$waitForGltfIdleAf = ev === null || ev === void 0 ? void 0 : ev.waitForGltfIdleAfterEachEvent) !== null && _ev$waitForGltfIdleAf !== void 0 ? _ev$waitForGltfIdleAf : waitForAssets;
@@ -580,69 +612,63 @@ export function renderKitchenSimulator(container) {
               frames: frames,
               shouldWait: shouldWait,
               timeoutMs: timeoutMs,
-              gltfInFlight: gltfTracker.getInFlight()
+              visibilityState: (_document7 = document) === null || _document7 === void 0 ? void 0 : _document7.visibilityState,
+              hidden: (_document8 = document) === null || _document8 === void 0 ? void 0 : _document8.hidden
             }));
 
-            // (1) allow react/reducers to run (fixes “must zoom to see updates”)
+            // (1) RAF frames (diagnostic)
             i = 0;
           case 1:
             if (!(i < frames)) {
-              _context7.next = 3;
+              _context8.next = 4;
               break;
             }
-            _context7.next = 2;
-            return nextFrame();
+            _context8.next = 2;
+            return nextFrameDiag("settle:frame ".concat(i + 1, "/").concat(frames), 500);
           case 2:
+            if (debugEnabled) log('settle:after frame', _objectSpread(_objectSpread({}, meta), {}, {
+              i: i + 1
+            }));
+          case 3:
             i += 1;
-            _context7.next = 1;
+            _context8.next = 1;
             break;
-          case 3:
+          case 4:
             if (!shouldWait) {
-              _context7.next = 8;
+              _context8.next = 6;
               break;
             }
             start = Date.now();
-            _context7.prev = 4;
-            _context7.next = 5;
+            log('settle:waitForIdle start', _objectSpread(_objectSpread({}, meta), {}, {
+              timeoutMs: timeoutMs,
+              gltfInFlight: gltfTracker.getInFlight()
+            }));
+            _context8.next = 5;
             return gltfTracker.waitForIdle({
               timeoutMs: timeoutMs
             });
           case 5:
-            _context7.next = 7;
-            break;
-          case 6:
-            _context7.prev = 6;
-            _t2 = _context7["catch"](4);
-            error('settle:waitForIdle failed', _objectSpread(_objectSpread({}, meta), {}, {
-              err: (_e$message2 = _t2 === null || _t2 === void 0 ? void 0 : _t2.message) !== null && _e$message2 !== void 0 ? _e$message2 : _t2,
-              waitedMs: Date.now() - start,
-              gltfInFlight: gltfTracker.getInFlight()
-            }));
-            // Don’t throw unless you want the whole queue to stop.
-            // Keeping behavior: let it bubble so caller catches and continues.
-            throw _t2;
-          case 7:
             log('settle:waitForIdle done', _objectSpread(_objectSpread({}, meta), {}, {
               waitedMs: Date.now() - start,
               gltfInFlight: gltfTracker.getInFlight()
             }));
-          case 8:
-            _context7.next = 9;
-            return nextFrame();
-          case 9:
+          case 6:
+            _context8.next = 7;
+            return nextFrameDiag('settle:final commit frame', 500);
+          case 7:
             if (!isSyncScene(ev)) {
-              _context7.next = 10;
+              _context8.next = 8;
               break;
             }
-            _context7.next = 10;
-            return nextFrame();
-          case 10:
-            log('settle:done', _objectSpread({}, meta));
-          case 11:
+            _context8.next = 8;
+            return nextFrameDiag('settle:sync-scene extra frame', 500);
+          case 8:
+            log('settle:done', meta);
+          case 9:
           case "end":
-            return _context7.stop();
+            return _context8.stop();
         }
-      }, _callee7, null, [[4, 6]]);
+      }, _callee8);
     }));
     return _settle.apply(this, arguments);
   }
@@ -650,140 +676,108 @@ export function renderKitchenSimulator(container) {
     return _drain.apply(this, arguments);
   }
   function _drain() {
-    _drain = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
-      var myRunId, start, watchdogEveryMs, watchdog, MAX_ITERATIONS, iterations, item, seq, meta, _err$message2, _t3;
-      return _regeneratorRuntime.wrap(function (_context8) {
-        while (1) switch (_context8.prev = _context8.next) {
+    _drain = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee9() {
+      var watchdog, item, meta, _err$message2, _t2;
+      return _regeneratorRuntime.wrap(function (_context9) {
+        while (1) switch (_context9.prev = _context9.next) {
           case 0:
             if (!(draining || destroyed)) {
-              _context8.next = 1;
+              _context9.next = 1;
               break;
             }
-            log('drain:skip', {
+            if (debugEnabled) log('drain:skip', {
               draining: draining,
               destroyed: destroyed,
               queueLength: queue.length
             });
-            return _context8.abrupt("return");
+            return _context9.abrupt("return");
           case 1:
             draining = true;
-            myRunId = drainRunId += 1;
-            start = Date.now();
-            log('drain:start', {
-              runId: myRunId,
-              queueLength: queue.length,
-              pendingMarkers: pendingMarkers.size,
-              gltfInFlight: gltfTracker.getInFlight()
-            });
 
-            // Watchdog: if drain runs too long, dump state (helps spot infinite loops)
-            watchdogEveryMs = 4000;
+            // Watchdog: if we’re “stuck” in draining, dump state periodically
             watchdog = setInterval(function () {
-              dumpLoopHint("drain watchdog runId=".concat(myRunId));
-            }, watchdogEveryMs); // Hard cap of iterations in one drain call (fail-open) to prevent true infinite loops
-            MAX_ITERATIONS = 5000;
-            iterations = 0;
-            _context8.prev = 2;
+              var _document9, _document0;
+              warn('drain watchdog', {
+                destroyed: destroyed,
+                draining: draining,
+                queueLength: queue.length,
+                pendingMarkers: pendingMarkers.size,
+                gltfInFlight: gltfTracker.getInFlight(),
+                visibilityState: (_document9 = document) === null || _document9 === void 0 ? void 0 : _document9.visibilityState,
+                hidden: (_document0 = document) === null || _document0 === void 0 ? void 0 : _document0.hidden
+              });
+            }, 4000);
+            _context9.prev = 2;
+            _context9.next = 3;
+            return readyPromise;
           case 3:
             if (!(!destroyed && queue.length)) {
-              _context8.next = 12;
+              _context9.next = 11;
               break;
             }
-            iterations += 1;
-            if (!(iterations >= MAX_ITERATIONS)) {
-              _context8.next = 4;
-              break;
-            }
-            dumpLoopHint("MAX_ITERATIONS reached runId=".concat(myRunId));
-            // fail-open: stop draining; future drain() calls can continue
-            return _context8.abrupt("continue", 12);
-          case 4:
             if (setExternalEventFn) {
-              _context8.next = 6;
+              _context9.next = 5;
               break;
             }
-            log('drain:waiting for setExternalEventFn');
-            _context8.next = 5;
-            return nextFrame();
+            warn('drain: no setExternalEventFn even after ready (unexpected)');
+            _context9.next = 4;
+            return nextFrameDiag('drain:waiting for setExternalEventFn', 500);
+          case 4:
+            return _context9.abrupt("continue", 3);
           case 5:
-            return _context8.abrupt("continue", 3);
-          case 6:
             item = queue.shift();
             if (!(item && item.__marker === MARKER)) {
-              _context8.next = 7;
+              _context9.next = 6;
               break;
             }
             pendingMarkers["delete"](item.token);
             log('drain:marker consumed', {
-              runId: myRunId,
               pendingMarkers: pendingMarkers.size,
               queueLength: queue.length
             });
-            return _context8.abrupt("continue", 3);
-          case 7:
-            seq = eventSeq += 1;
-            recordEvent(item);
+            return _context9.abrupt("continue", 3);
+          case 6:
             meta = {
-              runId: myRunId,
-              seq: seq,
+              eventType: item === null || item === void 0 ? void 0 : item.type,
               queueLengthAfterShift: queue.length,
               pendingMarkers: pendingMarkers.size,
-              gltfInFlightBefore: gltfTracker.getInFlight(),
-              event: summarizeEvent(item)
+              gltfInFlight: gltfTracker.getInFlight()
             };
             log('drain:event begin', meta);
-            _context8.prev = 8;
+            _context9.prev = 7;
             setExternalEventFn(item);
             log('drain:setExternalEventFn called', meta);
-            _context8.next = 9;
+            _context9.next = 8;
             return settle(item, meta);
-          case 9:
-            log('drain:event done', _objectSpread(_objectSpread({}, meta), {}, {
-              gltfInFlightAfter: gltfTracker.getInFlight()
-            }));
-            _context8.next = 11;
+          case 8:
+            log('drain:event done', meta);
+            _context9.next = 10;
             break;
-          case 10:
-            _context8.prev = 10;
-            _t3 = _context8["catch"](8);
+          case 9:
+            _context9.prev = 9;
+            _t2 = _context9["catch"](7);
             error('drain:event failed', _objectSpread(_objectSpread({}, meta), {}, {
-              err: (_err$message2 = _t3 === null || _t3 === void 0 ? void 0 : _t3.message) !== null && _err$message2 !== void 0 ? _err$message2 : _t3,
-              gltfInFlight: gltfTracker.getInFlight()
+              err: (_err$message2 = _t2 === null || _t2 === void 0 ? void 0 : _t2.message) !== null && _err$message2 !== void 0 ? _err$message2 : _t2
             }));
-            // IMPORTANT: continue so we can eventually consume the marker
-          case 11:
-            // If queue never drains (e.g. events enqueue more events endlessly),
-            // these logs help identify repeating patterns:
-            if (debugEnabled && seq % 50 === 0) {
-              warn('drain:progress snapshot', {
-                runId: myRunId,
-                processedEvents: seq,
-                queueLength: queue.length,
-                pendingMarkers: pendingMarkers.size,
-                gltfInFlight: gltfTracker.getInFlight(),
-                lastEvents: lastEvents
-              });
-            }
-            _context8.next = 3;
+          case 10:
+            _context9.next = 3;
             break;
-          case 12:
-            _context8.prev = 12;
+          case 11:
+            _context9.prev = 11;
             clearInterval(watchdog);
             draining = false;
             log('drain:done', {
-              runId: myRunId,
-              ms: Date.now() - start,
               destroyed: destroyed,
               queueLength: queue.length,
               pendingMarkers: pendingMarkers.size,
               gltfInFlight: gltfTracker.getInFlight()
             });
-            return _context8.finish(12);
-          case 13:
+            return _context9.finish(11);
+          case 12:
           case "end":
-            return _context8.stop();
+            return _context9.stop();
         }
-      }, _callee8, null, [[2,, 12, 13], [8, 10]]);
+      }, _callee9, null, [[2,, 11, 12], [7, 9]]);
     }));
     return _drain.apply(this, arguments);
   }
@@ -804,18 +798,22 @@ export function renderKitchenSimulator(container) {
       value: function componentDidMount() {
         var _this3 = this;
         this._mounted = true;
-        log('Wrapper mounted');
+        log('Wrapper mounted -> ready');
         setExternalEventFn = function setExternalEventFn(newEvent) {
-          if (!_this3._mounted) {
-            warn('setExternalEventFn called while unmounted (ignored)');
-            return;
-          }
-          // This is the most important log to see if you’re triggering re-renders endlessly:
-          log('Wrapper setState(externalEvent)', summarizeEvent(newEvent));
+          if (!_this3._mounted) return;
+          log('Wrapper setState(externalEvent)', {
+            type: newEvent === null || newEvent === void 0 ? void 0 : newEvent.type
+          });
           _this3.setState({
             externalEvent: newEvent
           });
         };
+
+        // ✅ resolve readiness here (first time)
+        if (readyResolve) {
+          readyResolve(true);
+          readyResolve = null;
+        }
       }
     }, {
       key: "componentWillUnmount",
@@ -823,14 +821,18 @@ export function renderKitchenSimulator(container) {
         log('Wrapper will unmount');
         this._mounted = false;
         setExternalEventFn = null;
+
+        // If unmount happens before ready, reject so drain can stop cleanly
+        if (readyReject) {
+          readyReject(new Error('Wrapper unmounted before ready'));
+          readyReject = null;
+        }
       }
     }, {
       key: "render",
       value: function render() {
-        // Render spam can indicate infinite render loop; keep it lightweight
         if (debugEnabled) log('Wrapper render', {
-          hasExternalEvent: !!this.state.externalEvent,
-          externalEvent: summarizeEvent(this.state.externalEvent)
+          hasExternalEvent: !!this.state.externalEvent
         });
         return /*#__PURE__*/React.createElement(LiteRenderer, _extends({}, this.props, {
           externalEvent: this.state.externalEvent
@@ -841,50 +843,45 @@ export function renderKitchenSimulator(container) {
   var api = {
     __render: function __render(nextProps) {
       log('__render called', {
-        debug: !!(nextProps !== null && nextProps !== void 0 && nextProps.debug),
-        framesPerEvent: nextProps === null || nextProps === void 0 ? void 0 : nextProps.framesPerEvent,
-        waitForGltfIdleAfterEachEvent: nextProps === null || nextProps === void 0 ? void 0 : nextProps.waitForGltfIdleAfterEachEvent,
-        gltfTimeoutMs: nextProps === null || nextProps === void 0 ? void 0 : nextProps.gltfTimeoutMs
+        debug: !!(nextProps !== null && nextProps !== void 0 && nextProps.debug)
       });
       root.render(/*#__PURE__*/React.createElement(Wrapper, nextProps));
     },
-    // ✅ host can query current inFlight
+    whenReady: function whenReady() {
+      return readyPromise;
+    },
     getGltfInFlight: function getGltfInFlight() {
-      var v = gltfTracker.getInFlight();
-      log('getGltfInFlight', v);
-      return v;
+      return gltfTracker.getInFlight();
     },
-    // ✅ host can subscribe to inFlight changes (loader)
     subscribeGltfInFlight: function subscribeGltfInFlight(cb) {
-      log('subscribeGltfInFlight');
-      return gltfTracker.subscribe(function (count) {
-        if (debugEnabled) log('gltf inFlight changed', count);
-        cb(count);
-      });
+      return gltfTracker.subscribe(cb);
     },
     sendExternalEvents: function sendExternalEvents(eventOrEvents) {
-      var _ref8 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-        _ref8$timeoutMs = _ref8.timeoutMs,
-        timeoutMs = _ref8$timeoutMs === void 0 ? 60000 : _ref8$timeoutMs;
+      var _document3, _document4;
+      var _ref5 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+        _ref5$timeoutMs = _ref5.timeoutMs,
+        timeoutMs = _ref5$timeoutMs === void 0 ? 60000 : _ref5$timeoutMs;
       var events = Array.isArray(eventOrEvents) ? eventOrEvents : [eventOrEvents];
       var batchId = Math.random().toString(16).slice(2);
       log('sendExternalEvents:enqueue', {
         batchId: batchId,
         count: events.length,
         timeoutMs: timeoutMs,
-        events: events.map(summarizeEvent)
+        visibilityState: (_document3 = document) === null || _document3 === void 0 ? void 0 : _document3.visibilityState,
+        hidden: (_document4 = document) === null || _document4 === void 0 ? void 0 : _document4.hidden,
+        gltfInFlight: gltfTracker.getInFlight()
       });
-      var _iterator2 = _createForOfIteratorHelper(events),
-        _step2;
+      var _iterator3 = _createForOfIteratorHelper(events),
+        _step3;
       try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-          var e = _step2.value;
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var e = _step3.value;
           queue.push(e);
         }
       } catch (err) {
-        _iterator2.e(err);
+        _iterator3.e(err);
       } finally {
-        _iterator2.f();
+        _iterator3.f();
       }
       var token = Symbol('batch');
       pendingMarkers.add(token);
@@ -898,106 +895,89 @@ export function renderKitchenSimulator(container) {
         pendingMarkers: pendingMarkers.size
       });
       drain();
-
-      // resolve when marker cleared
       return new Promise(function (resolve) {
         var start = Date.now();
         var check = /*#__PURE__*/function () {
-          var _ref9 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
-            var spins;
-            return _regeneratorRuntime.wrap(function (_context6) {
-              while (1) switch (_context6.prev = _context6.next) {
+          var _ref6 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
+            var _document5, _document6;
+            return _regeneratorRuntime.wrap(function (_context7) {
+              while (1) switch (_context7.prev = _context7.next) {
                 case 0:
-                  spins = 0;
-                case 1:
                   if (destroyed) {
-                    _context6.next = 5;
+                    _context7.next = 4;
                     break;
                   }
-                  spins += 1;
                   if (pendingMarkers.has(token)) {
-                    _context6.next = 2;
+                    _context7.next = 1;
                     break;
                   }
                   log('sendExternalEvents:resolved', {
                     batchId: batchId,
-                    ms: Date.now() - start,
-                    spins: spins,
-                    queueLength: queue.length
+                    ms: Date.now() - start
                   });
                   resolve(true);
-                  return _context6.abrupt("return");
-                case 2:
+                  return _context7.abrupt("return");
+                case 1:
                   if (!(Date.now() - start > timeoutMs)) {
-                    _context6.next = 3;
+                    _context7.next = 2;
                     break;
                   }
                   error('sendExternalEvents timed out', {
                     batchId: batchId,
                     timeoutMs: timeoutMs,
                     ms: Date.now() - start,
-                    spins: spins,
                     queueLength: queue.length,
                     pendingMarkers: pendingMarkers.size,
                     gltfInFlight: gltfTracker.getInFlight(),
-                    lastEvents: lastEvents
+                    visibilityState: (_document5 = document) === null || _document5 === void 0 ? void 0 : _document5.visibilityState,
+                    hidden: (_document6 = document) === null || _document6 === void 0 ? void 0 : _document6.hidden
                   });
                   pendingMarkers["delete"](token); // fail-open
                   resolve(false);
-                  return _context6.abrupt("return");
+                  return _context7.abrupt("return");
+                case 2:
+                  _context7.next = 3;
+                  return nextFrameDiag("sendExternalEvents:waiting batch=".concat(batchId), 1000);
                 case 3:
-                  // Periodic “I might be stuck” hint
-                  if (debugEnabled && spins % 240 === 0) {
-                    dumpLoopHint("sendExternalEvents waiting batchId=".concat(batchId));
-                  }
-                  _context6.next = 4;
-                  return nextFrame();
-                case 4:
-                  _context6.next = 1;
+                  _context7.next = 0;
                   break;
-                case 5:
-                  warn('sendExternalEvents:destroyed while waiting', {
-                    batchId: batchId
-                  });
+                case 4:
                   resolve(false);
-                case 6:
+                case 5:
                 case "end":
-                  return _context6.stop();
+                  return _context7.stop();
               }
-            }, _callee6);
+            }, _callee7);
           }));
           return function check() {
-            return _ref9.apply(this, arguments);
+            return _ref6.apply(this, arguments);
           };
         }();
         check();
       });
     },
     updateExternalEvent: function updateExternalEvent(e) {
-      log('updateExternalEvent', summarizeEvent(e));
       return api.sendExternalEvents(e);
     },
     clearQueue: function clearQueue() {
-      log('clearQueue', {
-        queueLength: queue.length,
-        pendingMarkers: pendingMarkers.size
-      });
       queue.length = 0;
       pendingMarkers.clear();
     },
     unmount: function unmount() {
-      log('unmount called');
       destroyed = true;
       api.clearQueue();
       gltfTracker.uninstall();
+      try {
+        if (longTaskObserver) longTaskObserver.disconnect();
+      } catch (_unused4) {
+        // ignore
+      }
       var doUnmount = function doUnmount() {
         try {
-          log('root.unmount()');
           root.unmount();
         } finally {
           container[ROOT_KEY] = null;
           container[API_KEY] = null;
-          log('unmounted + cleared container keys');
         }
       };
       if (typeof queueMicrotask === 'function') queueMicrotask(doUnmount);else setTimeout(doUnmount, 0);
@@ -1005,11 +985,6 @@ export function renderKitchenSimulator(container) {
   };
   api.__render(props);
   container[API_KEY] = api;
-
-  // Helpful: show how to enable debug quickly at runtime
-  if (debugEnabled) {
-    log('Debug enabled. Tip: window.__kitchenSimulatorDebug__ = true (global)');
-  }
   return api;
 }
 export default renderKitchenSimulator;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchen-simulator",
-  "version": "5.10.9-react.18",
+  "version": "5.10.11-react.18",
   "description": "It is a kitchen simulator (self-contained micro-frontend).",
   "license": "MIT",
   "module": "es/index.js",