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

> 本页提供 JGuang UI 技术内容、中文导航与术语适配。

- 页面: https://jiguang132.com/zh/systems/jguang-ui/docs/changelog/2026-07-helpers
- 改编自: shadcn/ui 文档 (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)

---

JGuang 全部资源索引: https://jiguang132.com/llms.txt
