web-to-print 0.1.0
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/LICENSE +21 -0
- package/dist/cjs/app-globals-V2Kpy_OQ.js +5 -0
- package/dist/cjs/canvas-helpers-A6rp5rPD.js +765 -0
- package/dist/cjs/index-IFGFRm-i.js +1649 -0
- package/dist/cjs/index.cjs.js +232 -0
- package/dist/cjs/loader.cjs.js +13 -0
- package/dist/cjs/logo-BUX-b45R.js +18 -0
- package/dist/cjs/web-to-print.cjs.js +25 -0
- package/dist/cjs/wtp-editor_2.cjs.entry.js +12386 -0
- package/dist/cjs/wtp-logo-renderer.cjs.entry.js +353 -0
- package/dist/cjs/wtp-print-area-editor.cjs.entry.js +431 -0
- package/dist/collection/collection-manifest.json +16 -0
- package/dist/collection/components/wtp-editor/wtp-editor.css +124 -0
- package/dist/collection/components/wtp-editor/wtp-editor.js +1114 -0
- package/dist/collection/components/wtp-logo-renderer/wtp-logo-renderer.css +30 -0
- package/dist/collection/components/wtp-logo-renderer/wtp-logo-renderer.js +455 -0
- package/dist/collection/components/wtp-logo-upload/wtp-logo-upload.css +428 -0
- package/dist/collection/components/wtp-logo-upload/wtp-logo-upload.js +573 -0
- package/dist/collection/components/wtp-print-area-editor/wtp-print-area-editor.css +20 -0
- package/dist/collection/components/wtp-print-area-editor/wtp-print-area-editor.js +600 -0
- package/dist/collection/examples/schaeffler--big.svg +1 -0
- package/dist/collection/index.js +8 -0
- package/dist/collection/types/editor.js +1 -0
- package/dist/collection/types/index.js +2 -0
- package/dist/collection/types/labels.js +30 -0
- package/dist/collection/types/logo.js +13 -0
- package/dist/collection/utils/background-removal.js +717 -0
- package/dist/collection/utils/canvas-helpers.js +380 -0
- package/dist/collection/utils/format-detection.js +48 -0
- package/dist/collection/utils/html-render-helpers.js +106 -0
- package/dist/collection/utils/image-preview.js +54 -0
- package/dist/collection/utils/logo-validation.js +141 -0
- package/dist/collection/utils/pdf-export.js +224 -0
- package/dist/components/index.d.ts +35 -0
- package/dist/components/index.js +1 -0
- package/dist/components/p-5qCsRzlt.js +1 -0
- package/dist/components/p-Bn9gR_8e.js +1 -0
- package/dist/components/p-D8pVJRuX.js +1 -0
- package/dist/components/wtp-editor.d.ts +11 -0
- package/dist/components/wtp-editor.js +1 -0
- package/dist/components/wtp-logo-renderer.d.ts +11 -0
- package/dist/components/wtp-logo-renderer.js +1 -0
- package/dist/components/wtp-logo-upload.d.ts +11 -0
- package/dist/components/wtp-logo-upload.js +1 -0
- package/dist/components/wtp-print-area-editor.d.ts +11 -0
- package/dist/components/wtp-print-area-editor.js +1 -0
- package/dist/esm/app-globals-DQuL1Twl.js +3 -0
- package/dist/esm/canvas-helpers-CK8OAq2J.js +748 -0
- package/dist/esm/index-CUetmLbL.js +1641 -0
- package/dist/esm/index.js +228 -0
- package/dist/esm/loader.js +11 -0
- package/dist/esm/logo-D8pVJRuX.js +15 -0
- package/dist/esm/web-to-print.js +21 -0
- package/dist/esm/wtp-editor_2.entry.js +12383 -0
- package/dist/esm/wtp-logo-renderer.entry.js +351 -0
- package/dist/esm/wtp-print-area-editor.entry.js +429 -0
- package/dist/index.cjs.js +1 -0
- package/dist/index.js +1 -0
- package/dist/types/components/wtp-editor/wtp-editor.d.ts +101 -0
- package/dist/types/components/wtp-logo-renderer/wtp-logo-renderer.d.ts +55 -0
- package/dist/types/components/wtp-logo-upload/wtp-logo-upload.d.ts +76 -0
- package/dist/types/components/wtp-print-area-editor/wtp-print-area-editor.d.ts +43 -0
- package/dist/types/components.d.ts +507 -0
- package/dist/types/index.d.ts +11 -0
- package/dist/types/stencil-public-runtime.d.ts +1860 -0
- package/dist/types/types/editor.d.ts +79 -0
- package/dist/types/types/index.d.ts +5 -0
- package/dist/types/types/labels.d.ts +30 -0
- package/dist/types/types/logo.d.ts +47 -0
- package/dist/types/utils/background-removal.d.ts +95 -0
- package/dist/types/utils/canvas-helpers.d.ts +60 -0
- package/dist/types/utils/format-detection.d.ts +4 -0
- package/dist/types/utils/html-render-helpers.d.ts +44 -0
- package/dist/types/utils/image-preview.d.ts +13 -0
- package/dist/types/utils/logo-validation.d.ts +2 -0
- package/dist/types/utils/pdf-export.d.ts +32 -0
- package/dist/web-to-print/index.esm.js +1 -0
- package/dist/web-to-print/p-611ec561.entry.js +1 -0
- package/dist/web-to-print/p-703e4c52.entry.js +1 -0
- package/dist/web-to-print/p-CK8OAq2J.js +1 -0
- package/dist/web-to-print/p-CUetmLbL.js +2 -0
- package/dist/web-to-print/p-D8pVJRuX.js +1 -0
- package/dist/web-to-print/p-DQuL1Twl.js +1 -0
- package/dist/web-to-print/p-b532777b.entry.js +1 -0
- package/dist/web-to-print/web-to-print.esm.js +1 -0
- package/loader/cdn.js +1 -0
- package/loader/index.cjs.js +1 -0
- package/loader/index.d.ts +24 -0
- package/loader/index.es2017.js +1 -0
- package/loader/index.js +2 -0
- package/package.json +68 -0
- package/readme.md +490 -0
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
+
import { PrintArea } from '../../types';
|
|
3
|
+
export declare class WtpPrintAreaEditor {
|
|
4
|
+
el: HTMLElement;
|
|
5
|
+
/** Product background image URL. */
|
|
6
|
+
productImage: string | undefined;
|
|
7
|
+
/** Canvas width in pixels. */
|
|
8
|
+
width: number;
|
|
9
|
+
/** Canvas height in pixels. */
|
|
10
|
+
height: number;
|
|
11
|
+
/** Current print area (relative 0-1 coordinates). */
|
|
12
|
+
printArea: PrintArea | undefined;
|
|
13
|
+
/** Fires when the print area rectangle is modified. */
|
|
14
|
+
wtpPrintAreaChange: EventEmitter<PrintArea>;
|
|
15
|
+
private canvas;
|
|
16
|
+
private canvasEl;
|
|
17
|
+
private areaQuad;
|
|
18
|
+
/** Generation counter to discard stale background loads. */
|
|
19
|
+
private bgLoadGen;
|
|
20
|
+
componentDidLoad(): void;
|
|
21
|
+
disconnectedCallback(): void;
|
|
22
|
+
onProductImageChange(): Promise<void>;
|
|
23
|
+
onSizeChange(): Promise<void>;
|
|
24
|
+
onPrintAreaChange(): void;
|
|
25
|
+
/** Get the current print area as relative 0-1 coordinates. */
|
|
26
|
+
getPrintArea(): Promise<PrintArea>;
|
|
27
|
+
/** Set the print area and update the quad on canvas. */
|
|
28
|
+
setPrintArea(printArea: PrintArea): Promise<void>;
|
|
29
|
+
/** Create the Fabric Canvas once and perform the initial load. */
|
|
30
|
+
private initCanvas;
|
|
31
|
+
/**
|
|
32
|
+
* Clear the canvas and reload background + quad.
|
|
33
|
+
* Keeps the Fabric Canvas instance alive (no dispose/recreate) to avoid
|
|
34
|
+
* stale DOM state from async dispose in Fabric v7.
|
|
35
|
+
*/
|
|
36
|
+
private reloadCanvas;
|
|
37
|
+
private createAreaQuad;
|
|
38
|
+
private syncQuadFromPrintArea;
|
|
39
|
+
private clampQuadToBounds;
|
|
40
|
+
private readQuadAsPrintArea;
|
|
41
|
+
private emitPrintArea;
|
|
42
|
+
render(): any;
|
|
43
|
+
}
|
|
@@ -0,0 +1,507 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
/* tslint:disable */
|
|
3
|
+
/**
|
|
4
|
+
* This is an autogenerated file created by the Stencil compiler.
|
|
5
|
+
* It contains typing information for all components that exist in this project.
|
|
6
|
+
*/
|
|
7
|
+
import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
|
|
8
|
+
import { BgRemovalConfig, EditorLabels, EditorState, LogoData, LogoUploadLabels, LogoValidationConfig, LogoValidationIssue, PlacedLogo, PrintArea } from "./types";
|
|
9
|
+
import { FabricObject, IText } from "fabric";
|
|
10
|
+
import { RenderLayer } from "./utils/html-render-helpers";
|
|
11
|
+
export { BgRemovalConfig, EditorLabels, EditorState, LogoData, LogoUploadLabels, LogoValidationConfig, LogoValidationIssue, PlacedLogo, PrintArea } from "./types";
|
|
12
|
+
export { FabricObject, IText } from "fabric";
|
|
13
|
+
export { RenderLayer } from "./utils/html-render-helpers";
|
|
14
|
+
export namespace Components {
|
|
15
|
+
interface WtpEditor {
|
|
16
|
+
/**
|
|
17
|
+
* Add a logo image to the canvas and return its object ID.
|
|
18
|
+
*/
|
|
19
|
+
"addLogo": (logoData: LogoData) => Promise<string>;
|
|
20
|
+
/**
|
|
21
|
+
* Add a text object to the canvas and return its object ID.
|
|
22
|
+
*/
|
|
23
|
+
"addText": (text: string, options?: { fontFamily?: string; fontSize?: number; fill?: string; }) => Promise<string>;
|
|
24
|
+
/**
|
|
25
|
+
* Show print area overlay and bounding box for debugging.
|
|
26
|
+
* @default false
|
|
27
|
+
*/
|
|
28
|
+
"debug": boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Export the canvas as a data URL image.
|
|
31
|
+
*/
|
|
32
|
+
"exportImage": (format?: "png" | "jpeg", quality?: number) => Promise<string>;
|
|
33
|
+
/**
|
|
34
|
+
* Export the canvas as a high-resolution data URL image (for PDF/print). Returns the data URL plus the actual canvas dimensions (which may differ from the width/height props after setCanvasBackground resizes the canvas).
|
|
35
|
+
*/
|
|
36
|
+
"exportImageHighRes": (format?: "png" | "jpeg", quality?: number, multiplier?: number) => Promise<{ dataUrl: string; width: number; height: number; }>;
|
|
37
|
+
/**
|
|
38
|
+
* Export the current editor state as a serializable object.
|
|
39
|
+
*/
|
|
40
|
+
"exportState": () => Promise<EditorState>;
|
|
41
|
+
/**
|
|
42
|
+
* Available font families for the text tool.
|
|
43
|
+
* @default ['Arial', 'Helvetica', 'Times New Roman', 'Georgia', 'Verdana']
|
|
44
|
+
*/
|
|
45
|
+
"fonts": string[];
|
|
46
|
+
/**
|
|
47
|
+
* Get a list of all objects on the canvas with their IDs and types.
|
|
48
|
+
*/
|
|
49
|
+
"getObjects": () => Promise<{ id: string; type: string; }[]>;
|
|
50
|
+
/**
|
|
51
|
+
* Canvas height in pixels.
|
|
52
|
+
* @default 600
|
|
53
|
+
*/
|
|
54
|
+
"height": number;
|
|
55
|
+
/**
|
|
56
|
+
* JSON-serialized initial editor state.
|
|
57
|
+
*/
|
|
58
|
+
"initialState": string | undefined;
|
|
59
|
+
/**
|
|
60
|
+
* Override any of the user-facing toolbar strings. Missing keys fall back to English defaults.
|
|
61
|
+
* @default {}
|
|
62
|
+
*/
|
|
63
|
+
"labels": Partial<EditorLabels>;
|
|
64
|
+
/**
|
|
65
|
+
* Load a previously exported editor state.
|
|
66
|
+
*/
|
|
67
|
+
"loadState": (state: EditorState) => Promise<void>;
|
|
68
|
+
/**
|
|
69
|
+
* Print area definition (0-1 relative coordinates) to constrain objects.
|
|
70
|
+
*/
|
|
71
|
+
"printArea": PrintArea | undefined;
|
|
72
|
+
/**
|
|
73
|
+
* Product background image URL.
|
|
74
|
+
*/
|
|
75
|
+
"productImage": string | undefined;
|
|
76
|
+
/**
|
|
77
|
+
* Remove an object from the canvas by its ID.
|
|
78
|
+
*/
|
|
79
|
+
"removeObject": (id: string) => Promise<void>;
|
|
80
|
+
/**
|
|
81
|
+
* Clear all user objects from the canvas, keeping the instance alive.
|
|
82
|
+
*/
|
|
83
|
+
"resetCanvas": () => Promise<void>;
|
|
84
|
+
/**
|
|
85
|
+
* Update the text content of a text object by its ID.
|
|
86
|
+
*/
|
|
87
|
+
"updateText": (id: string, text: string) => Promise<void>;
|
|
88
|
+
/**
|
|
89
|
+
* Canvas width in pixels.
|
|
90
|
+
* @default 800
|
|
91
|
+
*/
|
|
92
|
+
"width": number;
|
|
93
|
+
}
|
|
94
|
+
interface WtpLogoRenderer {
|
|
95
|
+
/**
|
|
96
|
+
* Background color.
|
|
97
|
+
* @default '#ffffff'
|
|
98
|
+
*/
|
|
99
|
+
"backgroundColor": string;
|
|
100
|
+
/**
|
|
101
|
+
* Export the rendered scene as a data URL image.
|
|
102
|
+
*/
|
|
103
|
+
"exportImage": (format?: "png" | "jpeg", quality?: number) => Promise<string>;
|
|
104
|
+
/**
|
|
105
|
+
* Container height in pixels.
|
|
106
|
+
* @default 400
|
|
107
|
+
*/
|
|
108
|
+
"height": number;
|
|
109
|
+
/**
|
|
110
|
+
* Array of logos to place on the renderer.
|
|
111
|
+
* @default []
|
|
112
|
+
*/
|
|
113
|
+
"logos": PlacedLogo[];
|
|
114
|
+
/**
|
|
115
|
+
* Print area definition for auto-fitting logos (relative 0-1 coordinates).
|
|
116
|
+
*/
|
|
117
|
+
"printArea": PrintArea | undefined;
|
|
118
|
+
/**
|
|
119
|
+
* Product background image URL.
|
|
120
|
+
*/
|
|
121
|
+
"productImage": string | undefined;
|
|
122
|
+
/**
|
|
123
|
+
* Container width in pixels.
|
|
124
|
+
* @default 600
|
|
125
|
+
*/
|
|
126
|
+
"width": number;
|
|
127
|
+
}
|
|
128
|
+
interface WtpLogoUpload {
|
|
129
|
+
/**
|
|
130
|
+
* Accepted file MIME types for the file input.
|
|
131
|
+
* @default 'image/png,image/jpeg,image/svg+xml,image/tiff,image/avif'
|
|
132
|
+
*/
|
|
133
|
+
"accept": string;
|
|
134
|
+
/**
|
|
135
|
+
* Configuration for the color-based background removal algorithm.
|
|
136
|
+
* @default {}
|
|
137
|
+
*/
|
|
138
|
+
"bgRemovalConfig": Partial<BgRemovalConfig>;
|
|
139
|
+
/**
|
|
140
|
+
* Validation rules for uploaded logos.
|
|
141
|
+
* @default DEFAULT_VALIDATION_CONFIG
|
|
142
|
+
*/
|
|
143
|
+
"config": LogoValidationConfig;
|
|
144
|
+
/**
|
|
145
|
+
* Disables the upload component.
|
|
146
|
+
* @default false
|
|
147
|
+
*/
|
|
148
|
+
"disabled": boolean;
|
|
149
|
+
/**
|
|
150
|
+
* Enables background removal for raster images after upload.
|
|
151
|
+
* @default false
|
|
152
|
+
*/
|
|
153
|
+
"enableBackgroundRemoval": boolean;
|
|
154
|
+
/**
|
|
155
|
+
* Override any of the user-facing strings. Missing keys fall back to English defaults.
|
|
156
|
+
* @default {}
|
|
157
|
+
*/
|
|
158
|
+
"labels": Partial<LogoUploadLabels>;
|
|
159
|
+
/**
|
|
160
|
+
* Whether multiple files can be uploaded at once.
|
|
161
|
+
* @default false
|
|
162
|
+
*/
|
|
163
|
+
"multiple": boolean;
|
|
164
|
+
}
|
|
165
|
+
interface WtpPrintAreaEditor {
|
|
166
|
+
/**
|
|
167
|
+
* Get the current print area as relative 0-1 coordinates.
|
|
168
|
+
*/
|
|
169
|
+
"getPrintArea": () => Promise<PrintArea>;
|
|
170
|
+
/**
|
|
171
|
+
* Canvas height in pixels.
|
|
172
|
+
* @default 600
|
|
173
|
+
*/
|
|
174
|
+
"height": number;
|
|
175
|
+
/**
|
|
176
|
+
* Current print area (relative 0-1 coordinates).
|
|
177
|
+
*/
|
|
178
|
+
"printArea": PrintArea | undefined;
|
|
179
|
+
/**
|
|
180
|
+
* Product background image URL.
|
|
181
|
+
*/
|
|
182
|
+
"productImage": string | undefined;
|
|
183
|
+
/**
|
|
184
|
+
* Set the print area and update the quad on canvas.
|
|
185
|
+
*/
|
|
186
|
+
"setPrintArea": (printArea: PrintArea) => Promise<void>;
|
|
187
|
+
/**
|
|
188
|
+
* Canvas width in pixels.
|
|
189
|
+
* @default 800
|
|
190
|
+
*/
|
|
191
|
+
"width": number;
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
export interface WtpEditorCustomEvent<T> extends CustomEvent<T> {
|
|
195
|
+
detail: T;
|
|
196
|
+
target: HTMLWtpEditorElement;
|
|
197
|
+
}
|
|
198
|
+
export interface WtpLogoRendererCustomEvent<T> extends CustomEvent<T> {
|
|
199
|
+
detail: T;
|
|
200
|
+
target: HTMLWtpLogoRendererElement;
|
|
201
|
+
}
|
|
202
|
+
export interface WtpLogoUploadCustomEvent<T> extends CustomEvent<T> {
|
|
203
|
+
detail: T;
|
|
204
|
+
target: HTMLWtpLogoUploadElement;
|
|
205
|
+
}
|
|
206
|
+
export interface WtpPrintAreaEditorCustomEvent<T> extends CustomEvent<T> {
|
|
207
|
+
detail: T;
|
|
208
|
+
target: HTMLWtpPrintAreaEditorElement;
|
|
209
|
+
}
|
|
210
|
+
declare global {
|
|
211
|
+
interface HTMLWtpEditorElementEventMap {
|
|
212
|
+
"wtpEditorReady": void;
|
|
213
|
+
"wtpEditorStateChanged": EditorState;
|
|
214
|
+
"wtpEditorObjectSelected": { id: string; type: string };
|
|
215
|
+
"wtpEditorObjectDeselected": void;
|
|
216
|
+
}
|
|
217
|
+
interface HTMLWtpEditorElement extends Components.WtpEditor, HTMLStencilElement {
|
|
218
|
+
addEventListener<K extends keyof HTMLWtpEditorElementEventMap>(type: K, listener: (this: HTMLWtpEditorElement, ev: WtpEditorCustomEvent<HTMLWtpEditorElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
219
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
220
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
221
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
222
|
+
removeEventListener<K extends keyof HTMLWtpEditorElementEventMap>(type: K, listener: (this: HTMLWtpEditorElement, ev: WtpEditorCustomEvent<HTMLWtpEditorElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
223
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
224
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
225
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
226
|
+
}
|
|
227
|
+
var HTMLWtpEditorElement: {
|
|
228
|
+
prototype: HTMLWtpEditorElement;
|
|
229
|
+
new (): HTMLWtpEditorElement;
|
|
230
|
+
};
|
|
231
|
+
interface HTMLWtpLogoRendererElementEventMap {
|
|
232
|
+
"wtpRenderComplete": { dataUrl: string };
|
|
233
|
+
"wtpRenderError": { message: string };
|
|
234
|
+
}
|
|
235
|
+
interface HTMLWtpLogoRendererElement extends Components.WtpLogoRenderer, HTMLStencilElement {
|
|
236
|
+
addEventListener<K extends keyof HTMLWtpLogoRendererElementEventMap>(type: K, listener: (this: HTMLWtpLogoRendererElement, ev: WtpLogoRendererCustomEvent<HTMLWtpLogoRendererElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
237
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
238
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
239
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
240
|
+
removeEventListener<K extends keyof HTMLWtpLogoRendererElementEventMap>(type: K, listener: (this: HTMLWtpLogoRendererElement, ev: WtpLogoRendererCustomEvent<HTMLWtpLogoRendererElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
241
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
242
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
243
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
244
|
+
}
|
|
245
|
+
var HTMLWtpLogoRendererElement: {
|
|
246
|
+
prototype: HTMLWtpLogoRendererElement;
|
|
247
|
+
new (): HTMLWtpLogoRendererElement;
|
|
248
|
+
};
|
|
249
|
+
interface HTMLWtpLogoUploadElementEventMap {
|
|
250
|
+
"wtpLogoValidated": LogoData;
|
|
251
|
+
"wtpLogoRejected": { file: File; issues: LogoValidationIssue[] };
|
|
252
|
+
"wtpLogoProcessing": boolean;
|
|
253
|
+
"wtpLogoSelected": LogoData;
|
|
254
|
+
}
|
|
255
|
+
interface HTMLWtpLogoUploadElement extends Components.WtpLogoUpload, HTMLStencilElement {
|
|
256
|
+
addEventListener<K extends keyof HTMLWtpLogoUploadElementEventMap>(type: K, listener: (this: HTMLWtpLogoUploadElement, ev: WtpLogoUploadCustomEvent<HTMLWtpLogoUploadElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
257
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
258
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
259
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
260
|
+
removeEventListener<K extends keyof HTMLWtpLogoUploadElementEventMap>(type: K, listener: (this: HTMLWtpLogoUploadElement, ev: WtpLogoUploadCustomEvent<HTMLWtpLogoUploadElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
261
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
262
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
263
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
264
|
+
}
|
|
265
|
+
var HTMLWtpLogoUploadElement: {
|
|
266
|
+
prototype: HTMLWtpLogoUploadElement;
|
|
267
|
+
new (): HTMLWtpLogoUploadElement;
|
|
268
|
+
};
|
|
269
|
+
interface HTMLWtpPrintAreaEditorElementEventMap {
|
|
270
|
+
"wtpPrintAreaChange": PrintArea;
|
|
271
|
+
}
|
|
272
|
+
interface HTMLWtpPrintAreaEditorElement extends Components.WtpPrintAreaEditor, HTMLStencilElement {
|
|
273
|
+
addEventListener<K extends keyof HTMLWtpPrintAreaEditorElementEventMap>(type: K, listener: (this: HTMLWtpPrintAreaEditorElement, ev: WtpPrintAreaEditorCustomEvent<HTMLWtpPrintAreaEditorElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
274
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
275
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
276
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
277
|
+
removeEventListener<K extends keyof HTMLWtpPrintAreaEditorElementEventMap>(type: K, listener: (this: HTMLWtpPrintAreaEditorElement, ev: WtpPrintAreaEditorCustomEvent<HTMLWtpPrintAreaEditorElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
278
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
279
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
280
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
281
|
+
}
|
|
282
|
+
var HTMLWtpPrintAreaEditorElement: {
|
|
283
|
+
prototype: HTMLWtpPrintAreaEditorElement;
|
|
284
|
+
new (): HTMLWtpPrintAreaEditorElement;
|
|
285
|
+
};
|
|
286
|
+
interface HTMLElementTagNameMap {
|
|
287
|
+
"wtp-editor": HTMLWtpEditorElement;
|
|
288
|
+
"wtp-logo-renderer": HTMLWtpLogoRendererElement;
|
|
289
|
+
"wtp-logo-upload": HTMLWtpLogoUploadElement;
|
|
290
|
+
"wtp-print-area-editor": HTMLWtpPrintAreaEditorElement;
|
|
291
|
+
}
|
|
292
|
+
}
|
|
293
|
+
declare namespace LocalJSX {
|
|
294
|
+
interface WtpEditor {
|
|
295
|
+
/**
|
|
296
|
+
* Show print area overlay and bounding box for debugging.
|
|
297
|
+
* @default false
|
|
298
|
+
*/
|
|
299
|
+
"debug"?: boolean;
|
|
300
|
+
/**
|
|
301
|
+
* Available font families for the text tool.
|
|
302
|
+
* @default ['Arial', 'Helvetica', 'Times New Roman', 'Georgia', 'Verdana']
|
|
303
|
+
*/
|
|
304
|
+
"fonts"?: string[];
|
|
305
|
+
/**
|
|
306
|
+
* Canvas height in pixels.
|
|
307
|
+
* @default 600
|
|
308
|
+
*/
|
|
309
|
+
"height"?: number;
|
|
310
|
+
/**
|
|
311
|
+
* JSON-serialized initial editor state.
|
|
312
|
+
*/
|
|
313
|
+
"initialState"?: string | undefined;
|
|
314
|
+
/**
|
|
315
|
+
* Override any of the user-facing toolbar strings. Missing keys fall back to English defaults.
|
|
316
|
+
* @default {}
|
|
317
|
+
*/
|
|
318
|
+
"labels"?: Partial<EditorLabels>;
|
|
319
|
+
/**
|
|
320
|
+
* Fires when the current selection is cleared.
|
|
321
|
+
*/
|
|
322
|
+
"onWtpEditorObjectDeselected"?: (event: WtpEditorCustomEvent<void>) => void;
|
|
323
|
+
/**
|
|
324
|
+
* Fires when an object is selected on the canvas.
|
|
325
|
+
*/
|
|
326
|
+
"onWtpEditorObjectSelected"?: (event: WtpEditorCustomEvent<{ id: string; type: string }>) => void;
|
|
327
|
+
/**
|
|
328
|
+
* Fires when the canvas is initialized and ready.
|
|
329
|
+
*/
|
|
330
|
+
"onWtpEditorReady"?: (event: WtpEditorCustomEvent<void>) => void;
|
|
331
|
+
/**
|
|
332
|
+
* Fires when the editor state changes (object add/move/remove).
|
|
333
|
+
*/
|
|
334
|
+
"onWtpEditorStateChanged"?: (event: WtpEditorCustomEvent<EditorState>) => void;
|
|
335
|
+
/**
|
|
336
|
+
* Print area definition (0-1 relative coordinates) to constrain objects.
|
|
337
|
+
*/
|
|
338
|
+
"printArea"?: PrintArea | undefined;
|
|
339
|
+
/**
|
|
340
|
+
* Product background image URL.
|
|
341
|
+
*/
|
|
342
|
+
"productImage"?: string | undefined;
|
|
343
|
+
/**
|
|
344
|
+
* Canvas width in pixels.
|
|
345
|
+
* @default 800
|
|
346
|
+
*/
|
|
347
|
+
"width"?: number;
|
|
348
|
+
}
|
|
349
|
+
interface WtpLogoRenderer {
|
|
350
|
+
/**
|
|
351
|
+
* Background color.
|
|
352
|
+
* @default '#ffffff'
|
|
353
|
+
*/
|
|
354
|
+
"backgroundColor"?: string;
|
|
355
|
+
/**
|
|
356
|
+
* Container height in pixels.
|
|
357
|
+
* @default 400
|
|
358
|
+
*/
|
|
359
|
+
"height"?: number;
|
|
360
|
+
/**
|
|
361
|
+
* Array of logos to place on the renderer.
|
|
362
|
+
* @default []
|
|
363
|
+
*/
|
|
364
|
+
"logos"?: PlacedLogo[];
|
|
365
|
+
/**
|
|
366
|
+
* Fires when the renderer has finished rendering all logos.
|
|
367
|
+
*/
|
|
368
|
+
"onWtpRenderComplete"?: (event: WtpLogoRendererCustomEvent<{ dataUrl: string }>) => void;
|
|
369
|
+
/**
|
|
370
|
+
* Fires when a rendering error occurs.
|
|
371
|
+
*/
|
|
372
|
+
"onWtpRenderError"?: (event: WtpLogoRendererCustomEvent<{ message: string }>) => void;
|
|
373
|
+
/**
|
|
374
|
+
* Print area definition for auto-fitting logos (relative 0-1 coordinates).
|
|
375
|
+
*/
|
|
376
|
+
"printArea"?: PrintArea | undefined;
|
|
377
|
+
/**
|
|
378
|
+
* Product background image URL.
|
|
379
|
+
*/
|
|
380
|
+
"productImage"?: string | undefined;
|
|
381
|
+
/**
|
|
382
|
+
* Container width in pixels.
|
|
383
|
+
* @default 600
|
|
384
|
+
*/
|
|
385
|
+
"width"?: number;
|
|
386
|
+
}
|
|
387
|
+
interface WtpLogoUpload {
|
|
388
|
+
/**
|
|
389
|
+
* Accepted file MIME types for the file input.
|
|
390
|
+
* @default 'image/png,image/jpeg,image/svg+xml,image/tiff,image/avif'
|
|
391
|
+
*/
|
|
392
|
+
"accept"?: string;
|
|
393
|
+
/**
|
|
394
|
+
* Configuration for the color-based background removal algorithm.
|
|
395
|
+
* @default {}
|
|
396
|
+
*/
|
|
397
|
+
"bgRemovalConfig"?: Partial<BgRemovalConfig>;
|
|
398
|
+
/**
|
|
399
|
+
* Validation rules for uploaded logos.
|
|
400
|
+
* @default DEFAULT_VALIDATION_CONFIG
|
|
401
|
+
*/
|
|
402
|
+
"config"?: LogoValidationConfig;
|
|
403
|
+
/**
|
|
404
|
+
* Disables the upload component.
|
|
405
|
+
* @default false
|
|
406
|
+
*/
|
|
407
|
+
"disabled"?: boolean;
|
|
408
|
+
/**
|
|
409
|
+
* Enables background removal for raster images after upload.
|
|
410
|
+
* @default false
|
|
411
|
+
*/
|
|
412
|
+
"enableBackgroundRemoval"?: boolean;
|
|
413
|
+
/**
|
|
414
|
+
* Override any of the user-facing strings. Missing keys fall back to English defaults.
|
|
415
|
+
* @default {}
|
|
416
|
+
*/
|
|
417
|
+
"labels"?: Partial<LogoUploadLabels>;
|
|
418
|
+
/**
|
|
419
|
+
* Whether multiple files can be uploaded at once.
|
|
420
|
+
* @default false
|
|
421
|
+
*/
|
|
422
|
+
"multiple"?: boolean;
|
|
423
|
+
/**
|
|
424
|
+
* Fires when processing state changes (true = busy, false = idle).
|
|
425
|
+
*/
|
|
426
|
+
"onWtpLogoProcessing"?: (event: WtpLogoUploadCustomEvent<boolean>) => void;
|
|
427
|
+
/**
|
|
428
|
+
* Fires when a logo fails validation.
|
|
429
|
+
*/
|
|
430
|
+
"onWtpLogoRejected"?: (event: WtpLogoUploadCustomEvent<{ file: File; issues: LogoValidationIssue[] }>) => void;
|
|
431
|
+
/**
|
|
432
|
+
* Fires when a logo is selected from the preview gallery.
|
|
433
|
+
*/
|
|
434
|
+
"onWtpLogoSelected"?: (event: WtpLogoUploadCustomEvent<LogoData>) => void;
|
|
435
|
+
/**
|
|
436
|
+
* Fires when a logo passes validation and is ready for use.
|
|
437
|
+
*/
|
|
438
|
+
"onWtpLogoValidated"?: (event: WtpLogoUploadCustomEvent<LogoData>) => void;
|
|
439
|
+
}
|
|
440
|
+
interface WtpPrintAreaEditor {
|
|
441
|
+
/**
|
|
442
|
+
* Canvas height in pixels.
|
|
443
|
+
* @default 600
|
|
444
|
+
*/
|
|
445
|
+
"height"?: number;
|
|
446
|
+
/**
|
|
447
|
+
* Fires when the print area rectangle is modified.
|
|
448
|
+
*/
|
|
449
|
+
"onWtpPrintAreaChange"?: (event: WtpPrintAreaEditorCustomEvent<PrintArea>) => void;
|
|
450
|
+
/**
|
|
451
|
+
* Current print area (relative 0-1 coordinates).
|
|
452
|
+
*/
|
|
453
|
+
"printArea"?: PrintArea | undefined;
|
|
454
|
+
/**
|
|
455
|
+
* Product background image URL.
|
|
456
|
+
*/
|
|
457
|
+
"productImage"?: string | undefined;
|
|
458
|
+
/**
|
|
459
|
+
* Canvas width in pixels.
|
|
460
|
+
* @default 800
|
|
461
|
+
*/
|
|
462
|
+
"width"?: number;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
interface WtpEditorAttributes {
|
|
466
|
+
"width": number;
|
|
467
|
+
"height": number;
|
|
468
|
+
"productImage": string | undefined;
|
|
469
|
+
"initialState": string | undefined;
|
|
470
|
+
"debug": boolean;
|
|
471
|
+
}
|
|
472
|
+
interface WtpLogoRendererAttributes {
|
|
473
|
+
"productImage": string | undefined;
|
|
474
|
+
"width": number;
|
|
475
|
+
"height": number;
|
|
476
|
+
"backgroundColor": string;
|
|
477
|
+
}
|
|
478
|
+
interface WtpLogoUploadAttributes {
|
|
479
|
+
"accept": string;
|
|
480
|
+
"multiple": boolean;
|
|
481
|
+
"disabled": boolean;
|
|
482
|
+
"enableBackgroundRemoval": boolean;
|
|
483
|
+
}
|
|
484
|
+
interface WtpPrintAreaEditorAttributes {
|
|
485
|
+
"productImage": string | undefined;
|
|
486
|
+
"width": number;
|
|
487
|
+
"height": number;
|
|
488
|
+
}
|
|
489
|
+
|
|
490
|
+
interface IntrinsicElements {
|
|
491
|
+
"wtp-editor": Omit<WtpEditor, keyof WtpEditorAttributes> & { [K in keyof WtpEditor & keyof WtpEditorAttributes]?: WtpEditor[K] } & { [K in keyof WtpEditor & keyof WtpEditorAttributes as `attr:${K}`]?: WtpEditorAttributes[K] } & { [K in keyof WtpEditor & keyof WtpEditorAttributes as `prop:${K}`]?: WtpEditor[K] };
|
|
492
|
+
"wtp-logo-renderer": Omit<WtpLogoRenderer, keyof WtpLogoRendererAttributes> & { [K in keyof WtpLogoRenderer & keyof WtpLogoRendererAttributes]?: WtpLogoRenderer[K] } & { [K in keyof WtpLogoRenderer & keyof WtpLogoRendererAttributes as `attr:${K}`]?: WtpLogoRendererAttributes[K] } & { [K in keyof WtpLogoRenderer & keyof WtpLogoRendererAttributes as `prop:${K}`]?: WtpLogoRenderer[K] };
|
|
493
|
+
"wtp-logo-upload": Omit<WtpLogoUpload, keyof WtpLogoUploadAttributes> & { [K in keyof WtpLogoUpload & keyof WtpLogoUploadAttributes]?: WtpLogoUpload[K] } & { [K in keyof WtpLogoUpload & keyof WtpLogoUploadAttributes as `attr:${K}`]?: WtpLogoUploadAttributes[K] } & { [K in keyof WtpLogoUpload & keyof WtpLogoUploadAttributes as `prop:${K}`]?: WtpLogoUpload[K] };
|
|
494
|
+
"wtp-print-area-editor": Omit<WtpPrintAreaEditor, keyof WtpPrintAreaEditorAttributes> & { [K in keyof WtpPrintAreaEditor & keyof WtpPrintAreaEditorAttributes]?: WtpPrintAreaEditor[K] } & { [K in keyof WtpPrintAreaEditor & keyof WtpPrintAreaEditorAttributes as `attr:${K}`]?: WtpPrintAreaEditorAttributes[K] } & { [K in keyof WtpPrintAreaEditor & keyof WtpPrintAreaEditorAttributes as `prop:${K}`]?: WtpPrintAreaEditor[K] };
|
|
495
|
+
}
|
|
496
|
+
}
|
|
497
|
+
export { LocalJSX as JSX };
|
|
498
|
+
declare module "@stencil/core" {
|
|
499
|
+
export namespace JSX {
|
|
500
|
+
interface IntrinsicElements {
|
|
501
|
+
"wtp-editor": LocalJSX.IntrinsicElements["wtp-editor"] & JSXBase.HTMLAttributes<HTMLWtpEditorElement>;
|
|
502
|
+
"wtp-logo-renderer": LocalJSX.IntrinsicElements["wtp-logo-renderer"] & JSXBase.HTMLAttributes<HTMLWtpLogoRendererElement>;
|
|
503
|
+
"wtp-logo-upload": LocalJSX.IntrinsicElements["wtp-logo-upload"] & JSXBase.HTMLAttributes<HTMLWtpLogoUploadElement>;
|
|
504
|
+
"wtp-print-area-editor": LocalJSX.IntrinsicElements["wtp-print-area-editor"] & JSXBase.HTMLAttributes<HTMLWtpPrintAreaEditorElement>;
|
|
505
|
+
}
|
|
506
|
+
}
|
|
507
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @fileoverview Entry point for the web-to-print component library.
|
|
3
|
+
*
|
|
4
|
+
* Use this file to export utilities, types, and constants.
|
|
5
|
+
* Components are consumed via the approaches outlined in the README.
|
|
6
|
+
*/
|
|
7
|
+
export type { LogoFormat, LogoMetadata, LogoValidationIssue, LogoValidationConfig, LogoValidationResult, LogoData, BgRemovalConfig, CanvasTransform, PlacedLogo, PlacedText, EditorState, PrintArea, RelativePoint, LegacyPrintArea, ArticleView, Article, } from './types';
|
|
8
|
+
export { DEFAULT_VALIDATION_CONFIG, DEFAULT_BG_REMOVAL_CONFIG } from './types';
|
|
9
|
+
export type { PdfExportConfig } from './utils/pdf-export';
|
|
10
|
+
export { exportProductPdf } from './utils/pdf-export';
|
|
11
|
+
export type * from './components.d.ts';
|