# July 2026 - Introducing @jguang-ui/helpers · JGuang UI

> Small, focused helpers for developing apps, starting with AI SDK and TanStack AI.

- Page: https://jiguang132.com/systems/jguang-ui/docs/changelog/2026-07-helpers
- Based on: shadcn/ui documentation (MIT) @ bc0705384b51252af26dcc65425b216bf5eb063c

We are open sourcing **@jguang-ui/helpers**, a new package for small, focused
helpers that make developing apps easier.

Starting with a helper for AI SDK and TanStack AI. It lets you write a
conversation in code, then run it through the real `useChat` lifecycle without
a model, API route, network request, or API key.

Your UI receives native
framework messages and streaming events, so reasoning, tool calls, loading
states, and message components behave the same way they do in production.

Here is a conversation written with the AI SDK helper:

```text
Use the JGuang UI Registry URL provided on /systems/jguang-ui#install.
```

Pass its messages and transport to `useChat`:

```tsx showLineNumbers
import { useChat } from "@ai-sdk/react"

const initialMessages = chat.get(0)
const transport = chat.transport()

export function Chat() {
  const { messages } = useChat({
    messages: initialMessages,
    transport,
  })
}
```

The package includes two adapters:

- [`JGuang UI Registry`](/systems/jguang-ui/docs/helpers/ai-sdk) plugs into AI SDK's `useChat`
  as a transport.
- [`JGuang UI Registry`](/systems/jguang-ui/docs/helpers/tanstack-ai) plugs into TanStack
  AI's `useChat` as a connection and streams real AG-UI events.

Use it to build components, create previews and demos, write documentation, or
test streaming interfaces with deterministic output and no backend dependency.


  

    

[Read the Docs](/systems/jguang-ui/docs/helpers/ai-sdk)

---

Index of all JGuang resources: https://jiguang132.com/llms.txt