@ai-gui/react 0.4.0 → 0.4.2

package/dist/index.cjs

@@ -230,17 +230,11 @@ function renderNode(node, ctx) {
 			"data-aigui-block-loading": "",
 			"data-block-type": node.type
 		}, node.key);
-		try {
-			const out = r(node);
-			if (out && typeof out.then === "function") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AsyncOutput, {
-				promise: out,
-				sanitize: ctx.sanitize,
-				context: ctx
-			}, node.key);
-			return renderOutput(out, node.key, ctx.sanitize, ctx);
-		} catch {
-			return renderFallback(node, ctx);
-		}
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PluginOutputHost, {
+			node,
+			renderer: r,
+			context: ctx
+		}, node.key);
 	}
 	switch (node.type) {
 		case "heading": return (0, react.createElement)(node.tag ?? "h1", {
@@ -258,6 +252,33 @@ function renderNode(node, ctx) {
 		default: return renderFallback(node, ctx);
 	}
 }
+function PluginOutputHost({ node, renderer, context }) {
+	const cache = (0, react.useRef)();
+	const signature = nodeSignature(node);
+	try {
+		if (!cache.current || cache.current.renderer !== renderer || cache.current.signature !== signature) cache.current = {
+			renderer,
+			signature,
+			output: renderer(node)
+		};
+		const output = cache.current.output;
+		if (output && typeof output.then === "function") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AsyncOutput, {
+			promise: output,
+			sanitize: context.sanitize,
+			context
+		});
+		return renderOutput(output, void 0, context.sanitize, context);
+	} catch {
+		return renderFallback(node, context);
+	}
+}
+function nodeSignature(node) {
+	try {
+		return JSON.stringify(node);
+	} catch {
+		return node;
+	}
+}
 function renderFallback(node, ctx) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { dangerouslySetInnerHTML: { __html: renderHtml(node.html ?? node.content ?? "", ctx) } }, node.key);
 }

package/dist/index.js

@@ -206,17 +206,11 @@ function renderNode(node, ctx) {
 			"data-aigui-block-loading": "",
 			"data-block-type": node.type
 		}, node.key);
-		try {
-			const out = r(node);
-			if (out && typeof out.then === "function") return /* @__PURE__ */ jsx(AsyncOutput, {
-				promise: out,
-				sanitize: ctx.sanitize,
-				context: ctx
-			}, node.key);
-			return renderOutput(out, node.key, ctx.sanitize, ctx);
-		} catch {
-			return renderFallback(node, ctx);
-		}
+		return /* @__PURE__ */ jsx(PluginOutputHost, {
+			node,
+			renderer: r,
+			context: ctx
+		}, node.key);
 	}
 	switch (node.type) {
 		case "heading": return createElement(node.tag ?? "h1", {
@@ -234,6 +228,33 @@ function renderNode(node, ctx) {
 		default: return renderFallback(node, ctx);
 	}
 }
+function PluginOutputHost({ node, renderer, context }) {
+	const cache = useRef();
+	const signature = nodeSignature(node);
+	try {
+		if (!cache.current || cache.current.renderer !== renderer || cache.current.signature !== signature) cache.current = {
+			renderer,
+			signature,
+			output: renderer(node)
+		};
+		const output = cache.current.output;
+		if (output && typeof output.then === "function") return /* @__PURE__ */ jsx(AsyncOutput, {
+			promise: output,
+			sanitize: context.sanitize,
+			context
+		});
+		return renderOutput(output, void 0, context.sanitize, context);
+	} catch {
+		return renderFallback(node, context);
+	}
+}
+function nodeSignature(node) {
+	try {
+		return JSON.stringify(node);
+	} catch {
+		return node;
+	}
+}
 function renderFallback(node, ctx) {
 	return /* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: renderHtml(node.html ?? node.content ?? "", ctx) } }, node.key);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-gui/react",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "React adapter for AIGUI — stream LLM output into live React components with cards, plugins, and interactive widgets.",
   "keywords": [
     "llm",
@@ -50,7 +50,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@ai-gui/core": "0.4.0"
+    "@ai-gui/core": "0.4.2"
   },
   "peerDependencies": {
     "react": ">=18",