Skip to content

feat: add generate_screen_from_json virtual tool#151

Open
Eyaldavid7 wants to merge 1 commit intodavideast:mainfrom
Eyaldavid7:feat/generate-screen-from-json
Open

feat: add generate_screen_from_json virtual tool#151
Eyaldavid7 wants to merge 1 commit intodavideast:mainfrom
Eyaldavid7:feat/generate-screen-from-json

Conversation

@Eyaldavid7
Copy link

Summary

Adds a new virtual tool generate_screen_from_json that combines a design prompt with live JSON data, so generated screens render real content instead of placeholder text.

  • Wraps upstream generate_screen_from_text with an enhanced prompt containing data binding instructions + serialized JSON
  • Input validation: type checks for all 3 required params (projectId, prompt, jsonData)
  • Safety: 100KB payload size limit, circular reference detection, prompt injection mitigation via JSON round-tripping
  • Response includes generateResult, dataBound, originalPrompt, and dataKeys metadata
  • Registered in virtual tools index, documented in tool-catalog.md

Use case

When building data-driven UIs (dashboards, admin panels, game screens), generate_screen_from_text produces beautiful layouts with placeholder content. This tool lets you pass your actual API/app JSON data alongside the design prompt, so the generated HTML renders real values — zero manual data binding needed.

Files changed

File Change
src/commands/tool/virtual-tools/generate-screen-from-json.ts New virtual tool implementation
src/commands/tool/virtual-tools/index.ts Register tool in virtualTools array
tests/commands/tool/virtual-tools/generate-screen-from-json.test.ts 19 unit tests
docs/tool-catalog.md Document new tool

Test plan

  • 19 new unit tests covering:
    • Happy path: object, array, JSON string, empty, nested, primitives
    • Validation: missing/wrong types for projectId, prompt, jsonData
    • Edge cases: circular references, invalid JSON strings, >100KB payloads
    • Security: prompt injection via backtick fences
    • Error propagation: callTool failures bubble correctly
    • Response shape: no field collision with upstream result
  • Full test suite passes (485 tests, 0 failures)
  • Manual testing with a live Stitch project

🤖 Generated with Claude Code

Adds a new virtual tool that combines a design prompt with live JSON
data, so generated screens render real content instead of placeholders.

Wraps the upstream generate_screen_from_text tool with an enhanced
prompt that includes data binding instructions and the serialized JSON.

Includes input validation, 100KB size limit, circular reference
detection, prompt injection mitigation via JSON round-tripping,
and 19 unit tests covering happy paths, edge cases, and error
propagation.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@zoniquezaza-collab
Copy link

Wow it's owsome bro

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants