{"slug": "chat-sdk-agents-can-now-stream-generative-ui-with-json-render", "title": "Chat SDK agents can now stream generative UI with json-render", "summary": "Chat SDK agents can now stream generative UI through json-render, which converts a JSON spec written against a typed component catalog into a Chat SDK card that each adapter posts in its platform's native format, such as Block Kit on Slack and Adaptive Cards on Teams. The streamCard function posts the card once its root element has content and updates the message as new elements arrive, sending edits at most once every 500 ms by default to match Chat SDK's streaming interval, while toCard validates every element's props against its component schema and throws CardSpecError with a readable issue per problem so the list can be sent back to the model for a corrected spec. Because platforms cap single-message content and adapters degrade past those caps — the Slack adapter turns a second table into a code block — developers can pass limits to reject such specs instead.", "body_md": "You can now stream generative UI from your [Chat SDK](https://chat-sdk.dev) agent with [json-render](https://json-render.dev).\n\nWith a typed catalog of components, the agent writes a JSON spec that `json-render` converts into a Chat SDK card. Each adapter then posts the card in its platform’s native format, such as Block Kit on Slack and Adaptive Cards on Teams.\n\nThe catalog covers tables, charts, buttons, and more, so there’s no separate tool to build and maintain for each message shape.\n\n`streamCard` posts the card once its root element has content and updates the message as new elements stream in. Edits go out at most once every 500 ms by default, which matches Chat SDK’s streaming interval. Once the stream ends, the message shows the final, validated card.\n\n`toCard` checks every element’s props against its component schema and throws `CardSpecError` for an invalid spec. Each problem gets its own readable issue, so you can send the list back to the model for a corrected spec.\n\nPlatforms cap what a single message can hold, and Chat SDK adapters degrade content past those caps. The Slack adapter, for example, turns a second table into a code block. Pass `limits` to reject those specs instead.\n\nRead the [documentation](https://json-render.dev/docs/api/chat) to get started, or [try the playground](https://chat-sdk-demo.json-render.dev).", "url": "https://wpnews.pro/news/chat-sdk-agents-can-now-stream-generative-ui-with-json-render", "canonical_source": "https://vercel.com/changelog/json-render-and-chat-sdk-agents", "published_at": "2026-11-06 21:00:00+00:00", "updated_at": "2026-11-06 23:50:35.873786+00:00", "lang": "en", "topics": ["ai-agents", "developer-tools", "generative-ai", "ai-tools"], "entities": ["Chat SDK", "json-render", "Slack", "Microsoft Teams", "Block Kit", "Adaptive Cards", "CardSpecError"], "also_reported_by": [], "alternates": {"html": "https://wpnews.pro/news/chat-sdk-agents-can-now-stream-generative-ui-with-json-render", "markdown": "https://wpnews.pro/news/chat-sdk-agents-can-now-stream-generative-ui-with-json-render.md", "text": "https://wpnews.pro/news/chat-sdk-agents-can-now-stream-generative-ui-with-json-render.txt", "jsonld": "https://wpnews.pro/news/chat-sdk-agents-can-now-stream-generative-ui-with-json-render.jsonld"}}