react-pdf-levelup 2.0.28 → 2.0.33
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.
- package/dist/index.cjs +881 -0
- package/dist/{index.d.mts → index.d.cts} +7 -21
- package/dist/index.d.ts +7 -21
- package/dist/index.js +231 -339
- package/package.json +4 -2
- package/dist/index.mjs +0 -811
package/dist/index.mjs
DELETED
|
@@ -1,811 +0,0 @@
|
|
|
1
|
-
// src/components/core/LayoutPDF.tsx
|
|
2
|
-
import React from "react";
|
|
3
|
-
import { Page, Document, StyleSheet, Text } from "@react-pdf/renderer";
|
|
4
|
-
var styles = StyleSheet.create({
|
|
5
|
-
page: {
|
|
6
|
-
backgroundColor: "white",
|
|
7
|
-
padding: 30,
|
|
8
|
-
fontFamily: "Helvetica",
|
|
9
|
-
fontSize: 12,
|
|
10
|
-
lineHeight: 1.5
|
|
11
|
-
},
|
|
12
|
-
pageNumber: {
|
|
13
|
-
position: "absolute",
|
|
14
|
-
fontSize: 10,
|
|
15
|
-
top: 792 - 14,
|
|
16
|
-
left: 0,
|
|
17
|
-
right: 0,
|
|
18
|
-
textAlign: "center",
|
|
19
|
-
color: "grey"
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
var LayoutPDF = ({
|
|
23
|
-
children,
|
|
24
|
-
size = "A4",
|
|
25
|
-
orientation = "portrait",
|
|
26
|
-
backgroundColor = "white",
|
|
27
|
-
showPageNumbers = true,
|
|
28
|
-
padding = 30,
|
|
29
|
-
style = {}
|
|
30
|
-
}) => {
|
|
31
|
-
let safeSize = size;
|
|
32
|
-
let safeOrientation = orientation;
|
|
33
|
-
let safeBackgroundColor = backgroundColor;
|
|
34
|
-
let safeShowPageNumbers = showPageNumbers;
|
|
35
|
-
try {
|
|
36
|
-
const validSizes = ["A4", "A3", "A5", "LETTER", "LEGAL", "TABLOID"];
|
|
37
|
-
if (typeof size === "string" && !validSizes.includes(size.toUpperCase())) {
|
|
38
|
-
console.warn(`Tama\xF1o de p\xE1gina inv\xE1lido: ${size}. Usando A4 como valor predeterminado.`);
|
|
39
|
-
safeSize = "A4";
|
|
40
|
-
}
|
|
41
|
-
if (orientation !== "portrait" && orientation !== "landscape") {
|
|
42
|
-
console.warn(`Orientaci\xF3n inv\xE1lida: ${orientation}. Usando portrait como valor predeterminado.`);
|
|
43
|
-
safeOrientation = "portrait";
|
|
44
|
-
}
|
|
45
|
-
if (typeof backgroundColor !== "string") {
|
|
46
|
-
console.warn(`Color de fondo inv\xE1lido: ${backgroundColor}. Usando white como valor predeterminado.`);
|
|
47
|
-
safeBackgroundColor = "white";
|
|
48
|
-
}
|
|
49
|
-
if (typeof showPageNumbers !== "boolean") {
|
|
50
|
-
safeShowPageNumbers = Boolean(showPageNumbers);
|
|
51
|
-
}
|
|
52
|
-
} catch (e) {
|
|
53
|
-
console.warn("Error procesando props en LayoutPDF:", e);
|
|
54
|
-
}
|
|
55
|
-
const pageStyle = {
|
|
56
|
-
...styles.page,
|
|
57
|
-
backgroundColor: safeBackgroundColor,
|
|
58
|
-
padding,
|
|
59
|
-
...style
|
|
60
|
-
};
|
|
61
|
-
return /* @__PURE__ */ React.createElement(Document, null, /* @__PURE__ */ React.createElement(Page, { size: safeSize, orientation: safeOrientation, style: pageStyle }, children, safeShowPageNumbers && /* @__PURE__ */ React.createElement(
|
|
62
|
-
Text,
|
|
63
|
-
{
|
|
64
|
-
style: styles.pageNumber,
|
|
65
|
-
render: ({ pageNumber, totalPages }) => `${pageNumber} / ${totalPages}`,
|
|
66
|
-
fixed: true
|
|
67
|
-
}
|
|
68
|
-
)));
|
|
69
|
-
};
|
|
70
|
-
var LayoutPDF_default = LayoutPDF;
|
|
71
|
-
|
|
72
|
-
// src/components/core/Img.tsx
|
|
73
|
-
import React2 from "react";
|
|
74
|
-
import { Image, StyleSheet as StyleSheet2 } from "@react-pdf/renderer";
|
|
75
|
-
var styles2 = StyleSheet2.create({
|
|
76
|
-
image: {
|
|
77
|
-
width: "100%",
|
|
78
|
-
height: "auto",
|
|
79
|
-
marginBottom: 14
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
var Img = ({ src, style }) => {
|
|
83
|
-
return /* @__PURE__ */ React2.createElement(Image, { src, style: [styles2.image, style] });
|
|
84
|
-
};
|
|
85
|
-
var Img_default = Img;
|
|
86
|
-
|
|
87
|
-
// src/components/core/Position.tsx
|
|
88
|
-
import React3 from "react";
|
|
89
|
-
import { View, StyleSheet as StyleSheet3 } from "@react-pdf/renderer";
|
|
90
|
-
var styles3 = StyleSheet3.create({
|
|
91
|
-
left: {
|
|
92
|
-
textAlign: "left"
|
|
93
|
-
},
|
|
94
|
-
right: {
|
|
95
|
-
textAlign: "right"
|
|
96
|
-
},
|
|
97
|
-
center: {
|
|
98
|
-
textAlign: "center"
|
|
99
|
-
}
|
|
100
|
-
});
|
|
101
|
-
var Left = ({ children, style }) => {
|
|
102
|
-
return /* @__PURE__ */ React3.createElement(View, { style: [styles3.left, style] }, children);
|
|
103
|
-
};
|
|
104
|
-
var Right = ({ children, style }) => {
|
|
105
|
-
return /* @__PURE__ */ React3.createElement(View, { style: [styles3.right, style] }, children);
|
|
106
|
-
};
|
|
107
|
-
var Center = ({ children, style }) => {
|
|
108
|
-
return /* @__PURE__ */ React3.createElement(View, { style: [styles3.center, style] }, children);
|
|
109
|
-
};
|
|
110
|
-
|
|
111
|
-
// src/components/core/Etiquetas.tsx
|
|
112
|
-
import React4 from "react";
|
|
113
|
-
import { Text as Text2, StyleSheet as StyleSheet4, Link } from "@react-pdf/renderer";
|
|
114
|
-
var styles4 = StyleSheet4.create({
|
|
115
|
-
p: {
|
|
116
|
-
fontSize: 12,
|
|
117
|
-
marginBottom: 14,
|
|
118
|
-
lineHeight: 1.5
|
|
119
|
-
},
|
|
120
|
-
h1: {
|
|
121
|
-
fontSize: 24,
|
|
122
|
-
fontWeight: "bold",
|
|
123
|
-
marginBottom: 12
|
|
124
|
-
},
|
|
125
|
-
h2: {
|
|
126
|
-
fontSize: 20,
|
|
127
|
-
fontWeight: "bold",
|
|
128
|
-
marginBottom: 10
|
|
129
|
-
},
|
|
130
|
-
h3: {
|
|
131
|
-
fontSize: 18,
|
|
132
|
-
fontWeight: "bold",
|
|
133
|
-
marginBottom: 8
|
|
134
|
-
},
|
|
135
|
-
h4: {
|
|
136
|
-
fontSize: 16,
|
|
137
|
-
fontWeight: "bold",
|
|
138
|
-
marginBottom: 6
|
|
139
|
-
},
|
|
140
|
-
h5: {
|
|
141
|
-
fontSize: 14,
|
|
142
|
-
fontWeight: "bold",
|
|
143
|
-
marginBottom: 4
|
|
144
|
-
},
|
|
145
|
-
h6: {
|
|
146
|
-
fontSize: 12,
|
|
147
|
-
fontWeight: "bold",
|
|
148
|
-
marginBottom: 0
|
|
149
|
-
},
|
|
150
|
-
strong: {
|
|
151
|
-
fontWeight: "bold"
|
|
152
|
-
},
|
|
153
|
-
em: {
|
|
154
|
-
fontStyle: "italic"
|
|
155
|
-
},
|
|
156
|
-
u: {
|
|
157
|
-
textDecoration: "underline"
|
|
158
|
-
},
|
|
159
|
-
small: {
|
|
160
|
-
fontSize: 10
|
|
161
|
-
},
|
|
162
|
-
blockquote: {
|
|
163
|
-
marginLeft: 20,
|
|
164
|
-
marginRight: 20,
|
|
165
|
-
fontStyle: "italic",
|
|
166
|
-
borderLeft: "4px solid #ccc",
|
|
167
|
-
paddingLeft: 10
|
|
168
|
-
},
|
|
169
|
-
mark: {
|
|
170
|
-
backgroundColor: "yellow"
|
|
171
|
-
},
|
|
172
|
-
A: {
|
|
173
|
-
color: "#3d65fd",
|
|
174
|
-
textDecoration: "none"
|
|
175
|
-
},
|
|
176
|
-
br: {
|
|
177
|
-
width: "100%",
|
|
178
|
-
height: 1,
|
|
179
|
-
marginTop: 7,
|
|
180
|
-
marginBottom: 7
|
|
181
|
-
}
|
|
182
|
-
});
|
|
183
|
-
var P = ({ children, style }) => {
|
|
184
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.p, style] }, children);
|
|
185
|
-
};
|
|
186
|
-
var H1 = ({ children, style }) => {
|
|
187
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.h1, style] }, children);
|
|
188
|
-
};
|
|
189
|
-
var H2 = ({ children, style }) => {
|
|
190
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.h2, style] }, children);
|
|
191
|
-
};
|
|
192
|
-
var H3 = ({ children, style }) => {
|
|
193
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.h3, style] }, children);
|
|
194
|
-
};
|
|
195
|
-
var H4 = ({ children, style }) => {
|
|
196
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.h4, style] }, children);
|
|
197
|
-
};
|
|
198
|
-
var H5 = ({ children, style }) => {
|
|
199
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.h5, style] }, children);
|
|
200
|
-
};
|
|
201
|
-
var H6 = ({ children, style }) => {
|
|
202
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.h6, style] }, children);
|
|
203
|
-
};
|
|
204
|
-
var Strong = ({ children, style }) => {
|
|
205
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.strong, style] }, children);
|
|
206
|
-
};
|
|
207
|
-
var Em = ({ children, style }) => {
|
|
208
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.em, style] }, children);
|
|
209
|
-
};
|
|
210
|
-
var U = ({ children, style }) => {
|
|
211
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.u, style] }, children);
|
|
212
|
-
};
|
|
213
|
-
var Small = ({ children, style }) => {
|
|
214
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.small, style] }, children);
|
|
215
|
-
};
|
|
216
|
-
var Blockquote = ({ children, style }) => {
|
|
217
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.blockquote, style] }, children);
|
|
218
|
-
};
|
|
219
|
-
var Mark = ({ children, style }) => {
|
|
220
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.mark, style] }, children);
|
|
221
|
-
};
|
|
222
|
-
var A = ({ children, style, href }) => {
|
|
223
|
-
return /* @__PURE__ */ React4.createElement(Link, { src: href, style: [styles4.A, style] }, children);
|
|
224
|
-
};
|
|
225
|
-
var BR = ({ style }) => {
|
|
226
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [styles4.br, style] }, "\n");
|
|
227
|
-
};
|
|
228
|
-
var Span = ({ children, style }) => {
|
|
229
|
-
return /* @__PURE__ */ React4.createElement(Text2, { style: [style] }, children);
|
|
230
|
-
};
|
|
231
|
-
|
|
232
|
-
// src/components/core/Tablet.tsx
|
|
233
|
-
import React5 from "react";
|
|
234
|
-
import { View as View2, Text as Text3, StyleSheet as StyleSheet5 } from "@react-pdf/renderer";
|
|
235
|
-
var styles5 = StyleSheet5.create({
|
|
236
|
-
table: {
|
|
237
|
-
width: "100%",
|
|
238
|
-
borderWidth: 1,
|
|
239
|
-
borderColor: "#000",
|
|
240
|
-
marginBottom: 20
|
|
241
|
-
},
|
|
242
|
-
thead: {
|
|
243
|
-
backgroundColor: "#ccc"
|
|
244
|
-
},
|
|
245
|
-
tr: {
|
|
246
|
-
flexDirection: "row"
|
|
247
|
-
},
|
|
248
|
-
textBold: {
|
|
249
|
-
fontSize: 10,
|
|
250
|
-
fontFamily: "Helvetica",
|
|
251
|
-
fontWeight: "bold",
|
|
252
|
-
textAlign: "center",
|
|
253
|
-
paddingTop: 4
|
|
254
|
-
},
|
|
255
|
-
text: {
|
|
256
|
-
fontSize: 10,
|
|
257
|
-
fontFamily: "Helvetica",
|
|
258
|
-
paddingTop: 4,
|
|
259
|
-
paddingLeft: 8,
|
|
260
|
-
paddingRight: 8
|
|
261
|
-
},
|
|
262
|
-
zebraOdd: {
|
|
263
|
-
backgroundColor: "#eeeeee"
|
|
264
|
-
}
|
|
265
|
-
});
|
|
266
|
-
var Table = ({ children, style }) => /* @__PURE__ */ React5.createElement(View2, { style: [styles5.table, style] }, children);
|
|
267
|
-
var Thead = ({ children, style }) => /* @__PURE__ */ React5.createElement(View2, { style: [styles5.thead, style] }, children);
|
|
268
|
-
var Tbody = ({ children, style }) => {
|
|
269
|
-
const rows = React5.Children.toArray(children);
|
|
270
|
-
const count = rows.length;
|
|
271
|
-
return /* @__PURE__ */ React5.createElement(React5.Fragment, null, rows.map(
|
|
272
|
-
(row, idx) => React5.cloneElement(row, {
|
|
273
|
-
isLastRow: idx === count - 1,
|
|
274
|
-
isOdd: idx % 2 === 1
|
|
275
|
-
})
|
|
276
|
-
));
|
|
277
|
-
};
|
|
278
|
-
var Tr = ({
|
|
279
|
-
children,
|
|
280
|
-
style,
|
|
281
|
-
isLastRow = false,
|
|
282
|
-
isOdd = false
|
|
283
|
-
}) => {
|
|
284
|
-
const elements = React5.Children.toArray(children);
|
|
285
|
-
const count = elements.length;
|
|
286
|
-
return /* @__PURE__ */ React5.createElement(View2, { style: [styles5.tr, style] }, elements.map((child, idx) => {
|
|
287
|
-
const isLast = idx === count - 1;
|
|
288
|
-
const width = `${(100 / count).toFixed(2)}%`;
|
|
289
|
-
return React5.cloneElement(child, { width, isLast, isLastRow, isOdd });
|
|
290
|
-
}));
|
|
291
|
-
};
|
|
292
|
-
var Th = ({
|
|
293
|
-
children,
|
|
294
|
-
style,
|
|
295
|
-
width,
|
|
296
|
-
height,
|
|
297
|
-
colSpan,
|
|
298
|
-
isLast = false,
|
|
299
|
-
isLastRow = false
|
|
300
|
-
}) => {
|
|
301
|
-
const baseWidth = typeof width === "string" && colSpan ? `${(parseFloat(width) * colSpan).toFixed(2)}%` : width;
|
|
302
|
-
const borders = {
|
|
303
|
-
borderRightWidth: isLast ? 0 : 1,
|
|
304
|
-
borderBottomWidth: isLastRow ? 0 : 1,
|
|
305
|
-
borderColor: "#000",
|
|
306
|
-
...height !== void 0 && { height }
|
|
307
|
-
};
|
|
308
|
-
return /* @__PURE__ */ React5.createElement(View2, { style: [styles5.textBold, { width: baseWidth }, borders, style] }, /* @__PURE__ */ React5.createElement(Text3, null, children));
|
|
309
|
-
};
|
|
310
|
-
var Td = ({
|
|
311
|
-
children,
|
|
312
|
-
style,
|
|
313
|
-
width,
|
|
314
|
-
height,
|
|
315
|
-
colSpan,
|
|
316
|
-
isLast = false,
|
|
317
|
-
isLastRow = false,
|
|
318
|
-
isOdd = false
|
|
319
|
-
}) => {
|
|
320
|
-
const baseWidth = typeof width === "string" && colSpan ? `${(parseFloat(width) * colSpan).toFixed(2)}%` : width;
|
|
321
|
-
const borders = {
|
|
322
|
-
borderRightWidth: isLast ? 0 : 1,
|
|
323
|
-
borderBottomWidth: isLastRow ? 0 : 1,
|
|
324
|
-
borderColor: "#000",
|
|
325
|
-
...height !== void 0 && { height }
|
|
326
|
-
};
|
|
327
|
-
return /* @__PURE__ */ React5.createElement(View2, { style: [
|
|
328
|
-
styles5.text,
|
|
329
|
-
isOdd && styles5.zebraOdd,
|
|
330
|
-
{ width: baseWidth },
|
|
331
|
-
borders,
|
|
332
|
-
style
|
|
333
|
-
] }, /* @__PURE__ */ React5.createElement(Text3, null, children));
|
|
334
|
-
};
|
|
335
|
-
|
|
336
|
-
// src/components/core/Grid.tsx
|
|
337
|
-
import React6 from "react";
|
|
338
|
-
import { View as View3, StyleSheet as StyleSheet6 } from "@react-pdf/renderer";
|
|
339
|
-
var styles6 = StyleSheet6.create({
|
|
340
|
-
container: {
|
|
341
|
-
width: "100%",
|
|
342
|
-
paddingHorizontal: 20
|
|
343
|
-
},
|
|
344
|
-
row: {
|
|
345
|
-
flexDirection: "row",
|
|
346
|
-
flexWrap: "wrap",
|
|
347
|
-
marginHorizontal: -5
|
|
348
|
-
},
|
|
349
|
-
col: {
|
|
350
|
-
paddingHorizontal: 5
|
|
351
|
-
},
|
|
352
|
-
col1: { width: "8.33%" },
|
|
353
|
-
col2: { width: "16.66%" },
|
|
354
|
-
col3: { width: "25%" },
|
|
355
|
-
col4: { width: "33.33%" },
|
|
356
|
-
col5: { width: "41.66%" },
|
|
357
|
-
col6: { width: "50%" },
|
|
358
|
-
col7: { width: "58.33%" },
|
|
359
|
-
col8: { width: "66.66%" },
|
|
360
|
-
col9: { width: "75%" },
|
|
361
|
-
col10: { width: "83.33%" },
|
|
362
|
-
col11: { width: "91.66%" },
|
|
363
|
-
col12: { width: "100%" }
|
|
364
|
-
});
|
|
365
|
-
var Container = ({ children, style }) => {
|
|
366
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.container, style] }, children);
|
|
367
|
-
};
|
|
368
|
-
var Row = ({ children, style }) => {
|
|
369
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.row, style] }, children);
|
|
370
|
-
};
|
|
371
|
-
var Col1 = ({ children, style }) => {
|
|
372
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col1, style] }, children);
|
|
373
|
-
};
|
|
374
|
-
var Col2 = ({ children, style }) => {
|
|
375
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col2, style] }, children);
|
|
376
|
-
};
|
|
377
|
-
var Col3 = ({ children, style }) => {
|
|
378
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col3, style] }, children);
|
|
379
|
-
};
|
|
380
|
-
var Col4 = ({ children, style }) => {
|
|
381
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col4, style] }, children);
|
|
382
|
-
};
|
|
383
|
-
var Col5 = ({ children, style }) => {
|
|
384
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col5, style] }, children);
|
|
385
|
-
};
|
|
386
|
-
var Col6 = ({ children, style }) => {
|
|
387
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col6, style] }, children);
|
|
388
|
-
};
|
|
389
|
-
var Col7 = ({ children, style }) => {
|
|
390
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col7, style] }, children);
|
|
391
|
-
};
|
|
392
|
-
var Col8 = ({ children, style }) => {
|
|
393
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col8, style] }, children);
|
|
394
|
-
};
|
|
395
|
-
var Col9 = ({ children, style }) => {
|
|
396
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col9, style] }, children);
|
|
397
|
-
};
|
|
398
|
-
var Col10 = ({ children, style }) => {
|
|
399
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col10, style] }, children);
|
|
400
|
-
};
|
|
401
|
-
var Col11 = ({ children, style }) => {
|
|
402
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col11, style] }, children);
|
|
403
|
-
};
|
|
404
|
-
var Col12 = ({ children, style }) => {
|
|
405
|
-
return /* @__PURE__ */ React6.createElement(View3, { style: [styles6.col, styles6.col12, style] }, children);
|
|
406
|
-
};
|
|
407
|
-
|
|
408
|
-
// src/components/core/PageElements.tsx
|
|
409
|
-
import React7 from "react";
|
|
410
|
-
import { Text as Text4, View as View4, StyleSheet as StyleSheet7 } from "@react-pdf/renderer";
|
|
411
|
-
var styles7 = StyleSheet7.create({
|
|
412
|
-
header: {
|
|
413
|
-
position: "absolute",
|
|
414
|
-
top: 20,
|
|
415
|
-
left: 0,
|
|
416
|
-
right: 0,
|
|
417
|
-
textAlign: "center",
|
|
418
|
-
fontSize: 10,
|
|
419
|
-
color: "#666",
|
|
420
|
-
paddingHorizontal: 40
|
|
421
|
-
},
|
|
422
|
-
footer: {
|
|
423
|
-
position: "absolute",
|
|
424
|
-
bottom: 20,
|
|
425
|
-
left: 0,
|
|
426
|
-
right: 0,
|
|
427
|
-
textAlign: "center",
|
|
428
|
-
fontSize: 10,
|
|
429
|
-
color: "#666",
|
|
430
|
-
paddingHorizontal: 40
|
|
431
|
-
}
|
|
432
|
-
});
|
|
433
|
-
var Header = ({ children, style, fixed = false }) => {
|
|
434
|
-
return /* @__PURE__ */ React7.createElement(View4, { style: [styles7.header, style], fixed }, typeof children === "string" ? /* @__PURE__ */ React7.createElement(Text4, null, children) : children);
|
|
435
|
-
};
|
|
436
|
-
var Footer = ({ children, style, fixed = false }) => {
|
|
437
|
-
return /* @__PURE__ */ React7.createElement(View4, { style: [styles7.footer, style], fixed }, typeof children === "string" ? /* @__PURE__ */ React7.createElement(Text4, null, children) : children);
|
|
438
|
-
};
|
|
439
|
-
|
|
440
|
-
// src/components/core/QR.tsx
|
|
441
|
-
import React8 from "react";
|
|
442
|
-
import { useEffect, useState } from "react";
|
|
443
|
-
import { Image as Image2, View as View5, Text as Text5 } from "@react-pdf/renderer";
|
|
444
|
-
import QRCodeStyling from "qr-code-styling";
|
|
445
|
-
var QR = ({
|
|
446
|
-
url,
|
|
447
|
-
size = 200,
|
|
448
|
-
colorData = "#000000",
|
|
449
|
-
colorDataBG = "#ffffff",
|
|
450
|
-
logo,
|
|
451
|
-
logoWidth = 30,
|
|
452
|
-
logoHeight,
|
|
453
|
-
margin = 0,
|
|
454
|
-
errorCorrectionLevel = "H",
|
|
455
|
-
style,
|
|
456
|
-
dotType = "square",
|
|
457
|
-
cornerSquareType = "square",
|
|
458
|
-
cornerDotType = "square",
|
|
459
|
-
cornerSquareColor,
|
|
460
|
-
cornerDotColor,
|
|
461
|
-
logoBG = colorDataBG,
|
|
462
|
-
logoText,
|
|
463
|
-
moveText = 0,
|
|
464
|
-
textColor = colorData,
|
|
465
|
-
fontSize = 12,
|
|
466
|
-
fontFamily = "Helvetica",
|
|
467
|
-
textBackgroundColor = colorDataBG,
|
|
468
|
-
textPadding = 1,
|
|
469
|
-
textBold = true
|
|
470
|
-
}) => {
|
|
471
|
-
const [qrDataURL, setQrDataURL] = useState(null);
|
|
472
|
-
const actualLogoWidth = logoWidth || Math.floor(size * 0.2);
|
|
473
|
-
const actualLogoHeight = logoHeight || actualLogoWidth;
|
|
474
|
-
useEffect(() => {
|
|
475
|
-
const generateQRCode = async () => {
|
|
476
|
-
try {
|
|
477
|
-
const qrCode = new QRCodeStyling({
|
|
478
|
-
width: size,
|
|
479
|
-
height: size,
|
|
480
|
-
type: "canvas",
|
|
481
|
-
data: url,
|
|
482
|
-
dotsOptions: {
|
|
483
|
-
color: colorData,
|
|
484
|
-
type: dotType
|
|
485
|
-
},
|
|
486
|
-
cornersSquareOptions: {
|
|
487
|
-
color: cornerSquareColor || colorData,
|
|
488
|
-
type: cornerSquareType
|
|
489
|
-
},
|
|
490
|
-
cornersDotOptions: {
|
|
491
|
-
color: cornerDotColor || colorData,
|
|
492
|
-
type: cornerDotType
|
|
493
|
-
},
|
|
494
|
-
backgroundOptions: {
|
|
495
|
-
color: colorDataBG
|
|
496
|
-
},
|
|
497
|
-
qrOptions: {
|
|
498
|
-
errorCorrectionLevel
|
|
499
|
-
},
|
|
500
|
-
margin
|
|
501
|
-
});
|
|
502
|
-
const container = document.createElement("div");
|
|
503
|
-
container.style.position = "absolute";
|
|
504
|
-
container.style.top = "-9999px";
|
|
505
|
-
container.style.left = "-9999px";
|
|
506
|
-
document.body.appendChild(container);
|
|
507
|
-
qrCode.append(container);
|
|
508
|
-
setTimeout(() => {
|
|
509
|
-
try {
|
|
510
|
-
const qrCanvas = container.querySelector("canvas");
|
|
511
|
-
if (qrCanvas) {
|
|
512
|
-
const canvas = document.createElement("canvas");
|
|
513
|
-
canvas.width = size;
|
|
514
|
-
canvas.height = size;
|
|
515
|
-
const ctx = canvas.getContext("2d");
|
|
516
|
-
if (ctx) {
|
|
517
|
-
ctx.drawImage(qrCanvas, 0, 0);
|
|
518
|
-
const dataURL = canvas.toDataURL("image/png");
|
|
519
|
-
setQrDataURL(dataURL);
|
|
520
|
-
}
|
|
521
|
-
}
|
|
522
|
-
document.body.removeChild(container);
|
|
523
|
-
} catch (error) {
|
|
524
|
-
console.error("Error capturing QR code:", error);
|
|
525
|
-
}
|
|
526
|
-
}, 100);
|
|
527
|
-
} catch (error) {
|
|
528
|
-
console.error("Error generating QR code:", error);
|
|
529
|
-
}
|
|
530
|
-
};
|
|
531
|
-
generateQRCode();
|
|
532
|
-
}, [
|
|
533
|
-
url,
|
|
534
|
-
size,
|
|
535
|
-
colorData,
|
|
536
|
-
colorDataBG,
|
|
537
|
-
margin,
|
|
538
|
-
errorCorrectionLevel,
|
|
539
|
-
dotType,
|
|
540
|
-
cornerSquareType,
|
|
541
|
-
cornerDotType,
|
|
542
|
-
cornerSquareColor,
|
|
543
|
-
cornerDotColor,
|
|
544
|
-
logoBG
|
|
545
|
-
]);
|
|
546
|
-
if (!qrDataURL) return null;
|
|
547
|
-
const centerPosition = size / 2;
|
|
548
|
-
const logoContainerSize = Math.max(actualLogoWidth, actualLogoHeight) + 10;
|
|
549
|
-
return /* @__PURE__ */ React8.createElement(View5, { style: { width: size, height: size, position: "relative", ...style } }, /* @__PURE__ */ React8.createElement(Image2, { src: qrDataURL || "/placeholder.svg", style: { width: size, height: size } }), logo && /* @__PURE__ */ React8.createElement(
|
|
550
|
-
View5,
|
|
551
|
-
{
|
|
552
|
-
style: {
|
|
553
|
-
position: "absolute",
|
|
554
|
-
width: logoContainerSize,
|
|
555
|
-
height: logoContainerSize,
|
|
556
|
-
backgroundColor: logoBG || colorDataBG,
|
|
557
|
-
left: centerPosition - logoContainerSize / 2,
|
|
558
|
-
top: centerPosition - logoContainerSize / 2,
|
|
559
|
-
borderRadius: 100,
|
|
560
|
-
border: `5px solid ${colorData}`,
|
|
561
|
-
padding: 0
|
|
562
|
-
}
|
|
563
|
-
},
|
|
564
|
-
/* @__PURE__ */ React8.createElement(
|
|
565
|
-
Image2,
|
|
566
|
-
{
|
|
567
|
-
src: logo || "/placeholder.svg",
|
|
568
|
-
style: {
|
|
569
|
-
objectFit: "contain",
|
|
570
|
-
width: actualLogoWidth,
|
|
571
|
-
height: actualLogoHeight || actualLogoWidth
|
|
572
|
-
}
|
|
573
|
-
}
|
|
574
|
-
)
|
|
575
|
-
), !logo && logoText && /* @__PURE__ */ React8.createElement(
|
|
576
|
-
View5,
|
|
577
|
-
{
|
|
578
|
-
style: {
|
|
579
|
-
position: "absolute",
|
|
580
|
-
backgroundColor: textBackgroundColor,
|
|
581
|
-
padding: textPadding,
|
|
582
|
-
borderRadius: 4,
|
|
583
|
-
left: moveText + centerPosition - 20,
|
|
584
|
-
// Approximate center
|
|
585
|
-
top: centerPosition - 10
|
|
586
|
-
// Approximate center
|
|
587
|
-
}
|
|
588
|
-
},
|
|
589
|
-
/* @__PURE__ */ React8.createElement(
|
|
590
|
-
Text5,
|
|
591
|
-
{
|
|
592
|
-
style: {
|
|
593
|
-
color: textColor,
|
|
594
|
-
fontSize,
|
|
595
|
-
fontFamily,
|
|
596
|
-
fontWeight: textBold ? "bold" : "normal"
|
|
597
|
-
}
|
|
598
|
-
},
|
|
599
|
-
logoText
|
|
600
|
-
)
|
|
601
|
-
));
|
|
602
|
-
};
|
|
603
|
-
var QR_default = QR;
|
|
604
|
-
|
|
605
|
-
// src/components/core/Lista.tsx
|
|
606
|
-
import React9 from "react";
|
|
607
|
-
import { View as View6, Text as Text6, StyleSheet as StyleSheet8 } from "@react-pdf/renderer";
|
|
608
|
-
var styles8 = StyleSheet8.create({
|
|
609
|
-
ul: {
|
|
610
|
-
marginBottom: 10,
|
|
611
|
-
paddingLeft: 15
|
|
612
|
-
},
|
|
613
|
-
ol: {
|
|
614
|
-
marginBottom: 10,
|
|
615
|
-
paddingLeft: 15
|
|
616
|
-
},
|
|
617
|
-
li: {
|
|
618
|
-
marginBottom: 5,
|
|
619
|
-
flexDirection: "row"
|
|
620
|
-
},
|
|
621
|
-
bulletPoint: {
|
|
622
|
-
width: 15,
|
|
623
|
-
marginRight: 5,
|
|
624
|
-
fontSize: 12
|
|
625
|
-
},
|
|
626
|
-
itemContent: {
|
|
627
|
-
flex: 1
|
|
628
|
-
}
|
|
629
|
-
});
|
|
630
|
-
var getBulletPoint = (type = "disc") => {
|
|
631
|
-
switch (type) {
|
|
632
|
-
case "circle":
|
|
633
|
-
return "\u25CB";
|
|
634
|
-
case "square":
|
|
635
|
-
return "\u25A0";
|
|
636
|
-
case "disc":
|
|
637
|
-
default:
|
|
638
|
-
return "\u2022";
|
|
639
|
-
}
|
|
640
|
-
};
|
|
641
|
-
var getOrderedMarker = (index, type = "decimal", start = 1) => {
|
|
642
|
-
const actualIndex = start + index - 1;
|
|
643
|
-
switch (type) {
|
|
644
|
-
case "lower-alpha":
|
|
645
|
-
return String.fromCharCode(97 + actualIndex % 26) + ".";
|
|
646
|
-
case "upper-alpha":
|
|
647
|
-
return String.fromCharCode(65 + actualIndex % 26) + ".";
|
|
648
|
-
case "lower-roman":
|
|
649
|
-
return toRoman(actualIndex).toLowerCase() + ".";
|
|
650
|
-
case "upper-roman":
|
|
651
|
-
return toRoman(actualIndex) + ".";
|
|
652
|
-
case "decimal":
|
|
653
|
-
default:
|
|
654
|
-
return actualIndex + ".";
|
|
655
|
-
}
|
|
656
|
-
};
|
|
657
|
-
var toRoman = (num) => {
|
|
658
|
-
if (num <= 0 || num > 3999) return String(num);
|
|
659
|
-
const romanNumerals = [
|
|
660
|
-
["", "I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX"],
|
|
661
|
-
["", "X", "XX", "XXX", "XL", "L", "LX", "LXX", "LXXX", "XC"],
|
|
662
|
-
["", "C", "CC", "CCC", "CD", "D", "DC", "DCC", "DCCC", "CM"],
|
|
663
|
-
["", "M", "MM", "MMM"]
|
|
664
|
-
];
|
|
665
|
-
return romanNumerals[3][Math.floor(num / 1e3)] + romanNumerals[2][Math.floor(num % 1e3 / 100)] + romanNumerals[1][Math.floor(num % 100 / 10)] + romanNumerals[0][num % 10];
|
|
666
|
-
};
|
|
667
|
-
var UL = ({ children, style, type = "disc" }) => {
|
|
668
|
-
const childrenWithBullets = React9.Children.map(children, (child, index) => {
|
|
669
|
-
if (React9.isValidElement(child)) {
|
|
670
|
-
return React9.cloneElement(child, {
|
|
671
|
-
bulletType: type,
|
|
672
|
-
isOrdered: false,
|
|
673
|
-
index: index + 1
|
|
674
|
-
});
|
|
675
|
-
}
|
|
676
|
-
return child;
|
|
677
|
-
});
|
|
678
|
-
return /* @__PURE__ */ React9.createElement(View6, { style: [styles8.ul, style] }, childrenWithBullets);
|
|
679
|
-
};
|
|
680
|
-
var OL = ({ children, style, type = "decimal", start = 1 }) => {
|
|
681
|
-
const childrenWithNumbers = React9.Children.map(children, (child, index) => {
|
|
682
|
-
if (React9.isValidElement(child)) {
|
|
683
|
-
return React9.cloneElement(child, {
|
|
684
|
-
bulletType: type,
|
|
685
|
-
isOrdered: true,
|
|
686
|
-
index: index + 1,
|
|
687
|
-
start
|
|
688
|
-
});
|
|
689
|
-
}
|
|
690
|
-
return child;
|
|
691
|
-
});
|
|
692
|
-
return /* @__PURE__ */ React9.createElement(View6, { style: [styles8.ol, style] }, childrenWithNumbers);
|
|
693
|
-
};
|
|
694
|
-
var LI = ({ children, style, bulletType = "disc", isOrdered = false, index = 1, start = 1, value }) => {
|
|
695
|
-
let marker;
|
|
696
|
-
if (isOrdered) {
|
|
697
|
-
const actualIndex = value !== void 0 ? Number(value) : index;
|
|
698
|
-
marker = getOrderedMarker(actualIndex, bulletType, start);
|
|
699
|
-
} else {
|
|
700
|
-
marker = getBulletPoint(bulletType);
|
|
701
|
-
}
|
|
702
|
-
return /* @__PURE__ */ React9.createElement(View6, { style: [styles8.li, style] }, /* @__PURE__ */ React9.createElement(Text6, { style: styles8.bulletPoint }, marker), /* @__PURE__ */ React9.createElement(View6, { style: styles8.itemContent }, typeof children === "string" ? /* @__PURE__ */ React9.createElement(Text6, null, children) : children));
|
|
703
|
-
};
|
|
704
|
-
|
|
705
|
-
// src/components/core/index.tsx
|
|
706
|
-
import { View as View7, Text as Text7, StyleSheet as StyleSheet9, Font } from "@react-pdf/renderer";
|
|
707
|
-
|
|
708
|
-
// src/functions/decodeBase64Pdf.ts
|
|
709
|
-
var decodeBase64Pdf = (base64, fileName) => {
|
|
710
|
-
const byteCharacters = atob(base64);
|
|
711
|
-
const byteNumbers = new Array(byteCharacters.length);
|
|
712
|
-
for (let i = 0; i < byteCharacters.length; i++) {
|
|
713
|
-
byteNumbers[i] = byteCharacters.charCodeAt(i);
|
|
714
|
-
}
|
|
715
|
-
const byteArray = new Uint8Array(byteNumbers);
|
|
716
|
-
const blob = new Blob([byteArray], { type: "application/pdf" });
|
|
717
|
-
const blobUrl = URL.createObjectURL(blob);
|
|
718
|
-
if (document === void 0) {
|
|
719
|
-
console.error("document is undefined, only works in browser context");
|
|
720
|
-
return;
|
|
721
|
-
}
|
|
722
|
-
const link = document.createElement("a");
|
|
723
|
-
link.href = blobUrl;
|
|
724
|
-
link.download = fileName;
|
|
725
|
-
document.body.appendChild(link);
|
|
726
|
-
link.click();
|
|
727
|
-
document.body.removeChild(link);
|
|
728
|
-
window.open(blobUrl, "_blank");
|
|
729
|
-
setTimeout(() => {
|
|
730
|
-
URL.revokeObjectURL(blobUrl);
|
|
731
|
-
}, 100);
|
|
732
|
-
};
|
|
733
|
-
var decodeBase64Pdf_default = decodeBase64Pdf;
|
|
734
|
-
|
|
735
|
-
// src/functions/generatePDF.ts
|
|
736
|
-
import { renderToStream } from "@react-pdf/renderer";
|
|
737
|
-
import { createElement } from "react";
|
|
738
|
-
var generatePDF = async ({ template: Template, data }) => {
|
|
739
|
-
try {
|
|
740
|
-
if (!Template) {
|
|
741
|
-
throw new Error("Template not provided");
|
|
742
|
-
}
|
|
743
|
-
const MyDocument = createElement(Template, { data });
|
|
744
|
-
const stream = await renderToStream(MyDocument);
|
|
745
|
-
const base64String = await new Promise((resolve, reject) => {
|
|
746
|
-
const chunks = [];
|
|
747
|
-
stream.on("data", (chunk) => chunks.push(chunk));
|
|
748
|
-
stream.on("end", () => resolve(Buffer.concat(chunks).toString("base64")));
|
|
749
|
-
stream.on("error", (error) => reject(error));
|
|
750
|
-
});
|
|
751
|
-
return base64String;
|
|
752
|
-
} catch (error) {
|
|
753
|
-
throw new Error("Error generating PDF: " + (error instanceof Error ? error.message : "Unknown error"));
|
|
754
|
-
}
|
|
755
|
-
};
|
|
756
|
-
var generatePDF_default = generatePDF;
|
|
757
|
-
export {
|
|
758
|
-
A,
|
|
759
|
-
BR,
|
|
760
|
-
Blockquote,
|
|
761
|
-
Center,
|
|
762
|
-
Col1,
|
|
763
|
-
Col10,
|
|
764
|
-
Col11,
|
|
765
|
-
Col12,
|
|
766
|
-
Col2,
|
|
767
|
-
Col3,
|
|
768
|
-
Col4,
|
|
769
|
-
Col5,
|
|
770
|
-
Col6,
|
|
771
|
-
Col7,
|
|
772
|
-
Col8,
|
|
773
|
-
Col9,
|
|
774
|
-
Container,
|
|
775
|
-
Em,
|
|
776
|
-
Font,
|
|
777
|
-
Footer,
|
|
778
|
-
H1,
|
|
779
|
-
H2,
|
|
780
|
-
H3,
|
|
781
|
-
H4,
|
|
782
|
-
H5,
|
|
783
|
-
H6,
|
|
784
|
-
Header,
|
|
785
|
-
Img_default as Img,
|
|
786
|
-
LI,
|
|
787
|
-
LayoutPDF_default as LayoutPDF,
|
|
788
|
-
Left,
|
|
789
|
-
Mark,
|
|
790
|
-
OL,
|
|
791
|
-
P,
|
|
792
|
-
QR_default as QR,
|
|
793
|
-
Right,
|
|
794
|
-
Row,
|
|
795
|
-
Small,
|
|
796
|
-
Span,
|
|
797
|
-
Strong,
|
|
798
|
-
StyleSheet9 as StyleSheet,
|
|
799
|
-
Table,
|
|
800
|
-
Tbody,
|
|
801
|
-
Td,
|
|
802
|
-
Text7 as Text,
|
|
803
|
-
Th,
|
|
804
|
-
Thead,
|
|
805
|
-
Tr,
|
|
806
|
-
U,
|
|
807
|
-
UL,
|
|
808
|
-
View7 as View,
|
|
809
|
-
decodeBase64Pdf_default as decodeBase64Pdf,
|
|
810
|
-
generatePDF_default as generatePDF
|
|
811
|
-
};
|