mirror of
https://github.com/vercel-labs/json-render.git
synced 2026-10-03 04:18:15 +08:00
Compare commits
4
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
f3611860a7 | ||
|
|
61ee8e5291 | ||
|
|
d38b281e5e | ||
|
|
39fcc192e9 |
@@ -94,15 +94,15 @@ type Registry = Record<string, React.ComponentType<ComponentRenderProps>>;`}</Co
|
|||||||
|
|
||||||
<h3 className="text-lg font-semibold mt-8 mb-4">useUIStream</h3>
|
<h3 className="text-lg font-semibold mt-8 mb-4">useUIStream</h3>
|
||||||
<Code lang="typescript">{`const {
|
<Code lang="typescript">{`const {
|
||||||
spec, // Spec - current UI state
|
spec, // Spec | null - current UI state
|
||||||
isStreaming, // boolean - true while streaming
|
isStreaming, // boolean - true while streaming
|
||||||
error, // Error | null
|
error, // Error | null
|
||||||
send, // (prompt: string) => void
|
send, // (prompt: string, context?: Record<string, unknown>) => Promise<void>
|
||||||
abort, // () => void
|
clear, // () => void - reset spec and error
|
||||||
} = useUIStream({
|
} = useUIStream({
|
||||||
api: string, // API endpoint URL
|
api: string, // API endpoint URL
|
||||||
onChunk?: (chunk: string) => void, // Called for each chunk
|
onComplete?: (spec: Spec) => void, // Called when streaming completes
|
||||||
onFinish?: (spec: Spec) => void, // Called when streaming completes
|
onError?: (error: Error) => void, // Called when an error occurs
|
||||||
});`}</Code>
|
});`}</Code>
|
||||||
|
|
||||||
<h3 className="text-lg font-semibold mt-8 mb-4">useData</h3>
|
<h3 className="text-lg font-semibold mt-8 mb-4">useData</h3>
|
||||||
|
|||||||
@@ -34,11 +34,11 @@ function App() {
|
|||||||
isStreaming, // True while streaming
|
isStreaming, // True while streaming
|
||||||
error, // Any error that occurred
|
error, // Any error that occurred
|
||||||
send, // Function to start generation
|
send, // Function to start generation
|
||||||
abort, // Function to cancel streaming
|
clear, // Function to reset spec and error
|
||||||
} = useUIStream({
|
} = useUIStream({
|
||||||
api: '/api/generate',
|
api: '/api/generate',
|
||||||
onChunk: (chunk) => {}, // Optional: called for each chunk
|
onComplete: (spec) => {}, // Optional: called when streaming completes
|
||||||
onFinish: (spec) => {}, // Optional: called when complete
|
onError: (error) => {}, // Optional: called when an error occurs
|
||||||
});
|
});
|
||||||
}`}</Code>
|
}`}</Code>
|
||||||
|
|
||||||
@@ -112,8 +112,14 @@ export async function POST(req: Request) {
|
|||||||
}`}</Code>
|
}`}</Code>
|
||||||
|
|
||||||
<h2 className="text-xl font-semibold mt-12 mb-4">Aborting Streams</h2>
|
<h2 className="text-xl font-semibold mt-12 mb-4">Aborting Streams</h2>
|
||||||
|
<p className="text-sm text-muted-foreground mb-4">
|
||||||
|
Calling <code className="text-foreground">send</code> again
|
||||||
|
automatically aborts the previous request. Use{" "}
|
||||||
|
<code className="text-foreground">clear</code> to reset the spec and
|
||||||
|
error state:
|
||||||
|
</p>
|
||||||
<Code lang="tsx">{`function App() {
|
<Code lang="tsx">{`function App() {
|
||||||
const { isStreaming, send, abort } = useUIStream({
|
const { isStreaming, send, clear } = useUIStream({
|
||||||
api: '/api/generate',
|
api: '/api/generate',
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -122,9 +128,7 @@ export async function POST(req: Request) {
|
|||||||
<button onClick={() => send('Create dashboard')}>
|
<button onClick={() => send('Create dashboard')}>
|
||||||
Generate
|
Generate
|
||||||
</button>
|
</button>
|
||||||
{isStreaming && (
|
<button onClick={clear}>Reset</button>
|
||||||
<button onClick={abort}>Cancel</button>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}`}</Code>
|
}`}</Code>
|
||||||
|
|||||||
@@ -1,5 +1,13 @@
|
|||||||
# @json-render/codegen
|
# @json-render/codegen
|
||||||
|
|
||||||
|
## 0.4.3
|
||||||
|
|
||||||
|
### Patch Changes
|
||||||
|
|
||||||
|
- 61ee8e5: include remove op in system prompt
|
||||||
|
- Updated dependencies [61ee8e5]
|
||||||
|
- @json-render/core@0.4.3
|
||||||
|
|
||||||
## 0.4.2
|
## 0.4.2
|
||||||
|
|
||||||
### Patch Changes
|
### Patch Changes
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@json-render/codegen",
|
"name": "@json-render/codegen",
|
||||||
"version": "0.4.2",
|
"version": "0.4.3",
|
||||||
"license": "Apache-2.0",
|
"license": "Apache-2.0",
|
||||||
"description": "Utilities for generating code from json-render UI trees",
|
"description": "Utilities for generating code from json-render UI trees",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|||||||
@@ -1,5 +1,11 @@
|
|||||||
# @json-render/core
|
# @json-render/core
|
||||||
|
|
||||||
|
## 0.4.3
|
||||||
|
|
||||||
|
### Patch Changes
|
||||||
|
|
||||||
|
- 61ee8e5: include remove op in system prompt
|
||||||
|
|
||||||
## 0.4.2
|
## 0.4.2
|
||||||
|
|
||||||
### Patch Changes
|
### Patch Changes
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@json-render/core",
|
"name": "@json-render/core",
|
||||||
"version": "0.4.2",
|
"version": "0.4.3",
|
||||||
"license": "Apache-2.0",
|
"license": "Apache-2.0",
|
||||||
"description": "JSON becomes real things. Define your catalog, register your components, let AI generate.",
|
"description": "JSON becomes real things. Define your catalog, register your components, let AI generate.",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|||||||
@@ -502,6 +502,7 @@ export function generateSystemPrompt<
|
|||||||
lines.push(
|
lines.push(
|
||||||
'{"op":"add","path":"/elements/key","value":{"key":"...","type":"...","props":{...},"children":[...]}}',
|
'{"op":"add","path":"/elements/key","value":{"key":"...","type":"...","props":{...},"children":[...]}}',
|
||||||
);
|
);
|
||||||
|
lines.push('{"op":"remove","path":"/elements/key"}');
|
||||||
lines.push("");
|
lines.push("");
|
||||||
|
|
||||||
// Rules
|
// Rules
|
||||||
@@ -509,6 +510,7 @@ export function generateSystemPrompt<
|
|||||||
const baseRules = [
|
const baseRules = [
|
||||||
"First line sets /root to root element key",
|
"First line sets /root to root element key",
|
||||||
"Add elements with /elements/{key}",
|
"Add elements with /elements/{key}",
|
||||||
|
"Remove elements with op:remove - also update the parent's children array to exclude the removed key",
|
||||||
"Children array contains string keys, not objects",
|
"Children array contains string keys, not objects",
|
||||||
"Parent first, then children",
|
"Parent first, then children",
|
||||||
"Each element needs: key, type, props",
|
"Each element needs: key, type, props",
|
||||||
|
|||||||
@@ -1,5 +1,13 @@
|
|||||||
# @json-render/react
|
# @json-render/react
|
||||||
|
|
||||||
|
## 0.4.3
|
||||||
|
|
||||||
|
### Patch Changes
|
||||||
|
|
||||||
|
- 61ee8e5: include remove op in system prompt
|
||||||
|
- Updated dependencies [61ee8e5]
|
||||||
|
- @json-render/core@0.4.3
|
||||||
|
|
||||||
## 0.4.2
|
## 0.4.2
|
||||||
|
|
||||||
### Patch Changes
|
### Patch Changes
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@json-render/react",
|
"name": "@json-render/react",
|
||||||
"version": "0.4.2",
|
"version": "0.4.3",
|
||||||
"license": "Apache-2.0",
|
"license": "Apache-2.0",
|
||||||
"description": "React renderer for @json-render/core. JSON becomes React components.",
|
"description": "React renderer for @json-render/core. JSON becomes React components.",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|||||||
@@ -1,5 +1,13 @@
|
|||||||
# @json-render/remotion
|
# @json-render/remotion
|
||||||
|
|
||||||
|
## 0.4.3
|
||||||
|
|
||||||
|
### Patch Changes
|
||||||
|
|
||||||
|
- 61ee8e5: include remove op in system prompt
|
||||||
|
- Updated dependencies [61ee8e5]
|
||||||
|
- @json-render/core@0.4.3
|
||||||
|
|
||||||
## 0.4.2
|
## 0.4.2
|
||||||
|
|
||||||
### Patch Changes
|
### Patch Changes
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@json-render/remotion",
|
"name": "@json-render/remotion",
|
||||||
"version": "0.4.2",
|
"version": "0.4.3",
|
||||||
"license": "Apache-2.0",
|
"license": "Apache-2.0",
|
||||||
"description": "Remotion renderer for @json-render/core. JSON becomes video compositions.",
|
"description": "Remotion renderer for @json-render/core. JSON becomes video compositions.",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|||||||
Reference in New Issue
Block a user