@umituz/web-canvas 1.0.5 → 1.0.7

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@umituz/web-canvas",
3
- "version": "1.0.5",
3
+ "version": "1.0.7",
4
4
  "description": "Comprehensive canvas and screenshot generation library with device frames, patterns, and PDF export",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
@@ -1,310 +0,0 @@
1
- /**
2
- * Canvas Types
3
- * Core canvas operation types
4
- */
5
- /**
6
- * Canvas format options
7
- */
8
- type CanvasFormat = 'png' | 'jpeg' | 'webp';
9
- /**
10
- * Canvas render quality
11
- */
12
- type CanvasQuality = number;
13
- /**
14
- * Canvas dimensions
15
- */
16
- interface CanvasDimensions {
17
- width: number;
18
- height: number;
19
- }
20
- /**
21
- * Canvas position
22
- */
23
- interface CanvasPosition {
24
- x: number;
25
- y: number;
26
- }
27
- /**
28
- * Canvas rectangle
29
- */
30
- interface CanvasRect extends CanvasPosition, CanvasDimensions {
31
- }
32
- /**
33
- * Canvas color
34
- */
35
- type CanvasColor = string;
36
- /**
37
- * Canvas context configuration
38
- */
39
- interface CanvasContextConfig {
40
- fillStyle?: CanvasColor;
41
- strokeStyle?: CanvasColor;
42
- lineWidth?: number;
43
- lineCap?: 'butt' | 'round' | 'square';
44
- lineJoin?: 'round' | 'bevel' | 'miter';
45
- globalAlpha?: number;
46
- font?: string;
47
- textAlign?: CanvasTextAlign;
48
- textBaseline?: CanvasTextBaseline;
49
- }
50
- /**
51
- * Canvas export options
52
- */
53
- interface CanvasExportOptions {
54
- format?: CanvasFormat;
55
- quality?: CanvasQuality;
56
- scale?: number;
57
- backgroundColor?: string;
58
- useCORS?: boolean;
59
- }
60
- /**
61
- * Canvas result
62
- */
63
- interface CanvasResult {
64
- blob: Blob;
65
- url: string;
66
- dimensions: CanvasDimensions;
67
- format: CanvasFormat;
68
- size: number;
69
- }
70
- /**
71
- * Canvas operation callback
72
- */
73
- type CanvasOperation<T> = (ctx: CanvasRenderingContext2D, dimensions: CanvasDimensions) => T;
74
-
75
- /**
76
- * Screenshot Types
77
- * Screenshot generation and device frame types
78
- */
79
- /**
80
- * Device type
81
- */
82
- type DeviceType = 'iphone-15-pro' | 'iphone-15' | 'iphone-se' | 'ipad-pro' | 'ipad' | 'android-phone' | 'android-tablet' | 'desktop';
83
- /**
84
- * Device type enum (for backward compatibility)
85
- */
86
- declare const DeviceTypeEnum: {
87
- readonly IPHONE_15_PRO: "iphone-15-pro";
88
- readonly IPHONE_15: "iphone-15";
89
- readonly IPHONE_SE: "iphone-se";
90
- readonly IPAD_PRO: "ipad-pro";
91
- readonly IPAD: "ipad";
92
- readonly ANDROID_PHONE: "android-phone";
93
- readonly ANDROID_TABLET: "android-tablet";
94
- readonly DESKTOP: "desktop";
95
- };
96
- /**
97
- * Frame style options
98
- */
99
- type FrameStyle = 'realistic' | 'minimal' | 'none';
100
- /**
101
- * Frame style enum (for backward compatibility)
102
- */
103
- declare const FrameStyleEnum: {
104
- readonly REALISTIC: "realistic";
105
- readonly MINIMAL: "minimal";
106
- readonly NONE: "none";
107
- };
108
- /**
109
- * Layout style options
110
- */
111
- type LayoutStyle = 'text-top' | 'text-bottom' | 'text-overlay';
112
- /**
113
- * Layout style enum (for backward compatibility)
114
- */
115
- declare const LayoutStyleEnum: {
116
- readonly TEXT_TOP: "text-top";
117
- readonly TEXT_BOTTOM: "text-bottom";
118
- readonly TEXT_OVERLAY: "text-overlay";
119
- };
120
- /**
121
- * Background pattern options
122
- */
123
- type BackgroundPattern = 'none' | 'dots' | 'grid' | 'lines' | 'waves' | 'checkers';
124
- /**
125
- * Background pattern enum (for backward compatibility)
126
- */
127
- declare const BackgroundPatternEnum: {
128
- readonly NONE: "none";
129
- readonly DOTS: "dots";
130
- readonly GRID: "grid";
131
- readonly LINES: "lines";
132
- readonly WAVES: "waves";
133
- readonly CHECKERS: "checkers";
134
- };
135
- /**
136
- * Screenshot format
137
- */
138
- type ScreenshotFormat = 'png' | 'jpeg' | 'webp';
139
- /**
140
- * Screenshot format enum (for backward compatibility)
141
- */
142
- declare const ScreenshotFormatEnum: {
143
- readonly PNG: "png";
144
- readonly JPEG: "jpeg";
145
- readonly WEBP: "webp";
146
- };
147
- /**
148
- * Language code
149
- */
150
- type Language = string;
151
- /**
152
- * Device dimensions
153
- */
154
- interface DeviceDimensions {
155
- width: number;
156
- height: number;
157
- scale?: number;
158
- }
159
- /**
160
- * Device configuration
161
- */
162
- interface DeviceConfig {
163
- type: DeviceType;
164
- name: string;
165
- dimensions: DeviceDimensions;
166
- isPhone?: boolean;
167
- isTablet?: boolean;
168
- hasNotch?: boolean;
169
- cornerRadius?: number;
170
- frameThickness?: number;
171
- }
172
- /**
173
- * Screenshot content
174
- */
175
- interface ScreenshotContent {
176
- id: string;
177
- title: string;
178
- subtitle: string;
179
- screenshot: string | null;
180
- translations: Record<Language, {
181
- title: string;
182
- subtitle: string;
183
- }>;
184
- imageFit?: 'cover' | 'contain' | 'fill';
185
- imageZoom?: number;
186
- imageAnchorX?: number;
187
- imageAnchorY?: number;
188
- }
189
- /**
190
- * Screenshot design
191
- */
192
- interface ScreenshotDesign {
193
- backgroundColor: string;
194
- backgroundGradientEnd?: string | null;
195
- backgroundImage?: string | null;
196
- backgroundBlur?: number;
197
- backgroundOverlayOpacity?: number;
198
- backgroundPattern?: BackgroundPattern;
199
- textColor: string;
200
- highlightColor: string;
201
- textAlign: 'left' | 'center' | 'right';
202
- deviceColor: string;
203
- deviceType: DeviceType;
204
- frameStyle: FrameStyle;
205
- layout: LayoutStyle;
206
- scale: number;
207
- fontFamily: string;
208
- titleFontSize: number;
209
- subtitleFontSize: number;
210
- titleFontWeight: string;
211
- subtitleFontWeight: string;
212
- textCase?: 'uppercase' | 'lowercase' | 'none';
213
- lineHeight?: number;
214
- letterSpacing?: number;
215
- rotation?: number;
216
- rotationX?: number;
217
- rotationY?: number;
218
- rotationZ?: number;
219
- offsetY?: number;
220
- shadowIntensity?: number;
221
- padding?: number;
222
- gap?: number;
223
- isPanoramic?: boolean;
224
- }
225
- /**
226
- * Screenshot metadata
227
- */
228
- interface ScreenshotMetadata {
229
- id: string;
230
- deviceType: DeviceType;
231
- dimensions: DeviceDimensions;
232
- format: ScreenshotFormat;
233
- timestamp: Date;
234
- fileSize: number;
235
- url: string;
236
- }
237
- /**
238
- * Screenshot generation options
239
- */
240
- interface ScreenshotGenerationOptions {
241
- deviceType: DeviceType;
242
- format?: ScreenshotFormat;
243
- quality?: number;
244
- customDimensions?: DeviceDimensions;
245
- }
246
- /**
247
- * Screenshot template
248
- */
249
- interface ScreenshotTemplate {
250
- id: string;
251
- name: string;
252
- description: string;
253
- design: Partial<ScreenshotDesign>;
254
- thumbnail?: string;
255
- }
256
- /**
257
- * App Store metadata
258
- */
259
- interface AppStoreMetadata {
260
- appName: string;
261
- subtitle: string;
262
- promotionalText: string;
263
- keywords: string;
264
- description: string;
265
- whatsNew: string;
266
- }
267
- /**
268
- * Screenshot project
269
- */
270
- interface ScreenshotProject {
271
- id: string;
272
- name: string;
273
- design: ScreenshotDesign;
274
- screens: ScreenshotContent[];
275
- currentLanguage: Language;
276
- selectedScreenId: string;
277
- appMetadata: AppStoreMetadata;
278
- appIcon: string | null;
279
- createdAt: Date;
280
- updatedAt: Date;
281
- }
282
-
283
- /**
284
- * Canvas Configuration
285
- * Canvas operation configuration
286
- */
287
-
288
- /**
289
- * Canvas configuration
290
- */
291
- interface CanvasConfig {
292
- /** Default export format */
293
- defaultFormat?: CanvasFormat;
294
- /** Default quality (0.0 - 1.0) */
295
- defaultQuality?: CanvasQuality;
296
- /** Maximum dimension (width or height) */
297
- maxDimension?: number;
298
- /** Scale factor for high-resolution exports */
299
- scale?: number;
300
- /** Default background color */
301
- backgroundColor?: string;
302
- /** Enable CORS for cross-origin images */
303
- useCORS?: boolean;
304
- }
305
- /**
306
- * Default canvas configuration
307
- */
308
- declare const DEFAULT_CANVAS_CONFIG: CanvasConfig;
309
-
310
- export { type AppStoreMetadata as A, type BackgroundPattern as B, type CanvasColor as C, DEFAULT_CANVAS_CONFIG as D, type FrameStyle as F, type Language as L, type ScreenshotContent as S, type CanvasConfig as a, type CanvasContextConfig as b, type CanvasDimensions as c, type CanvasExportOptions as d, type CanvasFormat as e, type CanvasOperation as f, type CanvasPosition as g, type CanvasQuality as h, type CanvasRect as i, type CanvasResult as j, type DeviceConfig as k, type DeviceDimensions as l, type DeviceType as m, type LayoutStyle as n, type ScreenshotDesign as o, type ScreenshotFormat as p, type ScreenshotGenerationOptions as q, type ScreenshotMetadata as r, type ScreenshotProject as s, type ScreenshotTemplate as t, BackgroundPatternEnum as u, DeviceTypeEnum as v, FrameStyleEnum as w, LayoutStyleEnum as x, ScreenshotFormatEnum as y };
@@ -1,310 +0,0 @@
1
- /**
2
- * Canvas Types
3
- * Core canvas operation types
4
- */
5
- /**
6
- * Canvas format options
7
- */
8
- type CanvasFormat = 'png' | 'jpeg' | 'webp';
9
- /**
10
- * Canvas render quality
11
- */
12
- type CanvasQuality = number;
13
- /**
14
- * Canvas dimensions
15
- */
16
- interface CanvasDimensions {
17
- width: number;
18
- height: number;
19
- }
20
- /**
21
- * Canvas position
22
- */
23
- interface CanvasPosition {
24
- x: number;
25
- y: number;
26
- }
27
- /**
28
- * Canvas rectangle
29
- */
30
- interface CanvasRect extends CanvasPosition, CanvasDimensions {
31
- }
32
- /**
33
- * Canvas color
34
- */
35
- type CanvasColor = string;
36
- /**
37
- * Canvas context configuration
38
- */
39
- interface CanvasContextConfig {
40
- fillStyle?: CanvasColor;
41
- strokeStyle?: CanvasColor;
42
- lineWidth?: number;
43
- lineCap?: 'butt' | 'round' | 'square';
44
- lineJoin?: 'round' | 'bevel' | 'miter';
45
- globalAlpha?: number;
46
- font?: string;
47
- textAlign?: CanvasTextAlign;
48
- textBaseline?: CanvasTextBaseline;
49
- }
50
- /**
51
- * Canvas export options
52
- */
53
- interface CanvasExportOptions {
54
- format?: CanvasFormat;
55
- quality?: CanvasQuality;
56
- scale?: number;
57
- backgroundColor?: string;
58
- useCORS?: boolean;
59
- }
60
- /**
61
- * Canvas result
62
- */
63
- interface CanvasResult {
64
- blob: Blob;
65
- url: string;
66
- dimensions: CanvasDimensions;
67
- format: CanvasFormat;
68
- size: number;
69
- }
70
- /**
71
- * Canvas operation callback
72
- */
73
- type CanvasOperation<T> = (ctx: CanvasRenderingContext2D, dimensions: CanvasDimensions) => T;
74
-
75
- /**
76
- * Screenshot Types
77
- * Screenshot generation and device frame types
78
- */
79
- /**
80
- * Device type
81
- */
82
- type DeviceType = 'iphone-15-pro' | 'iphone-15' | 'iphone-se' | 'ipad-pro' | 'ipad' | 'android-phone' | 'android-tablet' | 'desktop';
83
- /**
84
- * Device type enum (for backward compatibility)
85
- */
86
- declare const DeviceTypeEnum: {
87
- readonly IPHONE_15_PRO: "iphone-15-pro";
88
- readonly IPHONE_15: "iphone-15";
89
- readonly IPHONE_SE: "iphone-se";
90
- readonly IPAD_PRO: "ipad-pro";
91
- readonly IPAD: "ipad";
92
- readonly ANDROID_PHONE: "android-phone";
93
- readonly ANDROID_TABLET: "android-tablet";
94
- readonly DESKTOP: "desktop";
95
- };
96
- /**
97
- * Frame style options
98
- */
99
- type FrameStyle = 'realistic' | 'minimal' | 'none';
100
- /**
101
- * Frame style enum (for backward compatibility)
102
- */
103
- declare const FrameStyleEnum: {
104
- readonly REALISTIC: "realistic";
105
- readonly MINIMAL: "minimal";
106
- readonly NONE: "none";
107
- };
108
- /**
109
- * Layout style options
110
- */
111
- type LayoutStyle = 'text-top' | 'text-bottom' | 'text-overlay';
112
- /**
113
- * Layout style enum (for backward compatibility)
114
- */
115
- declare const LayoutStyleEnum: {
116
- readonly TEXT_TOP: "text-top";
117
- readonly TEXT_BOTTOM: "text-bottom";
118
- readonly TEXT_OVERLAY: "text-overlay";
119
- };
120
- /**
121
- * Background pattern options
122
- */
123
- type BackgroundPattern = 'none' | 'dots' | 'grid' | 'lines' | 'waves' | 'checkers';
124
- /**
125
- * Background pattern enum (for backward compatibility)
126
- */
127
- declare const BackgroundPatternEnum: {
128
- readonly NONE: "none";
129
- readonly DOTS: "dots";
130
- readonly GRID: "grid";
131
- readonly LINES: "lines";
132
- readonly WAVES: "waves";
133
- readonly CHECKERS: "checkers";
134
- };
135
- /**
136
- * Screenshot format
137
- */
138
- type ScreenshotFormat = 'png' | 'jpeg' | 'webp';
139
- /**
140
- * Screenshot format enum (for backward compatibility)
141
- */
142
- declare const ScreenshotFormatEnum: {
143
- readonly PNG: "png";
144
- readonly JPEG: "jpeg";
145
- readonly WEBP: "webp";
146
- };
147
- /**
148
- * Language code
149
- */
150
- type Language = string;
151
- /**
152
- * Device dimensions
153
- */
154
- interface DeviceDimensions {
155
- width: number;
156
- height: number;
157
- scale?: number;
158
- }
159
- /**
160
- * Device configuration
161
- */
162
- interface DeviceConfig {
163
- type: DeviceType;
164
- name: string;
165
- dimensions: DeviceDimensions;
166
- isPhone?: boolean;
167
- isTablet?: boolean;
168
- hasNotch?: boolean;
169
- cornerRadius?: number;
170
- frameThickness?: number;
171
- }
172
- /**
173
- * Screenshot content
174
- */
175
- interface ScreenshotContent {
176
- id: string;
177
- title: string;
178
- subtitle: string;
179
- screenshot: string | null;
180
- translations: Record<Language, {
181
- title: string;
182
- subtitle: string;
183
- }>;
184
- imageFit?: 'cover' | 'contain' | 'fill';
185
- imageZoom?: number;
186
- imageAnchorX?: number;
187
- imageAnchorY?: number;
188
- }
189
- /**
190
- * Screenshot design
191
- */
192
- interface ScreenshotDesign {
193
- backgroundColor: string;
194
- backgroundGradientEnd?: string | null;
195
- backgroundImage?: string | null;
196
- backgroundBlur?: number;
197
- backgroundOverlayOpacity?: number;
198
- backgroundPattern?: BackgroundPattern;
199
- textColor: string;
200
- highlightColor: string;
201
- textAlign: 'left' | 'center' | 'right';
202
- deviceColor: string;
203
- deviceType: DeviceType;
204
- frameStyle: FrameStyle;
205
- layout: LayoutStyle;
206
- scale: number;
207
- fontFamily: string;
208
- titleFontSize: number;
209
- subtitleFontSize: number;
210
- titleFontWeight: string;
211
- subtitleFontWeight: string;
212
- textCase?: 'uppercase' | 'lowercase' | 'none';
213
- lineHeight?: number;
214
- letterSpacing?: number;
215
- rotation?: number;
216
- rotationX?: number;
217
- rotationY?: number;
218
- rotationZ?: number;
219
- offsetY?: number;
220
- shadowIntensity?: number;
221
- padding?: number;
222
- gap?: number;
223
- isPanoramic?: boolean;
224
- }
225
- /**
226
- * Screenshot metadata
227
- */
228
- interface ScreenshotMetadata {
229
- id: string;
230
- deviceType: DeviceType;
231
- dimensions: DeviceDimensions;
232
- format: ScreenshotFormat;
233
- timestamp: Date;
234
- fileSize: number;
235
- url: string;
236
- }
237
- /**
238
- * Screenshot generation options
239
- */
240
- interface ScreenshotGenerationOptions {
241
- deviceType: DeviceType;
242
- format?: ScreenshotFormat;
243
- quality?: number;
244
- customDimensions?: DeviceDimensions;
245
- }
246
- /**
247
- * Screenshot template
248
- */
249
- interface ScreenshotTemplate {
250
- id: string;
251
- name: string;
252
- description: string;
253
- design: Partial<ScreenshotDesign>;
254
- thumbnail?: string;
255
- }
256
- /**
257
- * App Store metadata
258
- */
259
- interface AppStoreMetadata {
260
- appName: string;
261
- subtitle: string;
262
- promotionalText: string;
263
- keywords: string;
264
- description: string;
265
- whatsNew: string;
266
- }
267
- /**
268
- * Screenshot project
269
- */
270
- interface ScreenshotProject {
271
- id: string;
272
- name: string;
273
- design: ScreenshotDesign;
274
- screens: ScreenshotContent[];
275
- currentLanguage: Language;
276
- selectedScreenId: string;
277
- appMetadata: AppStoreMetadata;
278
- appIcon: string | null;
279
- createdAt: Date;
280
- updatedAt: Date;
281
- }
282
-
283
- /**
284
- * Canvas Configuration
285
- * Canvas operation configuration
286
- */
287
-
288
- /**
289
- * Canvas configuration
290
- */
291
- interface CanvasConfig {
292
- /** Default export format */
293
- defaultFormat?: CanvasFormat;
294
- /** Default quality (0.0 - 1.0) */
295
- defaultQuality?: CanvasQuality;
296
- /** Maximum dimension (width or height) */
297
- maxDimension?: number;
298
- /** Scale factor for high-resolution exports */
299
- scale?: number;
300
- /** Default background color */
301
- backgroundColor?: string;
302
- /** Enable CORS for cross-origin images */
303
- useCORS?: boolean;
304
- }
305
- /**
306
- * Default canvas configuration
307
- */
308
- declare const DEFAULT_CANVAS_CONFIG: CanvasConfig;
309
-
310
- export { type AppStoreMetadata as A, type BackgroundPattern as B, type CanvasColor as C, DEFAULT_CANVAS_CONFIG as D, type FrameStyle as F, type Language as L, type ScreenshotContent as S, type CanvasConfig as a, type CanvasContextConfig as b, type CanvasDimensions as c, type CanvasExportOptions as d, type CanvasFormat as e, type CanvasOperation as f, type CanvasPosition as g, type CanvasQuality as h, type CanvasRect as i, type CanvasResult as j, type DeviceConfig as k, type DeviceDimensions as l, type DeviceType as m, type LayoutStyle as n, type ScreenshotDesign as o, type ScreenshotFormat as p, type ScreenshotGenerationOptions as q, type ScreenshotMetadata as r, type ScreenshotProject as s, type ScreenshotTemplate as t, BackgroundPatternEnum as u, DeviceTypeEnum as v, FrameStyleEnum as w, LayoutStyleEnum as x, ScreenshotFormatEnum as y };
@@ -1,78 +0,0 @@
1
- import { q as ScreenshotGenerationOptions, r as ScreenshotMetadata, m as DeviceType, S as ScreenshotContent, o as ScreenshotDesign, s as ScreenshotProject } from '../CanvasConfig-pzoE0RHD.mjs';
2
- import { ScreenshotStudioConfig } from '../domain/config/index.mjs';
3
- import { PDFExportOptions, ReportData, ExcelExportOptions } from '../domain/index.mjs';
4
-
5
- /**
6
- * Screenshot Studio Service
7
- * High-level screenshot generation service
8
- */
9
-
10
- declare class ScreenshotStudioService {
11
- private renderer;
12
- private config;
13
- constructor(config?: Partial<ScreenshotStudioConfig>);
14
- /**
15
- * Generate screenshot
16
- */
17
- generateScreenshot(options: ScreenshotGenerationOptions): Promise<ScreenshotMetadata>;
18
- /**
19
- * Generate batch screenshots
20
- */
21
- generateBatchScreenshots(deviceTypes: DeviceType[]): Promise<ScreenshotMetadata[]>;
22
- /**
23
- * Generate designed screenshot
24
- */
25
- generateDesignedScreenshot(content: ScreenshotContent, design: ScreenshotDesign): Promise<ScreenshotMetadata>;
26
- /**
27
- * Export project as ZIP
28
- */
29
- exportProjectAsZip(project: ScreenshotProject): Promise<Blob>;
30
- /**
31
- * Create project
32
- */
33
- createProject(name: string): ScreenshotProject;
34
- /**
35
- * Get default design
36
- */
37
- private getDefaultDesign;
38
- /**
39
- * Get default screen
40
- */
41
- private getDefaultScreen;
42
- /**
43
- * Generate unique ID - optimized version
44
- */
45
- private generateId;
46
- }
47
-
48
- /**
49
- * Report Service
50
- * PDF export and report generation service
51
- */
52
-
53
- declare class ReportService {
54
- private static instance;
55
- static getInstance(): ReportService;
56
- /**
57
- * Export DOM element to PDF
58
- */
59
- exportToPDF(elementId: string, options?: PDFExportOptions): Promise<void>;
60
- /**
61
- * Export canvas to PDF
62
- */
63
- exportCanvasToPDF(canvas: HTMLCanvasElement, options?: PDFExportOptions): Promise<void>;
64
- /**
65
- * Export data to Excel
66
- */
67
- exportToExcel(data: ReportData, options?: ExcelExportOptions): Promise<void>;
68
- /**
69
- * Export data to CSV
70
- */
71
- exportToCSV(data: ReportData, filename?: string, delimiter?: ',' | ';'): void;
72
- /**
73
- * Export multiple elements to PDF
74
- */
75
- exportMultipleToPDF(elementIds: string[], options?: PDFExportOptions): Promise<void>;
76
- }
77
-
78
- export { ReportService, ScreenshotStudioService };