@veztraa/report-designer 0.3.1 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +35 -1
  2. package/package.json +4 -4
package/README.md CHANGED
@@ -4,6 +4,8 @@
4
4
 
5
5
  Embeddable React drag-and-drop PDF report designer — a visual report builder you can drop into any React app. Give your users a Figma-like canvas for data-driven PDFs: drag-and-drop elements, live preview, undo/redo, dark mode, and `{{field}}` data bindings.
6
6
 
7
+ **What's new in v0.3:** Signature element (draw, type in handwriting font, or upload), 4 handwriting fonts (Great Vibes, Dancing Script, Pacifico, Sacramento), multilingual support for 8 scripts via Noto fonts (Chinese, Japanese, Korean, Arabic, Hebrew, Hindi, Thai, Latin/Cyrillic/Greek), and no Google Fonts dependency.
8
+
7
9
  Styles auto-inject on mount — no CSS import required.
8
10
 
9
11
  ## Installation
@@ -105,13 +107,15 @@ Passed as the `elements` prop. Use `include` (whitelist) **or** `exclude` (black
105
107
  | `include` | `ElementType[]` | Only these types appear, in this order. |
106
108
  | `exclude` | `ElementType[]` | Hide these types (ignored when `include` is set). |
107
109
 
108
- `ElementType` is one of: `text`, `richtext`, `table`, `container`, `image`, `chart`, `barcode`, `qrcode`, `rectangle`, `line`, `pagebreak`.
110
+ `ElementType` is one of: `text` · `richtext` · `table` · `container` · `image` · `chart` · `barcode` · `qrcode` · `rectangle` · `line` · `pagebreak` · `signature`
109
111
 
110
112
  ## Features
111
113
 
112
114
  - **Drag-and-drop canvas** — snap-to-grid with alignment guides, 8-handle resize, arrow-key nudge
113
115
  - **Live PDF preview rendered off the main thread** (Web Worker) — debounced 400ms with an adaptive loading UI, so even large multi-hundred-page reports never freeze the tab
114
116
  - **Repeating containers** (data-bound bands) with **automatic pagination** — tables, rich text, and bands flow across pages, keeping items together where they fit
117
+ - **Signature element** — draw on a pad, type a name in a handwriting font (Great Vibes, Dancing Script, Pacifico, Sacramento), or upload an image; editable after creation
118
+ - **Multilingual text** — set `fontFamily` to any Noto font to render Chinese, Japanese, Korean, Arabic, Hebrew, Hindi, Thai, or Latin/Cyrillic/Greek content in the same PDF
115
119
  - **50-step undo / redo**
116
120
  - **Light / dark theme** and a fully customizable accent color
117
121
  - Header, body, and footer sections
@@ -119,6 +123,36 @@ Passed as the `elements` prop. Use `include` (whitelist) **or** `exclude` (black
119
123
  - Data panel for `{{field}}` preview bindings
120
124
  - **JSON-first** — the designer is a visual editor for a plain `Template` object; load with `report`, save with `toolbar.onSave`
121
125
 
126
+ ## Signature element
127
+
128
+ Add a signature block from the palette (or include `type: "signature"` in your template). In the Properties panel you can:
129
+
130
+ - **Draw** — freehand on a signature pad, then click Use
131
+ - **Type** — enter a name displayed in a handwriting font (Great Vibes, Dancing Script, Pacifico, or Sacramento)
132
+ - **Upload** — paste or upload a signature image (PNG/JPEG)
133
+ - Set signer **name**, **title**, **label**, and **date** sub-fields
134
+ - Choose **alignment** (left / center / right), **ink color**, and **line color**
135
+ - Toggle the baseline rule on/off
136
+
137
+ Drawn signatures are stored as base64 PNGs inside the template JSON and render identically in the PDF.
138
+
139
+ ## Multilingual support
140
+
141
+ Set `style.fontFamily` on any text element to a Noto family to render non-Latin scripts:
142
+
143
+ | Font family | Script |
144
+ |---|---|
145
+ | `Noto Sans` | Latin, Cyrillic, Greek |
146
+ | `Noto Sans SC` | Chinese Simplified |
147
+ | `Noto Sans JP` | Japanese |
148
+ | `Noto Sans KR` | Korean |
149
+ | `Noto Sans Arabic` | Arabic |
150
+ | `Noto Sans Hebrew` | Hebrew |
151
+ | `Noto Sans Devanagari` | Hindi |
152
+ | `Noto Sans Thai` | Thai |
153
+
154
+ Fonts are loaded from CDN on first use and are available in both the canvas preview and the rendered PDF. CJK fonts include automatic per-character line-breaking.
155
+
122
156
  ## Keyboard shortcuts
123
157
 
124
158
  | Shortcut | Action |
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@veztraa/report-designer",
3
- "version": "0.3.1",
4
- "description": "Embeddable React drag-and-drop PDF report designer — visual canvas, live preview, undo/redo, dark mode, and data-bound elements.",
3
+ "version": "0.3.2",
4
+ "description": "Embeddable React drag-and-drop PDF report designer — visual canvas, live preview, undo/redo, dark mode, signature element (draw/type/upload), handwriting fonts, multilingual Noto fonts, and data-bound repeating containers.",
5
5
  "keywords": [
6
6
  "pdf",
7
7
  "pdf-designer",
@@ -44,8 +44,8 @@
44
44
  },
45
45
  "dependencies": {
46
46
  "zustand": "^5.0.2",
47
- "@veztraa/report-core": "0.3.1",
48
- "@veztraa/report-renderer": "^0.3.1"
47
+ "@veztraa/report-renderer": "^0.3.2",
48
+ "@veztraa/report-core": "0.3.2"
49
49
  },
50
50
  "devDependencies": {
51
51
  "@react-pdf/renderer": "^4.1.6",