@ai-matrx/canvas 0.9.0 → 0.9.1

package/dist/react.js

@@ -2943,8 +2943,23 @@ var Rendered = memo(function Rendered2({
   presentation
 }) {
   const props = { item, data: item.data, paneId, isFocused, isVisible, canvas, windowId, presentation };
-  return /* @__PURE__ */ jsx6(ItemBoundary, { item, onClose: () => canvas.close(item.id), onRetry: () => resetKindComponent(kind), children: /* @__PURE__ */ jsx6(Suspense, { fallback: /* @__PURE__ */ jsx6("div", { className: "mxc-loading", "aria-busy": "true" }), children: /* @__PURE__ */ jsx6(KindRender, { kind, props }) }) });
+  const [attempt, setAttempt] = useState4(0);
+  const retry = () => {
+    resetKindComponent(kind);
+    setAttempt((n) => n + 1);
+  };
+  return /* @__PURE__ */ jsx6(ItemBoundary, { item, onClose: () => canvas.close(item.id), onRetry: retry, children: /* @__PURE__ */ jsx6(Suspense, { fallback: /* @__PURE__ */ jsx6(LoadingBody, { onRetry: retry, onClose: () => canvas.close(item.id) }), children: /* @__PURE__ */ jsx6(KindRender, { kind, props }) }, attempt) });
 });
+var CANVAS_BODY_STALL_MS = 2e4;
+function LoadingBody({ onRetry, onClose }) {
+  const [stalled, setStalled] = useState4(false);
+  useEffect6(() => {
+    const timer = setTimeout(() => setStalled(true), CANVAS_BODY_STALL_MS);
+    return () => clearTimeout(timer);
+  }, []);
+  if (!stalled) return /* @__PURE__ */ jsx6("div", { className: "mxc-loading", "aria-busy": "true" });
+  return /* @__PURE__ */ jsx6(ItemProblem, { message: "This item is taking a long time to load.", onRetry, onClose });
+}
 function KindRender({ kind, props }) {
   const Render = kindComponent(kind);
   if (!Render) throw new Error(`[@ai-matrx/canvas] kind "${kind.id}" has nothing to render.`);