@resvg/resvg-js's asPng() and @react-pdf/renderer's renderToBuffer()
return Node Buffer, which no longer satisfies the declared Uint8Array
return types under the current @types/node/TypeScript resolution,
failing dts builds (and therefore the release workflow's build step).
Wrap the Buffers in zero-copy Uint8Array views.
renderToStream() was declared as returning a web ReadableStream, but
@react-pdf/renderer's renderToStream() actually resolves to a
NodeJS.ReadableStream; declare what it really returns.
* Add harness-chat example: json-render as the UI for agent harnesses
A Claude Code agent runs in a Vercel Sandbox via AI SDK 7's experimental HarnessAgent and reports its work (steps, file changes, terminal output, test results) as a streamed json-render spec. Because HarnessAgent.stream() returns a standard StreamTextResult, the existing pipeJsonRender -> useJsonRenderMessage pipeline works unchanged.
The example pins matching AI SDK 7 canary packages so the harness adapter, React hooks, and Vercel sandbox transport resolve together.
* harness-chat: fix dev-runtime issues found in live run
- allowedDevOrigins for the portless proxy origin (Next 16 silently fails to hydrate on non-allowlisted cross-origin dev requests)
- serverExternalPackages for the harness adapter, which loads its sandbox bridge via new URL(..., import.meta.url) and cannot be bundled
- README: document CLI-login (TTY) vs OIDC sandbox auth paths
* harness-chat: agent picker, charts, and design polish
- Add a UI agent selector (Claude Code / Codex / Pi) with per-agent harness sessions and monochrome brand marks
- Add monochrome bar/line chart components to the catalog and registry
- Polish the chat shell: minimalist Geist/Geist-Mono design, tool-call icons + containers, inline-code shading, and a working text shimmer
* harness-chat: add mermaid diagrams to README
- Replace the ASCII data-flow sketch with a mermaid flowchart and a sequence diagram of a turn
- Update prose/setup to reflect the three-agent selector (Claude Code / Codex / Pi)
* Fix harness chat reset and signed charts
* autoFixSpec prunes children references to undefined elements
Dangling references are the dominant remaining first-attempt validation
failure in benchmarks, and models frequently fail to repair them even given
the exact error (observed: three repair turns, same dangling footer each
time). The renderer already skips missing children at runtime, so pruning
yields the identical rendered output while letting the spec validate. Each
removal is reported in fixes.
* Classify autoFixSpec fixes as lossy or lossless
Pruning a dangling child reference changes what renders; relocating a
misplaced field does not. Callers with a repair loop need to tell these
apart: accept lossless fixes silently, prefer re-prompting over lossy fixes,
and keep the lossy-fixed spec as a last resort. Adds fixDetails alongside the
existing fixes strings (additive, no signature break).
* Validate visible conditions in validateSpec; document filtered-list pattern
Malformed visible conditions (e.g. mixing $state and $item in one object)
silently evaluate to hidden at runtime: evaluateCondition dispatches on the
first recognized key and non-strict parsing strips the rest, so whole regions
of UI disappear with a valid-looking spec. Benchmarked worst case: a kanban
board that rendered zero task cards.
- core: VisibilityConditionStrictSchema (strict objects, exported)
- core: validateSpec rejects malformed visible with a repairable message
listing the valid forms (code: invalid_visible)
- framework prompts: FILTERED LISTS rule showing the repeat + per-item
visible pattern models keep reaching for and inventing syntax around
* Support filtered lists: repeat + $item visible on the same element
Models across vendors consistently write {repeat, visible: {$item: ...}} on
one container to mean a filtered list (kanban columns, status sections).
Previously $item had no meaning outside the repeat scope, the condition
evaluated false, and the whole region silently disappeared — the worst
visual failures in benchmarks were boards rendering zero cards this way.
Outside a repeat scope that spelling was always broken, so claiming it is
backward compatible: the renderer now applies such a condition per item,
preserving original indices for item state paths. Container-level $state
conditions and per-child $item conditions behave as before.
- core: conditionUsesItemScope helper (exported)
- react: RepeatChildren filters items by the container's $item condition
- framework prompts: FILTERED LISTS rule teaches the container spelling
- react: repeat-filter test suite (filtering, no-filter, $state container
visibility, per-child $item)
Other framework renderers (vue, svelte, solid, react-native) still evaluate
the container condition outside scope and should adopt the same semantics.
* Validate repeat containers: require children and matching state arrays
Two silent empty-region failures seen repeatedly in benchmarks, both passing
validation today: a repeat element with no children (nothing to clone per
item) and a repeat statePath pointing at a missing or non-array state value.
Both now fail validateSpec with repairable messages (repeat_without_children,
repeat_state_mismatch). State checks only run when the spec provides state;
runtime-fed state is unaffected.
* Address review: lossy-aware hook repair, react-only filtered-list rule, reuse getByPath
- ink/react-native useUIStream repair loops no longer accept lossy autofixes
unconditionally: lossless relocations apply immediately, pruned content
holds back while retries remain (so validation fails and the model repairs
the missing elements) and applies only as a last resort.
- FILTERED LISTS prompt rule removed from schemas whose renderers do not
implement the per-item filter yet (everything except react). Renderer
parity tracked as follow-up.
- repeat_state_mismatch validation reuses getByPath instead of a local JSON
Pointer lookup that skipped ~0/~1 unescaping.
* Address review: split mixed repeat visibility, apply lossless fixes eagerly
- splitRepeatVisibility (core, exported): AND-composed conditions on a repeat
container partition into a container gate ($state conjuncts, hides the
shell) and a per-item filter ($item/$index conjuncts). Mixed $or cannot
partition soundly and stays fully per-item, documented.
- react renderer uses the split, so {$and: [{$state gate}, {$item filter}]}
hides the empty shell when the gate is false instead of rendering a husk.
- autoFixSpec gains { lossy?: boolean } (default true, additive): ink and
react-native repair loops now apply lossless relocations immediately and
withhold only the pruning until retries are exhausted, matching the stated
intent.
* Address review: RN final-validation error path, repeat prune guard, docs
- react-native useUIStream mirrors ink: when retries are exhausted and the
spec still fails validation, report through onError instead of silently
calling onComplete with an invalid spec.
- autoFixSpec never prunes a repeat container to zero children; that would
trade missing_child for repeat_without_children and leave the last-resort
spec unrenderable. The dangling template reference stays visible to repair.
- Docs for the new surface: core README + skill (validateSpec issue codes,
fixDetails, lossy option), react README + skill and web visibility docs
(filtered-list pattern, mixed-condition splitting, framework support note).
* Fix visible validation depending on consumer zod version; strengthen children prompt rule
catalog.validate() behavior changed under consumers' zod resolution: z.any()
object keys are optional on zod 4.3 but nonoptional on zod 4.4+, so a spec
omitting an element's visible field validates on 4.3 and fails on 4.4. The
core test suite (zod 4.3.6) asserts the optional behavior, so optional is the
intent; pin it explicitly with .optional() so all zod 4.x agree.
children stays required (long-standing, zod-version-independent contract;
relaxing it would change InferSpec types for consumers). Instead the default
prompt rules now state explicitly that every element must include a children
array, with [] for leaves, which benchmarking shows models otherwise omit on
roughly a third of first attempts.
- core: InferSpecObject honors SchemaType.optional at the type level (additive;
no schema used optional before)
- all framework schemas: visible marked ...s.optional()
- framework prompt defaultRules: REQUIRED FIELDS rule for children
- core: regression tests locking visible-optional and children-required
* Fix Next schema optional fields
* Require pnpm release age and Node 24
- Set pnpm minimumReleaseAge to 2880 minutes and enforce engine checks.
- Pin the workspace to pnpm 11 and require Node 24+ via package metadata.
- Teach CI and release workflows to use the checked-in .node-version.
* Approve pnpm build scripts for CI
- Add the pnpm 11 build-script allowlist needed for frozen CI installs.
- Allow only the dependency install scripts already required by the current lockfile.
* Deny dependency build scripts
- Match the agent-browser pnpm 11 policy by explicitly denying known dependency build scripts.
- Keep minimumReleaseAge enforcement without approving postinstall script execution.
* prepare v0.19.0
Bump all @json-render/* packages to 0.19.0, add changelog entry for
custom directives API and @json-render/directives package, and update
the web app changelog page.
* fix(release): use npm publish for OIDC trusted publishing
pnpm publish does not pass through OIDC credentials, causing E404 on
npm. Switch to pnpm pack + npm publish per package, matching the
pattern used in wterm.
Bump all @json-render/* packages to 0.19.0, add changelog entry for
custom directives API and @json-render/directives package, and update
the web app changelog page.
* feat: add custom directives API and @json-render/directives package
Add a `defineDirective` API that lets users register custom `$`-prefixed
dynamic values with schemas, resolvers, and prompt instructions — extending
the spec language without forking core.
* fixes
* perf(core): optimize findDirective to iterate registry instead of object keys
Flip the loop from O(object-keys) to O(registry-size) by iterating
the directive registry and checking `key in value` rather than scanning
all object keys with Object.keys() and startsWith("$").
* fix(core): reject directive names that conflict with built-in keys
defineDirective now throws at registration time if the name collides
with a built-in prop expression key ($state, $cond, etc.), making the
precedence contract explicit rather than relying on check ordering in
resolvePropValue.
* fix(directives): handle future dates in $format and warn on $math NaN coercion
$format relative dates now support future timestamps ("2h from now")
and return "just now" for zero diff. $math emits a console.warn in
dev mode when a non-numeric value is silently coerced to 0.
* fix(directives): remove process.env check that breaks DTS build
The directives package doesn't include @types/node, so referencing
process.env fails during tsup's DTS generation. The console.warn is
unconditional now — it only fires on actual misuse (non-numeric input)
so the cost is negligible.
* feat(directives): rename prompt to description, auto-describe schemas in prompt, add docs
- Rename `prompt` to `description` on DirectiveDefinition — a short
behavioral label rather than the full AI prompt blob
- Auto-generate directive schema signatures in the system prompt using
formatZodType, so the AI always sees every field, type, and optionality
- Add docs: guide page, API reference page, nav/title entries, docs-chat
* feat(directives): add standardDirectives export and composition hint
Export a pre-assembled standardDirectives array (all 7 non-factory
directives) for convenience. Add a composition hint to the generated
AI prompt so agents know directives can nest inside each other.
* docs: add directives skill, README entry, and docs-chat listing
- Add skills/directives/SKILL.md with full directive API reference
- Add @json-render/directives row to root README packages table
- Add "directives" to the Available skills list in docs-chat prompt
* perf(core): skip Zod parse in directive hot path
Resolvers are already defensive (coercion, fallbacks, switch defaults),
so runtime validation on every render adds overhead without safety.
The schema remains used for prompt generation and TypeScript inference.
Replace NPM_VERCEL_TOKEN_ELEVATED secret with GitHub Actions OIDC
provenance. Adds `id-token: write` permission, `environment: Release`,
and `--provenance` flag. Merges build+publish into a single job.
The site changelog was stuck at v0.10.0 while the project is at v0.18.0.
Add entries for v0.11.0 through v0.18.0 covering the image renderer,
Svelte/Solid/Vue renderers, React Email, MCP, React Three Fiber, YAML
wire format, edit modes, Ink terminal renderer, Next.js renderer,
shadcn-svelte, Gaussian Splatting, and devtools. Also update all
existing entries to use exact release dates instead of just month/year.
Add ZodRecord and ZodDefault cases to formatZodType() in both core and
yaml packages. Fix ZodLiteral to support Zod 4's def.values array
in addition to Zod 3's def.value.
Co-authored-by: Matt Van Horn <455140+mvanhorn@users.noreply.github.com>
Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* feat: add @json-render/gsplat package
Standalone Gaussian Splatting renderer using Hugging Face's gsplat.js.
Provides GaussianSplat and GaussianSplatViewer components with progress
indicator, orbit controls, and Zod-based catalog definitions — no
Three.js dependency required.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* feat: add GaussianSplat component to react-three-fiber
Adds GaussianSplat to the R3F renderer using drei's Splat loader,
bringing the component count to 20. Splats are composable with all
existing R3F components (lights, controls, post-processing, etc.).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* feat: add standalone gsplat example
Demo app showcasing @json-render/gsplat with 5 scenes (bonsai, garden,
bicycle, kitchen, stump) loaded from Hugging Face datasets. Includes
scene selector, live JSON spec viewer, and progress indicator.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* feat: add react-three-fiber gsplat example
Demo app showcasing GaussianSplat in R3F with 5 scenes: splat showroom,
splat with primitives, multi-splat, post-processing effects (bloom +
vignette), and animated floating splat with sparkles.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* docs: add gsplat API reference and update navigation
Adds API documentation for @json-render/gsplat, updates the R3F docs
to reflect 20 components, and registers both example apps in the
docs navigation, examples list, and page titles.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* chore: add changeset and update lockfile for gsplat
Adds @json-render/gsplat to the fixed version group and creates a
changeset for the minor release of gsplat and react-three-fiber.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* fix: wire up GaussianSplatViewer props to gsplat.js API
The catalog declared controls, autoRotate, autoRotateSpeed,
cameraPosition, cameraTarget, and fov props but the component
silently ignored them. Now:
- cameraPosition sets camera.position via SPLAT.Vector3
- cameraTarget calls controls.setCameraTarget()
- fov converts to focal length via camera.data.fx/fy
- controls=false skips OrbitControls creation
- autoRotate rotates the camera around Y in the render loop
- Updated gsplat.d.ts with full Camera/OrbitControls type surface
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* fix(gsplat): address review issues — transforms, progress bar, themeable colors
- Apply per-splat position/rotation/scale after LoadAsync (splats were
rendering at origin regardless of config)
- Add eulerToQuaternion helper to convert Vec3 degrees to Quaternion
- Expose Splat class and correct LoadAsync return type (Promise<Splat>)
in gsplat.d.ts so transforms can be applied imperatively
- Forward visible prop through GaussianSplatHandle and SplatEntry
- Fix progress bar regression: use Math.max so bar never jumps backwards
- Make ProgressIndicator colors themeable via progressBarColor,
progressTrackColor, progressTextColor, progressBackgroundColor props
on GaussianSplatViewer
- Remove quality/alphaHash/toneMapped from standalone gsplat catalog —
these gsplat.js renderer has no equivalent API for them (they remain
in @json-render/react-three-fiber where drei's Splat supports them)
- Fix pre-existing TS2769/TS2322 Vec3 type errors in GaussianSplat.tsx
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* fix(gsplat): pass required progress color props in example
The new themeable progress indicator props are nullable (required keys
that accept null) in the catalog schema. The example was missing them,
causing TS2739 in CI.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
* refactor(gsplat): drop standalone @json-render/gsplat package
Per discussion in #259, the standalone gsplat viewer is better positioned
as an experimental example than as a published package — there's no real
spec tree to compose, and the R3F GaussianSplat component already covers
the productized use case.
- Remove packages/gsplat (was @json-render/gsplat)
- Inline the viewer component into examples/gsplat as an experimental demo
- Drop @json-render/{core,react,gsplat} deps from the example
- Remove gsplat from changeset config and feat-gsplat.md
- Remove docs/api/gsplat page and its navigation entries
- Update README to drop the standalone install/snippet
* fix(gsplat): address review issues, add ExtrudedText component, improve a11y
- Fix GridHelper prop names (color1/color2 → color/secondaryColor) in all R3F scene files
- Fix Text3D prop mismatch in splat-with-primitives (size → fontSize, remove unsupported bevel/font props)
- Fix autoRotate to orbit around camera target instead of world origin
- Add ExtrudedText component to @json-render/react-three-fiber (geometry-based 3D text with depth, bevel, and custom font support)
- Add multi-offset scene to gsplat example to demonstrate off-center orbit
- Redesign splat-with-primitives scene (triangle logo + extruded label, remove floor plane)
- Improve gsplat example accessibility (ARIA labels, keyboard nav, semantic HTML, focus management)
- Debounce resize handler and use consistent 100dvh in gsplat viewer
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---------
Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: Lucian Fialho <lucianfialhobp@hotmail.com>
* feat(web): fetch GitHub star count dynamically
Replace the hardcoded "12k" star count in the header with a live value
from the GitHub API, revalidated every 24 hours. Gracefully hides the
count if the fetch fails.
* fix: add GITHUB_TOKEN to turbo.json globalEnv
* fix: remove GITHUB_TOKEN usage from star count fetch
* Update official links to use json-render.dev domain
- Change dashboard example Docs link from json-render.vercel.app to json-render.dev
- Change Svelte Chat demo URL from json-render-svelte-chat-demo.labs.vercel.dev to svelte-chat-demo.json-render.dev
Fixes#264
* Revert svelte-chat demo URL change
Keep the original labs.vercel.dev URL for the Svelte Chat demo.
---------
Co-authored-by: ctate <366502+ctate@users.noreply.github.com>
Add outputFileTracingIncludes so the Geist font TTF is bundled at the
symlink path the code reads from. In a pnpm monorepo the file was only
traced at the .pnpm store path, which Vercel does not map back to the
node_modules/geist/ symlink.
The Remotion schema defines props on composition entries, but generatePrompt
did not include those props in its output. As a result, the model had no
knowledge of the expected prop shape when generating JSON, causing runtime
failures when prop names didn't match the component's expected interface.
Changes:
- Import zod type for TypeScript support
- Extract formatZodType from PromptContext
- Add props field to component type definition
- Include formatted props string in component description
Fixes#224
* init
* fix: resolve all type errors, runtime bugs, and test failures in @json-render/shadcn-svelte
- Add /index.js extensions to all ../ui/* imports (NodeNext moduleResolution)
- Type shadcnComponents as Record<string, Component<any>> to fix d.ts generation
- Call getBoundProp() once at top level instead of inside a binding() function
called from event handlers (getContext() only works during initialization)
- Move getOptionalValidationContext() call to top level; update createValidation()
to accept the context as first param instead of calling getContext() itself
- Wrap validation.register() in untrack() to break the fieldConfigs read-write
cycle that caused effect_update_depth_exceeded in tests
- Fix implicit any on Input onkeydown handler (KeyboardEvent type)
- Use untrack() for $state() initializers that read reactive props values
- Call getStateValue() once at top level in Dialog/Drawer (not in a function
called from event handlers)
- Fix test fixtures: use named imports { StateProvider, ValidationProvider }
- Add server.deps.inline for bits-ui and @lucide/svelte so vitest can process
their .svelte source files; add root svelte.config.js with runes: true
- Add role/aria-modal/tabindex/onkeydown a11y attributes to Dialog and Drawer
- Fix self-closing non-void elements in Skeleton, Spinner, Textarea
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* update shadcn-svelte components
* fixes
* fixes
* fix: address PR review issues for shadcn-svelte renderer
- Fix missing comma in .changeset/config.json (invalid JSON)
- Fix Slider.svelte type errors (single-mode expects number, not array)
- Replace raw <button> with shadcn Button in Pagination.svelte
- Remove global font import and body/html overrides from app.css
- Remove root svelte.config.js (duplicates package-level config)
- Revert unrelated packageManager version bump
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat: add @json-render/ink terminal renderer and ink-chat example
Adds a new `@json-render/ink` package that brings json-render specs to
terminal UIs via Ink (React for CLIs). Includes 24 standard components
(layout, text, inputs, markdown, etc.), context providers for state,
validation, visibility, actions, focus, and repeat scopes, plus a
streaming JSONL hook for progressive spec rendering.
Also adds an `ink-chat` example app demonstrating an AI chat interface
in the terminal with streaming responses, tool calls, and interactive
wizard flows.
Includes 76 tests (24 unit + 52 e2e), docs page, and web app integration.
* feat: show live spec preview during streaming
Render the spec progressively as JSONL patches arrive instead of only
showing a spinner. The preview disappears when streaming completes and
the finalized message replaces it in history.
* feat: clip streaming preview to 6 lines
* refactor: move spinner into input box, show full streaming preview
* fix: skip spacer during streaming to prevent clipping tall previews
* fix: strip invisible colors on dark terminal backgrounds
Drop foreground colors like "black" and "#000000" from AI-generated
specs so text remains readable on dark terminals. Removed hardcoded
color="black" from Badge and added safeColor() guard to all components
that accept user-specified color props.
* fix: always show spacer to keep input pinned to bottom
* fix: show dash placeholder for empty values in Table and KeyValue
Empty or null values in Table cells and KeyValue now render as "—"
instead of blank space. Also removed dimColor from ListItem subtitle
and trailing for better readability on dark terminals.
* fix: division by zero in Sparkline sampling when maxWidth is 1
* fix: Review feedback
Signed-off-by: Alexis Rico <sferadev@gmail.com>
* fix: Update readme
Signed-off-by: Alexis Rico <sferadev@gmail.com>
---------
Signed-off-by: Alexis Rico <sferadev@gmail.com>
pnpm creates separate copies of remotion@4.0.418 when peer dependency
versions differ between workspace packages (e.g. react@19.2.3 vs
react@19.2.4). This causes two React contexts, so useVideoConfig()
in @json-render/remotion cannot see the Player's context.
Add turbopack.resolveAlias to force all remotion imports to resolve
from the app's node_modules, ensuring a single instance.
* add yaml wire format and universal edit modes
**Summary**
- Add `@json-render/yaml` package with streaming parser, YAML prompt generation, and AI SDK transform
- Add universal edit modes (patch, merge, diff) to `@json-render/core`, usable across both JSONL and YAML formats
- Integrate YAML support and edit mode selection into the web playground with format toggle, token usage display, and prompt caching
* improvements
* fixes
* fixes ci
* docs
Chris Tate