Playground

The real <report-designer>, loaded from /sdk/latest/ on this server, inside a mock host application. Open a template, edit it, press Save (or Ctrl/Cmd+S), and render it with the template's sample data through this server's render API. The code panel shows exactly what this page does: your app does the same against its own database.

How to embed it

Event log

Events from the designer appear here.

The element's events: template-change, save, help-request. host lines are what the mock app did; render lines are calls to POST /api/v1/render.

Rendered PDF

Press Render with sample data to send the current template and the template's sample data to POST /api/v1/render on this server.

Real data, real render: the same call your back end makes.

What this page does

Saved in this browser only. The template list is kept in this browser's localStorage (key reportdesigner.playground.v3), a stand-in for your database: the designer's Save stores the template, and opening it again gives the saved version. Nothing is sent anywhere except the render call. The templates and their sample data are the gallery templates shipped with this release (20 templates).