kitchen-simulator 3.12.0-test.2 → 3.12.0-test.3

package/es/index.js

@@ -249,10 +249,10 @@ export function renderKitchenSimulator(container) {
 
   // ✅ Reuse existing API for same container
   if (container[API_KEY]) {
-    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];
+    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;
   }
 
   // ✅ Reuse root for same container
@@ -447,32 +447,80 @@ 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);
-      console.log({
-        lastProps: lastProps,
-        nextProps: nextProps
-      });
+      lastProps = _objectSpread(_objectSpread({}, lastProps), nextProps || {});
       root.render(/*#__PURE__*/React.createElement(Wrapper, lastProps));
     },
-    updateContainerDimensions: function updateContainerDimensions(width, height) {
-      var extraProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-      if (destroyed) return false;
-
-      // optional: accept numbers or strings, up to you
-      console.log({
-        width: width,
-        height: height
-      });
-      api.__render(_objectSpread(_objectSpread(_objectSpread({}, lastProps), extraProps), {}, {
-        width: width,
-        height: height
-      }));
-      return true;
-    },
     /**
      * Send one or many events (in order).
      * Resolves when this batch has been delivered + settled.
@@ -555,6 +603,17 @@ 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);
@@ -564,6 +623,20 @@ 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/lib/index.js

@@ -257,10 +257,10 @@ function renderKitchenSimulator(container) {
 
   // ✅ Reuse existing API for same container
   if (container[API_KEY]) {
-    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];
+    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;
   }
 
   // ✅ Reuse root for same container
@@ -455,32 +455,80 @@ 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);
-      console.log({
-        lastProps: lastProps,
-        nextProps: nextProps
-      });
+      lastProps = _objectSpread(_objectSpread({}, lastProps), nextProps || {});
       root.render(/*#__PURE__*/_react["default"].createElement(Wrapper, lastProps));
     },
-    updateContainerDimensions: function updateContainerDimensions(width, height) {
-      var extraProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-      if (destroyed) return false;
-
-      // optional: accept numbers or strings, up to you
-      console.log({
-        width: width,
-        height: height
-      });
-      api.__render(_objectSpread(_objectSpread(_objectSpread({}, lastProps), extraProps), {}, {
-        width: width,
-        height: height
-      }));
-      return true;
-    },
     /**
      * Send one or many events (in order).
      * Resolves when this batch has been delivered + settled.
@@ -563,6 +611,17 @@ 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);
@@ -572,6 +631,20 @@ 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/package.json

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