@archbase/components 4.0.21 → 4.0.22
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/archbase-components-4.0.22.tgz +0 -0
- package/dist/index.js +4526 -4644
- package/dist/viewers/index.d.ts +0 -2
- package/package.json +4 -8
- package/src/viewers/index.ts +0 -4
- package/dist/archbase-components-4.0.21.tgz +0 -0
- package/dist/viewers/ArchbasePdfBuilder.d.ts +0 -53
- package/src/viewers/ArchbasePdfBuilder.tsx +0 -291
package/dist/viewers/index.d.ts
CHANGED
|
@@ -4,8 +4,6 @@ export { ArchbasePDFAnnotations, ArchbasePDFAnnotationsList, } from './ArchbaseP
|
|
|
4
4
|
export type { ArchbasePDFViewerProps, PDFSource, PDFAnnotation, PDFRenderMode, PDFTextLayerMode, PDFToolbarActions, } from './ArchbasePDFViewer.types';
|
|
5
5
|
export { ArchbaseXmlViewer } from './ArchbaseXmlViewer';
|
|
6
6
|
export type { ArchbaseXmlViewerProps } from './ArchbaseXmlViewer';
|
|
7
|
-
export { ArchbasePdfBuilder } from './ArchbasePdfBuilder';
|
|
8
|
-
export type { ArchbasePdfBuilderProps, ArchbasePdfBuilderRef } from './ArchbasePdfBuilder';
|
|
9
7
|
export { ArchbaseDocViewer } from './ArchbaseDocViewer';
|
|
10
8
|
export type { ArchbaseDocViewerProps } from './ArchbaseDocViewer';
|
|
11
9
|
export * from './file-preview';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@archbase/components",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.22",
|
|
4
4
|
"description": "UI Components for Archbase React v3 - Form editors, data visualization, and business components",
|
|
5
5
|
"author": "Edson Martins <edsonmartins2005@gmail.com>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -42,10 +42,6 @@
|
|
|
42
42
|
"@fortune-sheet/react": "^1.0.4",
|
|
43
43
|
"@gfazioli/mantine-list-view-table": "^2.2.0",
|
|
44
44
|
"@mui/x-data-grid": "^7.28.3",
|
|
45
|
-
"@pdfme/common": "^5.3.6",
|
|
46
|
-
"@pdfme/generator": "^5.3.6",
|
|
47
|
-
"@pdfme/schemas": "^5.3.6",
|
|
48
|
-
"@pdfme/ui": "^5.3.6",
|
|
49
45
|
"@rehooks/component-size": "^1.0.3",
|
|
50
46
|
"ag-grid-community": "^35.3.0",
|
|
51
47
|
"ag-grid-react": "^35.3.0",
|
|
@@ -122,9 +118,9 @@
|
|
|
122
118
|
"vis-timeline": "^7.7.3",
|
|
123
119
|
"xlsx": "^0.18.5",
|
|
124
120
|
"yet-another-react-lightbox": "^3.21.0",
|
|
125
|
-
"@archbase/core": "4.0.
|
|
126
|
-
"@archbase/data": "4.0.
|
|
127
|
-
"@archbase/layout": "4.0.
|
|
121
|
+
"@archbase/core": "4.0.22",
|
|
122
|
+
"@archbase/data": "4.0.22",
|
|
123
|
+
"@archbase/layout": "4.0.22"
|
|
128
124
|
},
|
|
129
125
|
"devDependencies": {
|
|
130
126
|
"@types/d3": "^7.4.3",
|
package/src/viewers/index.ts
CHANGED
|
@@ -17,10 +17,6 @@ export type {
|
|
|
17
17
|
export { ArchbaseXmlViewer } from './ArchbaseXmlViewer';
|
|
18
18
|
export type { ArchbaseXmlViewerProps } from './ArchbaseXmlViewer';
|
|
19
19
|
|
|
20
|
-
// PDF Builder (pdfme)
|
|
21
|
-
export { ArchbasePdfBuilder } from './ArchbasePdfBuilder';
|
|
22
|
-
export type { ArchbasePdfBuilderProps, ArchbasePdfBuilderRef } from './ArchbasePdfBuilder';
|
|
23
|
-
|
|
24
20
|
// Document Viewer
|
|
25
21
|
export { ArchbaseDocViewer } from './ArchbaseDocViewer';
|
|
26
22
|
export type { ArchbaseDocViewerProps } from './ArchbaseDocViewer';
|
|
Binary file
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { CSSProperties } from 'react';
|
|
2
|
-
import { Designer, Form, Viewer } from '@pdfme/ui';
|
|
3
|
-
import { Template, Font } from '@pdfme/common';
|
|
4
|
-
export interface ArchbasePdfBuilderRef {
|
|
5
|
-
/** Generate a PDF from the current template + inputs and return its bytes. */
|
|
6
|
-
generatePdf(): Promise<Uint8Array>;
|
|
7
|
-
/** Return the current pdfme instance (Designer | Form | Viewer) if available. */
|
|
8
|
-
getInstance(): Designer | Form | Viewer | null;
|
|
9
|
-
}
|
|
10
|
-
export interface ArchbasePdfBuilderProps<T = unknown> {
|
|
11
|
-
/** Which pdfme UI to render. */
|
|
12
|
-
mode?: 'designer' | 'form' | 'viewer';
|
|
13
|
-
/** The pdfme template object. */
|
|
14
|
-
template: Template;
|
|
15
|
-
/**
|
|
16
|
-
* Optional Archbase DataSource – used in `form` mode to populate inputs
|
|
17
|
-
* from the current record.
|
|
18
|
-
*/
|
|
19
|
-
dataSource?: any;
|
|
20
|
-
/** Field path inside the data source record. */
|
|
21
|
-
dataField?: string;
|
|
22
|
-
/**
|
|
23
|
-
* Standalone inputs for `form` / `viewer` mode.
|
|
24
|
-
* Each element maps schema field names to string values.
|
|
25
|
-
*/
|
|
26
|
-
inputs?: Record<string, string>[];
|
|
27
|
-
/** Fired whenever the designer changes the template. */
|
|
28
|
-
onTemplateChange?: (template: Template) => void;
|
|
29
|
-
/** Fired when `generatePdf` completes. */
|
|
30
|
-
onGenerate?: (pdf: Uint8Array) => void;
|
|
31
|
-
/**
|
|
32
|
-
* Additional pdfme schema plugins.
|
|
33
|
-
* Defaults to `[text, image, barcodes]`.
|
|
34
|
-
*/
|
|
35
|
-
plugins?: Record<string, any>;
|
|
36
|
-
/** Custom font configuration forwarded to pdfme. */
|
|
37
|
-
font?: Font;
|
|
38
|
-
/** Container height. */
|
|
39
|
-
height?: string | number;
|
|
40
|
-
/** Container width. */
|
|
41
|
-
width?: string | number;
|
|
42
|
-
/** Optional label rendered above the builder (uses Mantine Input.Wrapper). */
|
|
43
|
-
label?: string;
|
|
44
|
-
/** Optional description rendered below the label. */
|
|
45
|
-
description?: string;
|
|
46
|
-
/** Extra inline styles applied to the outer wrapper. */
|
|
47
|
-
style?: CSSProperties;
|
|
48
|
-
/** Extra CSS class name applied to the outer wrapper. */
|
|
49
|
-
className?: string;
|
|
50
|
-
}
|
|
51
|
-
export declare const ArchbasePdfBuilder: <T = unknown>(props: ArchbasePdfBuilderProps<T> & {
|
|
52
|
-
ref?: React.Ref<ArchbasePdfBuilderRef>;
|
|
53
|
-
}) => React.ReactElement | null;
|
|
@@ -1,291 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
forwardRef,
|
|
3
|
-
useEffect,
|
|
4
|
-
useImperativeHandle,
|
|
5
|
-
useRef,
|
|
6
|
-
useState,
|
|
7
|
-
useCallback,
|
|
8
|
-
type CSSProperties,
|
|
9
|
-
} from 'react';
|
|
10
|
-
import { Box, Input } from '@mantine/core';
|
|
11
|
-
import { Designer, Form, Viewer } from '@pdfme/ui';
|
|
12
|
-
import type { Template, Font } from '@pdfme/common';
|
|
13
|
-
import { text, image, barcodes } from '@pdfme/schemas';
|
|
14
|
-
import { generate } from '@pdfme/generator';
|
|
15
|
-
import { useArchbaseV1V2Compatibility } from '@archbase/data';
|
|
16
|
-
|
|
17
|
-
// ---------------------------------------------------------------------------
|
|
18
|
-
// Public ref interface
|
|
19
|
-
// ---------------------------------------------------------------------------
|
|
20
|
-
|
|
21
|
-
export interface ArchbasePdfBuilderRef {
|
|
22
|
-
/** Generate a PDF from the current template + inputs and return its bytes. */
|
|
23
|
-
generatePdf(): Promise<Uint8Array>;
|
|
24
|
-
/** Return the current pdfme instance (Designer | Form | Viewer) if available. */
|
|
25
|
-
getInstance(): Designer | Form | Viewer | null;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
// ---------------------------------------------------------------------------
|
|
29
|
-
// Props
|
|
30
|
-
// ---------------------------------------------------------------------------
|
|
31
|
-
|
|
32
|
-
export interface ArchbasePdfBuilderProps<T = unknown> {
|
|
33
|
-
/** Which pdfme UI to render. */
|
|
34
|
-
mode?: 'designer' | 'form' | 'viewer';
|
|
35
|
-
|
|
36
|
-
/** The pdfme template object. */
|
|
37
|
-
template: Template;
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
* Optional Archbase DataSource – used in `form` mode to populate inputs
|
|
41
|
-
* from the current record.
|
|
42
|
-
*/
|
|
43
|
-
dataSource?: any;
|
|
44
|
-
/** Field path inside the data source record. */
|
|
45
|
-
dataField?: string;
|
|
46
|
-
|
|
47
|
-
/**
|
|
48
|
-
* Standalone inputs for `form` / `viewer` mode.
|
|
49
|
-
* Each element maps schema field names to string values.
|
|
50
|
-
*/
|
|
51
|
-
inputs?: Record<string, string>[];
|
|
52
|
-
|
|
53
|
-
/** Fired whenever the designer changes the template. */
|
|
54
|
-
onTemplateChange?: (template: Template) => void;
|
|
55
|
-
|
|
56
|
-
/** Fired when `generatePdf` completes. */
|
|
57
|
-
onGenerate?: (pdf: Uint8Array) => void;
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Additional pdfme schema plugins.
|
|
61
|
-
* Defaults to `[text, image, barcodes]`.
|
|
62
|
-
*/
|
|
63
|
-
plugins?: Record<string, any>;
|
|
64
|
-
|
|
65
|
-
/** Custom font configuration forwarded to pdfme. */
|
|
66
|
-
font?: Font;
|
|
67
|
-
|
|
68
|
-
/** Container height. */
|
|
69
|
-
height?: string | number;
|
|
70
|
-
/** Container width. */
|
|
71
|
-
width?: string | number;
|
|
72
|
-
|
|
73
|
-
/** Optional label rendered above the builder (uses Mantine Input.Wrapper). */
|
|
74
|
-
label?: string;
|
|
75
|
-
/** Optional description rendered below the label. */
|
|
76
|
-
description?: string;
|
|
77
|
-
|
|
78
|
-
/** Extra inline styles applied to the outer wrapper. */
|
|
79
|
-
style?: CSSProperties;
|
|
80
|
-
/** Extra CSS class name applied to the outer wrapper. */
|
|
81
|
-
className?: string;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
// ---------------------------------------------------------------------------
|
|
85
|
-
// Default plugins helper
|
|
86
|
-
// ---------------------------------------------------------------------------
|
|
87
|
-
|
|
88
|
-
const DEFAULT_PLUGINS: Record<string, any> = { Text: text, Image: image, ...barcodes };
|
|
89
|
-
|
|
90
|
-
// ---------------------------------------------------------------------------
|
|
91
|
-
// Component
|
|
92
|
-
// ---------------------------------------------------------------------------
|
|
93
|
-
|
|
94
|
-
function ArchbasePdfBuilderInner<T = unknown>(
|
|
95
|
-
{
|
|
96
|
-
mode = 'designer',
|
|
97
|
-
template,
|
|
98
|
-
dataSource,
|
|
99
|
-
dataField,
|
|
100
|
-
inputs: inputsProp,
|
|
101
|
-
onTemplateChange,
|
|
102
|
-
onGenerate,
|
|
103
|
-
plugins,
|
|
104
|
-
font,
|
|
105
|
-
height = '100vh',
|
|
106
|
-
width = '100%',
|
|
107
|
-
label,
|
|
108
|
-
description,
|
|
109
|
-
style,
|
|
110
|
-
className,
|
|
111
|
-
}: ArchbasePdfBuilderProps<T>,
|
|
112
|
-
ref: React.Ref<ArchbasePdfBuilderRef>,
|
|
113
|
-
) {
|
|
114
|
-
// ---- Container ref ----
|
|
115
|
-
const containerRef = useRef<HTMLDivElement>(null);
|
|
116
|
-
|
|
117
|
-
// ---- pdfme instance ----
|
|
118
|
-
const instanceRef = useRef<Designer | Form | Viewer | null>(null);
|
|
119
|
-
|
|
120
|
-
// ---- Keep latest template in a ref so callbacks always see current value ----
|
|
121
|
-
const templateRef = useRef<Template>(template);
|
|
122
|
-
templateRef.current = template;
|
|
123
|
-
|
|
124
|
-
// ---- DataSource integration (form mode) ----
|
|
125
|
-
const { currentValue: dsValue, loadDataSourceFieldValue } =
|
|
126
|
-
useArchbaseV1V2Compatibility<Record<string, string>[] | undefined>(
|
|
127
|
-
'ArchbasePdfBuilder',
|
|
128
|
-
dataSource,
|
|
129
|
-
dataField,
|
|
130
|
-
undefined,
|
|
131
|
-
);
|
|
132
|
-
|
|
133
|
-
useEffect(() => {
|
|
134
|
-
if (dataSource && dataField) {
|
|
135
|
-
loadDataSourceFieldValue();
|
|
136
|
-
}
|
|
137
|
-
}, [dataSource, dataField, loadDataSourceFieldValue]);
|
|
138
|
-
|
|
139
|
-
// Resolve inputs: prop takes precedence, then data-source value, then empty.
|
|
140
|
-
const resolvedInputs: Record<string, string>[] =
|
|
141
|
-
inputsProp ?? dsValue ?? [{}];
|
|
142
|
-
|
|
143
|
-
// ---- Merged plugins ----
|
|
144
|
-
const mergedPlugins = plugins
|
|
145
|
-
? { ...DEFAULT_PLUGINS, ...plugins }
|
|
146
|
-
: DEFAULT_PLUGINS;
|
|
147
|
-
|
|
148
|
-
// ---- Initialise / re-create pdfme instance ----
|
|
149
|
-
useEffect(() => {
|
|
150
|
-
if (!containerRef.current) return;
|
|
151
|
-
|
|
152
|
-
// Destroy previous instance
|
|
153
|
-
if (instanceRef.current) {
|
|
154
|
-
instanceRef.current.destroy();
|
|
155
|
-
instanceRef.current = null;
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
const domContainer = containerRef.current;
|
|
159
|
-
|
|
160
|
-
const commonOpts: any = {
|
|
161
|
-
domContainer,
|
|
162
|
-
template,
|
|
163
|
-
plugins: mergedPlugins,
|
|
164
|
-
...(font ? { options: { font } } : {}),
|
|
165
|
-
};
|
|
166
|
-
|
|
167
|
-
try {
|
|
168
|
-
if (mode === 'designer') {
|
|
169
|
-
const designer = new Designer(commonOpts);
|
|
170
|
-
|
|
171
|
-
designer.onChangeTemplate((updated: Template) => {
|
|
172
|
-
templateRef.current = updated;
|
|
173
|
-
onTemplateChange?.(updated);
|
|
174
|
-
});
|
|
175
|
-
|
|
176
|
-
instanceRef.current = designer;
|
|
177
|
-
} else if (mode === 'form') {
|
|
178
|
-
const form = new Form({
|
|
179
|
-
...commonOpts,
|
|
180
|
-
inputs: resolvedInputs,
|
|
181
|
-
});
|
|
182
|
-
|
|
183
|
-
instanceRef.current = form;
|
|
184
|
-
} else {
|
|
185
|
-
// viewer
|
|
186
|
-
const viewer = new Viewer({
|
|
187
|
-
...commonOpts,
|
|
188
|
-
inputs: resolvedInputs,
|
|
189
|
-
});
|
|
190
|
-
|
|
191
|
-
instanceRef.current = viewer;
|
|
192
|
-
}
|
|
193
|
-
} catch (err) {
|
|
194
|
-
console.error('[ArchbasePdfBuilder] Failed to initialise pdfme:', err);
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
return () => {
|
|
198
|
-
if (instanceRef.current) {
|
|
199
|
-
instanceRef.current.destroy();
|
|
200
|
-
instanceRef.current = null;
|
|
201
|
-
}
|
|
202
|
-
};
|
|
203
|
-
// We intentionally re-create when mode or template identity changes.
|
|
204
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
205
|
-
}, [mode, template, font]);
|
|
206
|
-
|
|
207
|
-
// ---- Update inputs on form/viewer when they change ----
|
|
208
|
-
useEffect(() => {
|
|
209
|
-
const inst = instanceRef.current;
|
|
210
|
-
if (!inst) return;
|
|
211
|
-
if (mode === 'form' || mode === 'viewer') {
|
|
212
|
-
try {
|
|
213
|
-
(inst as Form | Viewer).setInputs(resolvedInputs);
|
|
214
|
-
} catch {
|
|
215
|
-
// instance may not be ready yet
|
|
216
|
-
}
|
|
217
|
-
}
|
|
218
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
219
|
-
}, [resolvedInputs, mode]);
|
|
220
|
-
|
|
221
|
-
// ---- Imperative handle ----
|
|
222
|
-
useImperativeHandle(
|
|
223
|
-
ref,
|
|
224
|
-
() => ({
|
|
225
|
-
async generatePdf(): Promise<Uint8Array> {
|
|
226
|
-
const currentTemplate = templateRef.current;
|
|
227
|
-
let currentInputs = resolvedInputs;
|
|
228
|
-
|
|
229
|
-
// In form mode we can grab the latest user-edited inputs
|
|
230
|
-
if (mode === 'form' && instanceRef.current) {
|
|
231
|
-
try {
|
|
232
|
-
currentInputs = (instanceRef.current as Form).getInputs();
|
|
233
|
-
} catch {
|
|
234
|
-
// fallback to prop inputs
|
|
235
|
-
}
|
|
236
|
-
}
|
|
237
|
-
|
|
238
|
-
const pdf = await generate({
|
|
239
|
-
template: currentTemplate,
|
|
240
|
-
inputs: currentInputs,
|
|
241
|
-
plugins: mergedPlugins,
|
|
242
|
-
...(font ? { options: { font } } : {}),
|
|
243
|
-
});
|
|
244
|
-
|
|
245
|
-
onGenerate?.(pdf);
|
|
246
|
-
return pdf;
|
|
247
|
-
},
|
|
248
|
-
|
|
249
|
-
getInstance() {
|
|
250
|
-
return instanceRef.current;
|
|
251
|
-
},
|
|
252
|
-
}),
|
|
253
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
254
|
-
[mode, font, resolvedInputs],
|
|
255
|
-
);
|
|
256
|
-
|
|
257
|
-
// ---- Render ----
|
|
258
|
-
const content = (
|
|
259
|
-
<Box
|
|
260
|
-
ref={containerRef}
|
|
261
|
-
style={{
|
|
262
|
-
width: typeof width === 'number' ? `${width}px` : width,
|
|
263
|
-
height: typeof height === 'number' ? `${height}px` : height,
|
|
264
|
-
...style,
|
|
265
|
-
}}
|
|
266
|
-
className={className}
|
|
267
|
-
/>
|
|
268
|
-
);
|
|
269
|
-
|
|
270
|
-
if (label || description) {
|
|
271
|
-
return (
|
|
272
|
-
<Input.Wrapper label={label} description={description}>
|
|
273
|
-
{content}
|
|
274
|
-
</Input.Wrapper>
|
|
275
|
-
);
|
|
276
|
-
}
|
|
277
|
-
|
|
278
|
-
return content;
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
// ---------------------------------------------------------------------------
|
|
282
|
-
// Forward-ref wrapper that preserves the generic parameter
|
|
283
|
-
// ---------------------------------------------------------------------------
|
|
284
|
-
|
|
285
|
-
export const ArchbasePdfBuilder = forwardRef(ArchbasePdfBuilderInner) as <
|
|
286
|
-
T = unknown,
|
|
287
|
-
>(
|
|
288
|
-
props: ArchbasePdfBuilderProps<T> & { ref?: React.Ref<ArchbasePdfBuilderRef> },
|
|
289
|
-
) => React.ReactElement | null;
|
|
290
|
-
|
|
291
|
-
(ArchbasePdfBuilder as any).displayName = 'ArchbasePdfBuilder';
|