@meonode/canvas 1.6.0 → 1.7.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/dist/cjs/canvas/canvas.helper.d.ts +20 -1
- package/dist/cjs/canvas/canvas.helper.d.ts.map +1 -1
- package/dist/cjs/canvas/canvas.helper.js +230 -0
- package/dist/cjs/canvas/canvas.helper.js.map +1 -1
- package/dist/cjs/canvas/canvas.type.d.ts +19 -8
- package/dist/cjs/canvas/canvas.type.d.ts.map +1 -1
- package/dist/cjs/canvas/chart.canvas.util.d.ts +2 -2
- package/dist/cjs/canvas/chart.canvas.util.d.ts.map +1 -1
- package/dist/cjs/canvas/chart.canvas.util.js +101 -26
- package/dist/cjs/canvas/chart.canvas.util.js.map +1 -1
- package/dist/cjs/canvas/grid.canvas.util.d.ts +3 -3
- package/dist/cjs/canvas/grid.canvas.util.d.ts.map +1 -1
- package/dist/cjs/canvas/grid.canvas.util.js.map +1 -1
- package/dist/cjs/canvas/image.canvas.util.d.ts +2 -2
- package/dist/cjs/canvas/image.canvas.util.d.ts.map +1 -1
- package/dist/cjs/canvas/image.canvas.util.js.map +1 -1
- package/dist/cjs/canvas/layout.canvas.util.d.ts +4 -4
- package/dist/cjs/canvas/layout.canvas.util.d.ts.map +1 -1
- package/dist/cjs/canvas/layout.canvas.util.js +1 -1
- package/dist/cjs/canvas/layout.canvas.util.js.map +1 -1
- package/dist/cjs/canvas/root.canvas.util.d.ts +3 -3
- package/dist/cjs/canvas/root.canvas.util.d.ts.map +1 -1
- package/dist/cjs/canvas/root.canvas.util.js +6 -4
- package/dist/cjs/canvas/root.canvas.util.js.map +1 -1
- package/dist/cjs/canvas/text.canvas.util.d.ts +2 -2
- package/dist/cjs/canvas/text.canvas.util.d.ts.map +1 -1
- package/dist/cjs/canvas/text.canvas.util.js +0 -1
- package/dist/cjs/canvas/text.canvas.util.js.map +1 -1
- package/dist/esm/canvas/canvas.helper.d.ts +20 -1
- package/dist/esm/canvas/canvas.helper.d.ts.map +1 -1
- package/dist/esm/canvas/canvas.helper.js +230 -1
- package/dist/esm/canvas/canvas.type.d.ts +19 -8
- package/dist/esm/canvas/canvas.type.d.ts.map +1 -1
- package/dist/esm/canvas/chart.canvas.util.d.ts +2 -2
- package/dist/esm/canvas/chart.canvas.util.d.ts.map +1 -1
- package/dist/esm/canvas/chart.canvas.util.js +102 -27
- package/dist/esm/canvas/grid.canvas.util.d.ts +3 -3
- package/dist/esm/canvas/grid.canvas.util.d.ts.map +1 -1
- package/dist/esm/canvas/image.canvas.util.d.ts +2 -2
- package/dist/esm/canvas/image.canvas.util.d.ts.map +1 -1
- package/dist/esm/canvas/layout.canvas.util.d.ts +4 -4
- package/dist/esm/canvas/layout.canvas.util.d.ts.map +1 -1
- package/dist/esm/canvas/layout.canvas.util.js +1 -1
- package/dist/esm/canvas/root.canvas.util.d.ts +3 -3
- package/dist/esm/canvas/root.canvas.util.d.ts.map +1 -1
- package/dist/esm/canvas/root.canvas.util.js +6 -4
- package/dist/esm/canvas/text.canvas.util.d.ts +2 -2
- package/dist/esm/canvas/text.canvas.util.d.ts.map +1 -1
- package/dist/esm/canvas/text.canvas.util.js +0 -1
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type CanvasRenderingContext2D } from 'skia-canvas';
|
|
2
|
-
import type { BaseProps, BoxProps,
|
|
2
|
+
import type { BaseProps, BoxProps, CanvasElement } from '../canvas/canvas.type.js';
|
|
3
3
|
import { Node } from '../constant/common.const.js';
|
|
4
4
|
/**
|
|
5
5
|
* @class BoxNode
|
|
@@ -92,7 +92,7 @@ export declare class BoxNode {
|
|
|
92
92
|
* @param {BoxProps} props Box properties and configuration.
|
|
93
93
|
* @returns {BoxNode} New BoxNode instance.
|
|
94
94
|
*/
|
|
95
|
-
export declare const Box: ({ children, ...rest }: BoxProps) =>
|
|
95
|
+
export declare const Box: ({ children, ...rest }: BoxProps) => CanvasElement;
|
|
96
96
|
/**
|
|
97
97
|
* @class ColumnNode
|
|
98
98
|
* Node class for vertical column layout
|
|
@@ -105,7 +105,7 @@ export declare class ColumnNode extends BoxNode {
|
|
|
105
105
|
* @param {BoxProps} props Column properties and configuration.
|
|
106
106
|
* @returns {ColumnNode} New ColumnNode instance.
|
|
107
107
|
*/
|
|
108
|
-
export declare const Column: ({ children, ...rest }: BoxProps) =>
|
|
108
|
+
export declare const Column: ({ children, ...rest }: BoxProps) => CanvasElement;
|
|
109
109
|
/**
|
|
110
110
|
* @class RowNode
|
|
111
111
|
* @classdesc Node class for horizontal row layout.
|
|
@@ -118,5 +118,5 @@ export declare class RowNode extends BoxNode {
|
|
|
118
118
|
* @param {BoxProps} props Row properties and configuration.
|
|
119
119
|
* @returns {RowNode} New RowNode instance.
|
|
120
120
|
*/
|
|
121
|
-
export declare const Row: ({ children, ...rest }: BoxProps) =>
|
|
121
|
+
export declare const Row: ({ children, ...rest }: BoxProps) => CanvasElement;
|
|
122
122
|
//# sourceMappingURL=layout.canvas.util.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.canvas.util.d.ts","sourceRoot":"","sources":["../../../src/canvas/layout.canvas.util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,wBAAwB,EAAE,MAAM,aAAa,CAAA;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAkB,
|
|
1
|
+
{"version":3,"file":"layout.canvas.util.d.ts","sourceRoot":"","sources":["../../../src/canvas/layout.canvas.util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,wBAAwB,EAAE,MAAM,aAAa,CAAA;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAkB,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAGjG,OAAa,EAAS,IAAI,EAAE,MAAM,4BAA4B,CAAA;AAE9D;;;;GAIG;AACH,qBAAa,OAAO;IAClB;;OAEG;IACH,YAAY,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAA;IAE/B;;OAEG;IACH,IAAI,EAAE,IAAI,CAAA;IAEV;;OAEG;IACH,QAAQ,EAAE,OAAO,EAAE,CAAA;IAEnB;;OAEG;IACH,KAAK,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE3B;;OAEG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;IAEtB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IAEZ;;;OAGG;gBACS,KAAK,GAAE,QAAQ,GAAG,SAAc;IAqB5C;;OAEG;IACI,sBAAsB;IAW7B;;;OAGG;IACH,SAAS,CAAC,sBAAsB,CAAC,WAAW,EAAE,QAAQ,GAAG,SAAS;IAkClE;;OAEG;IACH,SAAS,CAAC,aAAa,IAAI,IAAI;IAI/B;;;;OAIG;IACH,SAAS,CAAC,WAAW,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM;IAanD;;;OAGG;IACI,cAAc,IAAI,OAAO;IAiBhC;;OAEG;IACH,SAAS,CAAC,+BAA+B;IAIzC;;;OAGG;IACH,SAAS,CAAC,SAAS,CAAC,KAAK,EAAE,QAAQ;IAqInC;;;;;OAKG;IACH,MAAM,CAAC,GAAG,EAAE,wBAAwB,EAAE,OAAO,GAAE,MAAU,EAAE,OAAO,GAAE,MAAU;IA+J9E;;;;;;;;OAQG;IACH,SAAS,CAAC,cAAc,CAAC,GAAG,EAAE,wBAAwB,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;CAoR5G;AAWD;;;;GAIG;AACH,eAAO,MAAM,GAAG,GAAI,uBAAuB,QAAQ,KAAG,aAIpD,CAAA;AAEF;;;GAGG;AACH,qBAAa,UAAW,SAAQ,OAAO;gBACzB,KAAK,GAAE,QAAQ,GAAG,SAAc;CAS7C;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,GAAI,uBAAuB,QAAQ,KAAG,aAIvD,CAAA;AAEF;;;GAGG;AACH,qBAAa,OAAQ,SAAQ,OAAO;gBACtB,KAAK,GAAE,QAAQ,GAAG,SAAc;CAS7C;AAED;;;;GAIG;AACH,eAAO,MAAM,GAAG,GAAI,uBAAuB,QAAQ,KAAG,aAIpD,CAAA"}
|
|
@@ -719,7 +719,7 @@ class BoxNode {
|
|
|
719
719
|
}
|
|
720
720
|
}
|
|
721
721
|
/**
|
|
722
|
-
* Normalizes children into a flat
|
|
722
|
+
* Normalizes children into a flat CanvasElement array, filtering falsy values.
|
|
723
723
|
*/
|
|
724
724
|
function normalizeDescriptorChildren(children) {
|
|
725
725
|
if (children === undefined || children === null || children === false)
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Canvas } from 'skia-canvas';
|
|
2
2
|
import { ColumnNode, BoxNode } from '../canvas/layout.canvas.util.js';
|
|
3
|
-
import type { BaseProps, RootProps,
|
|
3
|
+
import type { BaseProps, RootProps, CanvasElement } from '../canvas/canvas.type.js';
|
|
4
4
|
export declare const _clearRegisteredFonts: () => void;
|
|
5
5
|
export interface CanvasEngineConfig {
|
|
6
6
|
/** Run rendering in worker threads to avoid blocking the event loop (default: true) */
|
|
@@ -14,11 +14,11 @@ export interface CanvasEngineConfig {
|
|
|
14
14
|
*/
|
|
15
15
|
export declare function configure(options: CanvasEngineConfig): void;
|
|
16
16
|
/**
|
|
17
|
-
* Converts a
|
|
17
|
+
* Converts a CanvasElement tree into actual BoxNode instances.
|
|
18
18
|
* Used both for non-worker rendering (inline tree building) and inside
|
|
19
19
|
* the render worker (reconstructing the tree from serialized descriptors).
|
|
20
20
|
*/
|
|
21
|
-
export declare function buildTree(descriptor:
|
|
21
|
+
export declare function buildTree(descriptor: CanvasElement): BoxNode;
|
|
22
22
|
/**
|
|
23
23
|
* Root node that manages the canvas rendering context and coordinates overall layout and drawing.
|
|
24
24
|
* Inherits from ColumnNode to provide vertical layout capabilities.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"root.canvas.util.d.ts","sourceRoot":"","sources":["../../../src/canvas/root.canvas.util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAA8C,MAAM,aAAa,CAAA;AAEhF,OAAO,EAAE,UAAU,EAAE,OAAO,EAAW,MAAM,gCAAgC,CAAA;AAC7E,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"root.canvas.util.d.ts","sourceRoot":"","sources":["../../../src/canvas/root.canvas.util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAA8C,MAAM,aAAa,CAAA;AAEhF,OAAO,EAAE,UAAU,EAAE,OAAO,EAAW,MAAM,gCAAgC,CAAA;AAC7E,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAkBlF,eAAO,MAAM,qBAAqB,YAEjC,CAAA;AAOD,MAAM,WAAW,kBAAkB;IACjC,uFAAuF;IACvF,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,OAAO,EAAE,kBAAkB,QAMpD;AA4LD;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,UAAU,EAAE,aAAa,GAAG,OAAO,CAmB5D;AAED;;;GAGG;AACH,qBAAa,QAAS,SAAQ,UAAU;IACtC,6CAA6C;IAC7C,OAAO,CAAC,MAAM,CAAoB;IAClC,8CAA8C;IAC9C,OAAO,CAAC,GAAG,CAAwC;IACnD,4CAA4C;IAC5C,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAQ;IACpC,6CAA6C;IAC7C,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAQ;IACrC,4DAA4D;IAC5D,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAQ;IAE9B;;;;OAIG;gBACS,KAAK,EAAE,SAAS,GAAG,SAAS;IAoDxC;;;OAGG;IACH,OAAO,CAAC,iBAAiB;IAazB;;;;OAIG;IACG,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC;CA6ChC;AAED;;;;;;GAMG;AACH,eAAO,MAAM,IAAI,GAAU,OAAO,SAAS,KAAG,OAAO,CAAC,MAAM,CAS3D,CAAA"}
|
|
@@ -5,6 +5,7 @@ import { TextNode } from './text.canvas.util.js';
|
|
|
5
5
|
import { ChartNode } from './chart.canvas.util.js';
|
|
6
6
|
import { GridItemNode, GridNode } from './grid.canvas.util.js';
|
|
7
7
|
import { Style } from '../constant/common.const.js';
|
|
8
|
+
import { WorkerPreProcessor } from './canvas.helper.js';
|
|
8
9
|
import * as path from 'node:path';
|
|
9
10
|
import * as fs from 'node:fs';
|
|
10
11
|
import { cpus } from 'node:os';
|
|
@@ -150,16 +151,17 @@ class WorkerPool {
|
|
|
150
151
|
}
|
|
151
152
|
}
|
|
152
153
|
render(props) {
|
|
154
|
+
const sanitizedProps = WorkerPreProcessor.process(props);
|
|
153
155
|
return new Promise((resolve, reject) => {
|
|
154
156
|
const id = this.nextId++;
|
|
155
157
|
this.pending.set(id, { resolve: resolve, reject });
|
|
156
158
|
if (this.idle.length > 0) {
|
|
157
159
|
const worker = this.idle.pop();
|
|
158
|
-
const request = { type: 'render', taskId: id, props };
|
|
160
|
+
const request = { type: 'render', taskId: id, props: sanitizedProps };
|
|
159
161
|
worker.postMessage(request);
|
|
160
162
|
}
|
|
161
163
|
else {
|
|
162
|
-
this.queue.push({ id, props });
|
|
164
|
+
this.queue.push({ id, props: sanitizedProps });
|
|
163
165
|
}
|
|
164
166
|
});
|
|
165
167
|
}
|
|
@@ -180,7 +182,7 @@ class WorkerPool {
|
|
|
180
182
|
}
|
|
181
183
|
}
|
|
182
184
|
/**
|
|
183
|
-
* Converts a
|
|
185
|
+
* Converts a CanvasElement tree into actual BoxNode instances.
|
|
184
186
|
* Used both for non-worker rendering (inline tree building) and inside
|
|
185
187
|
* the render worker (reconstructing the tree from serialized descriptors).
|
|
186
188
|
*/
|
|
@@ -253,7 +255,7 @@ class RootNode extends ColumnNode {
|
|
|
253
255
|
this.targetWidth = props.width;
|
|
254
256
|
this.targetHeight = props.height;
|
|
255
257
|
this.node.setWidth(this.targetWidth);
|
|
256
|
-
// Convert any
|
|
258
|
+
// Convert any CanvasElement children to actual BoxNode instances
|
|
257
259
|
if (this.props.children) {
|
|
258
260
|
const childArray = Array.isArray(this.props.children) ? this.props.children : [this.props.children];
|
|
259
261
|
this.props.children = childArray.map(child => {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { TextProps,
|
|
1
|
+
import type { TextProps, CanvasElement } from '../canvas/canvas.type.js';
|
|
2
2
|
import { type CanvasRenderingContext2D } from 'skia-canvas';
|
|
3
3
|
import { BoxNode } from '../canvas/layout.canvas.util.js';
|
|
4
4
|
/**
|
|
@@ -161,5 +161,5 @@ export declare class TextNode extends BoxNode {
|
|
|
161
161
|
/**
|
|
162
162
|
* Creates a new TextNode instance with rich text support
|
|
163
163
|
*/
|
|
164
|
-
export declare const Text: (text: number | string, props?: TextProps) =>
|
|
164
|
+
export declare const Text: (text: number | string, props?: TextProps) => CanvasElement;
|
|
165
165
|
//# sourceMappingURL=text.canvas.util.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.canvas.util.d.ts","sourceRoot":"","sources":["../../../src/canvas/text.canvas.util.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"text.canvas.util.d.ts","sourceRoot":"","sources":["../../../src/canvas/text.canvas.util.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAe,aAAa,EAAE,MAAM,yBAAyB,CAAA;AACpF,OAAO,EAAU,KAAK,wBAAwB,EAA2B,MAAM,aAAa,CAAA;AAC5F,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGxD;;;GAGG;AACH,qBAAa,QAAS,SAAQ,OAAO;IACnC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAoB;IAC7C,OAAO,CAAC,KAAK,CAAsB;IACnC,OAAO,CAAC,MAAM,CAAC,kBAAkB,CAAwC;IACzE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAU;IACxC,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,kBAAkB,CAAe;IAEjC,KAAK,EAAE,SAAS,GAAG;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAA;gBAElC,IAAI,GAAE,MAAM,GAAG,MAAW,EAAE,KAAK,GAAE,SAAc;IAuB7D;;;;;;;;OAQG;WACW,gBAAgB,CAC5B,GAAG,EAAE,wBAAwB,EAC7B,IAAI,EAAE,MAAM,EACZ,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,GAAE;QACL,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAA;QACpC,SAAS,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAA;QAClC,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,SAAS,CAAC,EAAE,wBAAwB,CAAC,WAAW,CAAC,CAAA;QACjD,YAAY,CAAC,EAAE,wBAAwB,CAAC,cAAc,CAAC,CAAA;KACnD;cAwBW,aAAa,IAAI,IAAI;IAoDxC;;;;;;;;;;;;;;;;;OAiBG;IACH,OAAO,CAAC,sBAAsB;IA8B9B;;;;;;;;;;;;;;;;;OAiBG;IACH,OAAO,CAAC,aAAa;IA+ErB,OAAO,CAAC,aAAa;IAKrB,OAAO,CAAC,gBAAgB;IAyBxB;;;;OAIG;IACH,OAAO,CAAC,qBAAqB;IAM7B;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,aAAa;IAiCrB;;OAEG;IACH,OAAO,CAAC,yBAAyB;IAQjC;;;;;;;;;;;;;;OAcG;IACH,OAAO,CAAC,WAAW;IA+NnB;;;;;;;;;OASG;IACH,OAAO,CAAC,YAAY;IA6KpB;;;;;;;OAOG;IACH,OAAO,CAAC,aAAa;IAmErB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAQzB;;;;;;;;;;;;;;;;OAgBG;cACgB,cAAc,CAAC,GAAG,EAAE,wBAAwB,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;CAkXrH;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,GAAI,MAAM,MAAM,GAAG,MAAM,EAAE,QAAQ,SAAS,KAAG,aAI9D,CAAA"}
|
|
@@ -2,7 +2,6 @@ import { Canvas } from 'skia-canvas';
|
|
|
2
2
|
import { BoxNode } from './layout.canvas.util.js';
|
|
3
3
|
import { Style } from '../constant/common.const.js';
|
|
4
4
|
|
|
5
|
-
// TODO: Add comprehensive unit tests for this file.
|
|
6
5
|
/**
|
|
7
6
|
* Node for rendering text content with rich text styling support
|
|
8
7
|
* Supports color and weight variations through HTML-like tags
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@meonode/canvas",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.7.0",
|
|
4
4
|
"description": "A declarative, component-based library for server-side canvas image generation. Write complex visuals with simple functions, similar to the composition style of @meonode/ui.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"canvas",
|