Playground
Five live example apps — same package, five different ways to build the editor around it. Each runs independently; changes here don't affect the others.
report-builder
The full designer — JSON data sources, a field explorer, 6 ready-made templates — using the package's ready-made UI components (Button/Card/Input/PdfPreviewModal).
Open →Part by partcomposed-layout
The editor assembled part by part, without the <Designer> component — DesignerProvider mounted by hand, toolbar on top, and five stacked panels that inside <Designer> would be five tabs. Proves the tab gate is opt-in.
Open →Custom shellcustom-ui
The exact same features as report-builder, but the entire shell is hand-written plain CSS — zero package UI components. Proves <Designer> works with any design system.
Open →No pdf.jsno-preview
Generates the PDF and downloads it straight away — no preview screen and, the point of it, no pdfjs-dist installed. Proves the main entry works without the optional peer; pdf.js lives behind json-pdf-designer/preview.
Open →No <Designer>headless-designer
No <Designer> component at all — a hand-built canvas (its own drag/resize logic, no react-rnd) over generatePdf + types from json-pdf-designer/server, plus PdfPreview. Proves the data model and PDF engine work standalone.
Open →