@nmmty/lazycanvas 0.6.4 → 1.0.0-dev.10

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.
Files changed (91) hide show
  1. package/ReadMe.md +1 -1
  2. package/dist/core/Interpolation.d.ts +30 -0
  3. package/dist/core/Interpolation.js +200 -0
  4. package/dist/core/Scene.d.ts +94 -0
  5. package/dist/core/Scene.js +157 -0
  6. package/dist/core/Signal.d.ts +133 -0
  7. package/dist/core/Signal.js +255 -0
  8. package/dist/core/SignalUtils.d.ts +133 -0
  9. package/dist/core/SignalUtils.js +333 -0
  10. package/dist/core/ThreadScheduler.d.ts +38 -0
  11. package/dist/core/ThreadScheduler.js +74 -0
  12. package/dist/core/index.d.ts +5 -0
  13. package/dist/core/index.js +21 -0
  14. package/dist/helpers/Filters.js +1 -1
  15. package/dist/helpers/FontsList.js +18 -18
  16. package/dist/helpers/Utlis.d.ts +3 -3
  17. package/dist/helpers/Utlis.js +25 -36
  18. package/dist/helpers/index.d.ts +3 -3
  19. package/dist/index.d.ts +4 -1
  20. package/dist/index.js +4 -1
  21. package/dist/jsx-runtime.d.ts +17 -0
  22. package/dist/jsx-runtime.js +111 -0
  23. package/dist/structures/LazyCanvas.d.ts +10 -48
  24. package/dist/structures/LazyCanvas.js +17 -78
  25. package/dist/structures/components/BaseLayer.d.ts +78 -32
  26. package/dist/structures/components/BaseLayer.js +106 -37
  27. package/dist/structures/components/BezierLayer.d.ts +27 -40
  28. package/dist/structures/components/BezierLayer.js +90 -55
  29. package/dist/structures/components/{Group.d.ts → Div.d.ts} +41 -22
  30. package/dist/structures/components/Div.js +202 -0
  31. package/dist/structures/components/ImageLayer.d.ts +2 -2
  32. package/dist/structures/components/ImageLayer.js +29 -30
  33. package/dist/structures/components/LineLayer.d.ts +20 -38
  34. package/dist/structures/components/LineLayer.js +45 -47
  35. package/dist/structures/components/MorphLayer.d.ts +5 -34
  36. package/dist/structures/components/MorphLayer.js +38 -52
  37. package/dist/structures/components/Path2DLayer.d.ts +7 -35
  38. package/dist/structures/components/Path2DLayer.js +32 -41
  39. package/dist/structures/components/PolygonLayer.d.ts +95 -0
  40. package/dist/structures/components/PolygonLayer.js +203 -0
  41. package/dist/structures/components/QuadraticLayer.d.ts +36 -45
  42. package/dist/structures/components/QuadraticLayer.js +90 -54
  43. package/dist/structures/components/TextLayer.d.ts +17 -46
  44. package/dist/structures/components/TextLayer.js +94 -77
  45. package/dist/structures/components/index.d.ts +10 -10
  46. package/dist/structures/components/index.js +2 -2
  47. package/dist/structures/helpers/Exporter.d.ts +13 -4
  48. package/dist/structures/helpers/Exporter.js +82 -46
  49. package/dist/structures/helpers/Font.js +1 -17
  50. package/dist/structures/helpers/Gradient.js +35 -49
  51. package/dist/structures/helpers/Link.js +2 -14
  52. package/dist/structures/helpers/Pattern.js +10 -18
  53. package/dist/structures/helpers/index.d.ts +7 -7
  54. package/dist/structures/helpers/readers/JSONReader.d.ts +4 -4
  55. package/dist/structures/helpers/readers/JSONReader.js +46 -48
  56. package/dist/structures/helpers/readers/YAMLReader.js +11 -11
  57. package/dist/structures/managers/FontsManager.js +9 -18
  58. package/dist/structures/managers/LayersManager.d.ts +18 -28
  59. package/dist/structures/managers/LayersManager.js +14 -36
  60. package/dist/structures/managers/LayoutManager.d.ts +23 -0
  61. package/dist/structures/managers/LayoutManager.js +409 -0
  62. package/dist/structures/managers/index.d.ts +3 -5
  63. package/dist/structures/managers/index.js +1 -3
  64. package/dist/structures/managers/{RenderManager.d.ts → piplines/ClassicRenderPipeline.d.ts} +4 -30
  65. package/dist/structures/managers/piplines/ClassicRenderPipeline.js +90 -0
  66. package/dist/structures/managers/piplines/ModernRenderPipeline.d.ts +44 -0
  67. package/dist/structures/managers/piplines/ModernRenderPipeline.js +123 -0
  68. package/dist/structures/managers/piplines/index.d.ts +24 -0
  69. package/dist/structures/managers/piplines/index.js +18 -0
  70. package/dist/types/enum.d.ts +4 -3
  71. package/dist/types/enum.js +3 -2
  72. package/dist/types/index.d.ts +1 -1
  73. package/dist/types/types.d.ts +257 -105
  74. package/dist/utils/APNGEncoder.d.ts +67 -0
  75. package/dist/utils/APNGEncoder.js +205 -0
  76. package/dist/utils/DrawUtils.d.ts +9 -0
  77. package/dist/utils/DrawUtils.js +42 -0
  78. package/dist/utils/LazyUtil.js +1 -2
  79. package/dist/utils/index.d.ts +4 -0
  80. package/dist/utils/index.js +20 -0
  81. package/dist/utils/utils.d.ts +5 -9
  82. package/dist/utils/utils.js +154 -78
  83. package/package.json +61 -59
  84. package/dist/structures/components/ClearLayer.d.ts +0 -147
  85. package/dist/structures/components/ClearLayer.js +0 -158
  86. package/dist/structures/components/Group.js +0 -153
  87. package/dist/structures/managers/AnimationManager.d.ts +0 -120
  88. package/dist/structures/managers/AnimationManager.js +0 -99
  89. package/dist/structures/managers/PluginManager.d.ts +0 -230
  90. package/dist/structures/managers/PluginManager.js +0 -182
  91. package/dist/structures/managers/RenderManager.js +0 -183
@@ -4,9 +4,6 @@ exports.generateID = generateID;
4
4
  exports.isColor = isColor;
5
5
  exports.parseToNormal = parseToNormal;
6
6
  exports.parser = parser;
7
- exports.drawShadow = drawShadow;
8
- exports.opacity = opacity;
9
- exports.filters = filters;
10
7
  exports.parseFillStyle = parseFillStyle;
11
8
  exports.transform = transform;
12
9
  exports.generateRandomName = generateRandomName;
@@ -20,6 +17,7 @@ const helpers_1 = require("../structures/helpers");
20
17
  const canvas_1 = require("@napi-rs/canvas");
21
18
  const LazyUtil_1 = require("./LazyUtil");
22
19
  const components_1 = require("../structures/components");
20
+ const core_1 = require("../core");
23
21
  function generateID(type) {
24
22
  return `${type}-${Math.random().toString(36).substr(2, 9)}`;
25
23
  }
@@ -33,16 +31,41 @@ let rgbaReg = /^rgba\((\d+),\s*(\d+),\s*(\d+),\s*(0|0?\.\d+|1(\.0)?)\)$/;
33
31
  let hslReg = /^hsl\((\d+),\s*(\d+)%,\s*(\d+)%\)$/;
34
32
  let hslaReg = /^hsla\((\d+),\s*(\d+)%,\s*(\d+)%,\s*(0|0?\.\d+|1(\.0)?)\)$/;
35
33
  function isColor(v) {
36
- return typeof (v === 'string' && (hexReg.test(v) || rgbReg.test(v) || rgbaReg.test(v) || hslReg.test(v) || hslaReg.test(v))) || v instanceof helpers_1.Gradient || v instanceof helpers_1.Pattern || (typeof v === 'object' && (v.start && v.end && v.color));
34
+ if ((0, core_1.isSignal)(v)) {
35
+ return true;
36
+ }
37
+ if (typeof v === "object" &&
38
+ v !== null &&
39
+ !(0, core_1.isSignal)(v) &&
40
+ "start" in v &&
41
+ "end" in v &&
42
+ "color" in v) {
43
+ return true;
44
+ }
45
+ if (v instanceof helpers_1.Gradient || v instanceof helpers_1.Pattern) {
46
+ return true;
47
+ }
48
+ if (typeof v === "string") {
49
+ return hexReg.test(v) || rgbReg.test(v) || rgbaReg.test(v) || hslReg.test(v) || hslaReg.test(v);
50
+ }
51
+ return false;
37
52
  }
38
53
  function parseToNormal(v, ctx, canvas, layer = { width: 0, height: 0 }, options = { vertical: false, layer: false }, manager) {
39
- if (typeof v === 'number')
54
+ // Unwrap signal if present
55
+ if ((0, core_1.isSignal)(v)) {
56
+ v = (0, core_1.unwrap)(v);
57
+ }
58
+ if (typeof v === "number")
40
59
  return v;
41
- if (typeof v === 'string') {
60
+ if (typeof v === "string") {
42
61
  if (percentReg.test(v)) {
43
62
  const base = options.layer
44
- ? options.vertical ? layer.height : layer.width
45
- : options.vertical ? canvas.height : canvas.width;
63
+ ? options.vertical
64
+ ? layer.height
65
+ : layer.width
66
+ : options.vertical
67
+ ? canvas.height
68
+ : canvas.width;
46
69
  return (parseFloat(v) / 100) * base;
47
70
  }
48
71
  if (pxReg.test(v))
@@ -50,10 +73,14 @@ function parseToNormal(v, ctx, canvas, layer = { width: 0, height: 0 }, options
50
73
  if (canvasReg.test(v)) {
51
74
  const base = options.layer ? layer : canvas;
52
75
  switch (v) {
53
- case 'vw': return base.width;
54
- case 'vh': return base.height;
55
- case 'vmin': return Math.min(base.width, base.height);
56
- case 'vmax': return Math.max(base.width, base.height);
76
+ case "vw":
77
+ return base.width;
78
+ case "vh":
79
+ return base.height;
80
+ case "vmin":
81
+ return Math.min(base.width, base.height);
82
+ case "vmax":
83
+ return Math.max(base.width, base.height);
57
84
  }
58
85
  }
59
86
  if (linkReg.test(v)) {
@@ -61,15 +88,19 @@ function parseToNormal(v, ctx, canvas, layer = { width: 0, height: 0 }, options
61
88
  if (!manager)
62
89
  return 0;
63
90
  const anyLayer = manager.get(match[2], true);
64
- if (!anyLayer || anyLayer instanceof components_1.Group || anyLayer instanceof components_1.Path2DLayer)
91
+ if (!anyLayer || anyLayer instanceof components_1.Div || anyLayer instanceof components_1.Path2DLayer)
65
92
  return 0;
66
93
  const parserInstance = parser(ctx, canvas, manager);
67
94
  const additionalSpacing = parseInt(match[3]) || 0;
68
95
  switch (match[1]) {
69
- case 'link-w': return getLayerWidth(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
70
- case 'link-h': return getLayerHeight(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
71
- case 'link-x': return parserInstance.parse(anyLayer.props.x) + additionalSpacing;
72
- case 'link-y': return parserInstance.parse(anyLayer.props.y) + additionalSpacing;
96
+ case "link-w":
97
+ return getLayerWidth(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
98
+ case "link-h":
99
+ return getLayerHeight(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
100
+ case "link-x":
101
+ return parserInstance.parse(anyLayer.props.position?.x || 0) + additionalSpacing;
102
+ case "link-y":
103
+ return parserInstance.parse(anyLayer.props.position?.y || 0) + additionalSpacing;
73
104
  }
74
105
  }
75
106
  }
@@ -77,21 +108,27 @@ function parseToNormal(v, ctx, canvas, layer = { width: 0, height: 0 }, options
77
108
  if (!manager)
78
109
  return 0;
79
110
  const anyLayer = manager.get(v.source, true);
80
- if (!anyLayer || anyLayer instanceof components_1.Group || anyLayer instanceof components_1.Path2DLayer)
111
+ if (!anyLayer || anyLayer instanceof components_1.Div || anyLayer instanceof components_1.Path2DLayer)
81
112
  return 0;
82
113
  const parserInstance = parser(ctx, canvas, manager);
83
114
  const additionalSpacing = parserInstance.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0;
84
115
  switch (v.type) {
85
- case types_1.LinkType.Width: return getLayerWidth(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
86
- case types_1.LinkType.Height: return getLayerHeight(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
87
- case types_1.LinkType.X: return parserInstance.parse(anyLayer.props.x) + additionalSpacing;
88
- case types_1.LinkType.Y: return parserInstance.parse(anyLayer.props.y) + additionalSpacing;
116
+ case types_1.LinkType.Width:
117
+ return getLayerWidth(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
118
+ case types_1.LinkType.Height:
119
+ return getLayerHeight(anyLayer, ctx, canvas, manager, parserInstance) + additionalSpacing;
120
+ case types_1.LinkType.X:
121
+ return parserInstance.parse(anyLayer.props.position?.x || 0) + additionalSpacing;
122
+ case types_1.LinkType.Y:
123
+ return parserInstance.parse(anyLayer.props.position?.y || 0) + additionalSpacing;
89
124
  }
90
125
  }
91
126
  return 0;
92
127
  }
93
128
  function getLayerWidth(anyLayer, ctx, canvas, manager, parserInstance) {
94
- if (anyLayer instanceof components_1.LineLayer || anyLayer instanceof components_1.BezierLayer || anyLayer instanceof components_1.QuadraticLayer) {
129
+ if (anyLayer instanceof components_1.LineLayer ||
130
+ anyLayer instanceof components_1.BezierLayer ||
131
+ anyLayer instanceof components_1.QuadraticLayer) {
95
132
  return anyLayer.getBoundingBox(ctx, canvas, manager).width;
96
133
  }
97
134
  if (anyLayer instanceof components_1.TextLayer) {
@@ -100,13 +137,17 @@ function getLayerWidth(anyLayer, ctx, canvas, manager, parserInstance) {
100
137
  return anyLayer instanceof components_1.Path2DLayer ? 0 : parserInstance.parse(anyLayer.props.size.width) || 0;
101
138
  }
102
139
  function getLayerHeight(anyLayer, ctx, canvas, manager, parserInstance) {
103
- if (anyLayer instanceof components_1.LineLayer || anyLayer instanceof components_1.BezierLayer || anyLayer instanceof components_1.QuadraticLayer) {
140
+ if (anyLayer instanceof components_1.LineLayer ||
141
+ anyLayer instanceof components_1.BezierLayer ||
142
+ anyLayer instanceof components_1.QuadraticLayer) {
104
143
  return anyLayer.getBoundingBox(ctx, canvas, manager).height;
105
144
  }
106
145
  if (anyLayer instanceof components_1.TextLayer) {
107
146
  return anyLayer.measureText(ctx, canvas).height;
108
147
  }
109
- return anyLayer instanceof components_1.Path2DLayer ? 0 : parserInstance.parse(anyLayer.props.size.height) || 0;
148
+ return anyLayer instanceof components_1.Path2DLayer
149
+ ? 0
150
+ : parserInstance.parse(anyLayer.props.size.height) || 0;
110
151
  }
111
152
  function parser(ctx, canvas, manager) {
112
153
  return {
@@ -120,44 +161,44 @@ function parser(ctx, canvas, manager) {
120
161
  result[key] = parseToNormal(v, ctx, canvas, layer ?? LazyUtil_1.defaultArg.wh(), options ?? LazyUtil_1.defaultArg.vl(), manager);
121
162
  }
122
163
  return result;
123
- }
164
+ },
124
165
  };
125
166
  }
126
- function drawShadow(ctx, shadow) {
127
- if (shadow) {
128
- ctx.shadowColor = shadow.color;
129
- ctx.shadowBlur = shadow.blur || 0;
130
- ctx.shadowOffsetX = shadow.offsetX || 0;
131
- ctx.shadowOffsetY = shadow.offsetY || 0;
132
- }
133
- }
134
- function opacity(ctx, opacity = 1) {
135
- if (opacity < 1) {
136
- ctx.globalAlpha = opacity;
137
- }
138
- }
139
- function filters(ctx, filters) {
140
- if (filters) {
141
- ctx.filter = filters;
142
- }
143
- }
144
167
  function parseFillStyle(ctx, color, opts) {
145
168
  if (!ctx)
146
- throw new LazyUtil_1.LazyError('The context is not defined');
169
+ throw new LazyUtil_1.LazyError("The context is not defined");
147
170
  if (!color)
148
- throw new LazyUtil_1.LazyError('The color is not defined');
171
+ throw new LazyUtil_1.LazyError("The color is not defined");
149
172
  if (color instanceof helpers_1.Gradient || color instanceof helpers_1.Pattern) {
150
173
  return color.draw(ctx, opts);
151
174
  }
152
- if (typeof color === 'object' && color.start && color.end && color.color) {
153
- return color.color;
175
+ if ((0, core_1.isSignal)(color)) {
176
+ return parseFillStyle(ctx, (0, core_1.unwrap)(color), opts);
177
+ }
178
+ if (typeof color === "object" &&
179
+ color !== null &&
180
+ "start" in color &&
181
+ "end" in color &&
182
+ "color" in color) {
183
+ return (0, core_1.unwrap)(color.color);
154
184
  }
155
- else if (typeof color === 'string') {
185
+ if (typeof color === "string") {
156
186
  return color;
157
187
  }
158
- return '#000000';
188
+ return "#000000";
159
189
  }
160
- function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, type: types_1.LayerType.Morph }, extra = { text: '', textAlign: types_1.TextAlign.Left, fontSize: 0, multiline: false }) {
190
+ function transform(ctx, transform, layer = {
191
+ width: 0,
192
+ height: 0,
193
+ x: 0,
194
+ y: 0,
195
+ type: types_1.LayerType.Morph,
196
+ }, extra = {
197
+ text: "",
198
+ textAlign: types_1.TextAlign.Left,
199
+ fontSize: 0,
200
+ multiline: false,
201
+ }) {
161
202
  if (transform) {
162
203
  if (transform.translate) {
163
204
  ctx.translate(transform.translate.x, transform.translate.y);
@@ -169,15 +210,16 @@ function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, ty
169
210
  case types_1.LayerType.BezierCurve:
170
211
  case types_1.LayerType.QuadraticCurve:
171
212
  case types_1.LayerType.Line:
172
- ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
213
+ case types_1.LayerType.Polygon:
214
+ ctx.translate(layer.x + layer.width / 2, layer.y + layer.height / 2);
173
215
  ctx.rotate((Math.PI / 180) * transform.rotate);
174
- ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
216
+ ctx.translate(-(layer.x + layer.width / 2), -(layer.y + layer.height / 2));
175
217
  break;
176
218
  case types_1.LayerType.Text:
177
219
  if (extra.multiline) {
178
- ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
220
+ ctx.translate(layer.x + layer.width / 2, layer.y + layer.height / 2);
179
221
  ctx.rotate((Math.PI / 180) * transform.rotate);
180
- ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
222
+ ctx.translate(-(layer.x + layer.width / 2), -(layer.y + layer.height / 2));
181
223
  }
182
224
  else {
183
225
  if (extra.textAlign === types_1.TextAlign.Center) {
@@ -203,8 +245,13 @@ function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, ty
203
245
  ctx.scale(transform.scale.x, transform.scale.y);
204
246
  }
205
247
  if (transform.matrix) {
206
- if (!transform.matrix.a || !transform.matrix.b || !transform.matrix.c || !transform.matrix.d || !transform.matrix.e || !transform.matrix.f)
207
- throw new LazyUtil_1.LazyError('The matrix transformation must be a valid matrix');
248
+ if (!transform.matrix.a ||
249
+ !transform.matrix.b ||
250
+ !transform.matrix.c ||
251
+ !transform.matrix.d ||
252
+ !transform.matrix.e ||
253
+ !transform.matrix.f)
254
+ throw new LazyUtil_1.LazyError("The matrix transformation must be a valid matrix");
208
255
  ctx.transform(transform.matrix.a, transform.matrix.b, transform.matrix.c, transform.matrix.d, transform.matrix.e, transform.matrix.f);
209
256
  }
210
257
  }
@@ -229,6 +276,7 @@ function centring(centring, type, width, height, x, y) {
229
276
  case types_1.LayerType.Image:
230
277
  case types_1.LayerType.Morph:
231
278
  case types_1.LayerType.Clear:
279
+ case types_1.LayerType.Polygon:
232
280
  x -= width / 2;
233
281
  y -= height / 2;
234
282
  break;
@@ -240,8 +288,8 @@ function centring(centring, type, width, height, x, y) {
240
288
  case types_1.LayerType.Image:
241
289
  case types_1.LayerType.Morph:
242
290
  case types_1.LayerType.Clear:
291
+ case types_1.LayerType.Polygon:
243
292
  x -= width / 2;
244
- y -= height;
245
293
  break;
246
294
  }
247
295
  return { x, y };
@@ -251,6 +299,7 @@ function centring(centring, type, width, height, x, y) {
251
299
  case types_1.LayerType.Image:
252
300
  case types_1.LayerType.Morph:
253
301
  case types_1.LayerType.Clear:
302
+ case types_1.LayerType.Polygon:
254
303
  x -= width / 2;
255
304
  y -= height;
256
305
  break;
@@ -262,6 +311,7 @@ function centring(centring, type, width, height, x, y) {
262
311
  case types_1.LayerType.Image:
263
312
  case types_1.LayerType.Morph:
264
313
  case types_1.LayerType.Clear:
314
+ case types_1.LayerType.Polygon:
265
315
  y -= height / 2;
266
316
  break;
267
317
  }
@@ -272,6 +322,7 @@ function centring(centring, type, width, height, x, y) {
272
322
  case types_1.LayerType.Image:
273
323
  case types_1.LayerType.Morph:
274
324
  case types_1.LayerType.Clear:
325
+ case types_1.LayerType.Polygon:
275
326
  y -= height;
276
327
  break;
277
328
  }
@@ -285,6 +336,7 @@ function centring(centring, type, width, height, x, y) {
285
336
  case types_1.LayerType.Image:
286
337
  case types_1.LayerType.Morph:
287
338
  case types_1.LayerType.Clear:
339
+ case types_1.LayerType.Polygon:
288
340
  x -= width;
289
341
  y -= height / 2;
290
342
  break;
@@ -296,6 +348,7 @@ function centring(centring, type, width, height, x, y) {
296
348
  case types_1.LayerType.Image:
297
349
  case types_1.LayerType.Morph:
298
350
  case types_1.LayerType.Clear:
351
+ case types_1.LayerType.Polygon:
299
352
  x -= width;
300
353
  y -= height;
301
354
  break;
@@ -307,6 +360,7 @@ function centring(centring, type, width, height, x, y) {
307
360
  case types_1.LayerType.Image:
308
361
  case types_1.LayerType.Morph:
309
362
  case types_1.LayerType.Clear:
363
+ case types_1.LayerType.Polygon:
310
364
  x -= width;
311
365
  break;
312
366
  }
@@ -345,13 +399,23 @@ function getBoundingBoxBezier(points, steps = 100) {
345
399
  maxX = Math.max(maxX, p.x);
346
400
  maxY = Math.max(maxY, p.y);
347
401
  }
348
- return { min: { x: minX, y: minY }, max: { x: maxX, y: maxY }, center: { x: (minX + maxX) / 2, y: (minY + maxY) / 2 }, width: maxX - minX, height: maxY - minY };
402
+ return {
403
+ min: { x: minX, y: minY },
404
+ max: { x: maxX, y: maxY },
405
+ center: { x: (minX + maxX) / 2, y: (minY + maxY) / 2 },
406
+ width: maxX - minX,
407
+ height: maxY - minY,
408
+ };
349
409
  }
350
410
  function resize(value, ratio) {
351
- if (typeof value === 'number') {
411
+ // Handle Signal - return as is (signals are not resized)
412
+ if ((0, core_1.isSignal)(value)) {
413
+ return resize((0, core_1.unwrap)(value), ratio);
414
+ }
415
+ if (typeof value === "number") {
352
416
  return value * ratio;
353
417
  }
354
- else if (typeof value === 'string') {
418
+ else if (typeof value === "string") {
355
419
  if (pxReg.test(value)) {
356
420
  return parseFloat(value) * ratio;
357
421
  }
@@ -359,46 +423,58 @@ function resize(value, ratio) {
359
423
  let match = value.match(linkReg);
360
424
  return `${match[1]}-${match[2]}-${parseFloat(match[3]) * ratio}`;
361
425
  }
426
+ return value;
362
427
  }
363
428
  else if (value instanceof helpers_1.Link) {
364
429
  return `${value.type}-${value.source}-${resize(value.additionalSpacing, ratio)}`;
365
430
  }
366
- return value;
431
+ return 0;
367
432
  }
368
433
  function resizeLayers(layers, ratio) {
369
434
  let newLayers = [];
370
435
  if (layers.length > 0) {
371
436
  for (const layer of layers) {
372
- if (!(layer instanceof components_1.Group || layer instanceof components_1.Path2DLayer)) {
373
- layer.props.x = resize(layer.props.x, ratio);
374
- layer.props.y = resize(layer.props.y, ratio);
375
- if ('size' in layer.props) {
437
+ if (!(layer instanceof components_1.Div || layer instanceof components_1.Path2DLayer)) {
438
+ if (layer.props.position) {
439
+ layer.props.position.x = resize(layer.props.position.x, ratio);
440
+ layer.props.position.y = resize(layer.props.position.y, ratio);
441
+ }
442
+ if ("size" in layer.props && layer.props.size) {
376
443
  layer.props.size.width = resize(layer.props.size.width, ratio);
377
444
  layer.props.size.height = resize(layer.props.size.height, ratio);
378
- if ('radius' in layer.props.size) {
379
- for (const corner in layer.props.size.radius) {
380
- // @ts-ignore
381
- layer.props.size.radius[corner] = resize(layer.props.size.radius[corner], ratio);
445
+ if ("radius" in layer.props.size) {
446
+ if (typeof layer.props.size.radius === "number") {
447
+ layer.props.size.radius = resize(layer.props.size.radius, ratio);
448
+ }
449
+ else if (typeof layer.props.size.radius === "object") {
450
+ for (const corner in layer.props.size.radius) {
451
+ // @ts-ignore
452
+ layer.props.size.radius[corner] = resize(
453
+ // @ts-ignore
454
+ layer.props.size.radius[corner], ratio);
455
+ }
382
456
  }
383
457
  }
384
458
  }
385
- if ('stroke' in layer.props && layer.props.stroke) {
459
+ if ("stroke" in layer.props && layer.props.stroke) {
386
460
  layer.props.stroke.width = resize(layer.props.stroke.width, ratio);
387
461
  }
388
- if ('endPoint' in layer.props) {
389
- layer.props.endPoint.x = resize(layer.props.endPoint.x, ratio);
390
- layer.props.endPoint.y = resize(layer.props.endPoint.y, ratio);
462
+ if (layer.props.position &&
463
+ "endX" in layer.props.position &&
464
+ "endY" in layer.props.position) {
465
+ layer.props.position.endX = resize(layer.props.position.endX, ratio);
466
+ layer.props.position.endY = resize(layer.props.position.endY, ratio);
391
467
  }
392
- if ('controlPoints' in layer.props) {
468
+ if ("controlPoints" in layer.props) {
393
469
  for (const point of layer.props.controlPoints) {
394
470
  point.x = resize(point.x, ratio);
395
471
  point.y = resize(point.y, ratio);
396
472
  }
397
473
  }
398
- if ('font' in layer.props) {
474
+ if ("font" in layer.props) {
399
475
  layer.props.font.size = resize(layer.props.font.size, ratio);
400
476
  }
401
- if ('transform' in layer.props) {
477
+ if ("transform" in layer.props && layer.props.transform) {
402
478
  if (layer.props.transform.translate) {
403
479
  layer.props.transform.translate.x = resize(layer.props.transform.translate.x, ratio);
404
480
  layer.props.transform.translate.y = resize(layer.props.transform.translate.y, ratio);
@@ -409,7 +485,7 @@ function resizeLayers(layers, ratio) {
409
485
  }
410
486
  }
411
487
  }
412
- else if (layer instanceof components_1.Group) {
488
+ else if (layer instanceof components_1.Div) {
413
489
  layer.layers = resizeLayers(layer.layers, ratio);
414
490
  }
415
491
  newLayers.push(layer);
package/package.json CHANGED
@@ -1,59 +1,61 @@
1
- {
2
- "name": "@nmmty/lazycanvas",
3
- "version": "0.6.4",
4
- "description": "A simple way to interact with @napi-rs/canvas in an advanced way!",
5
- "main": "./dist/index.js",
6
- "types": "./dist/index.d.ts",
7
- "scripts": {
8
- "test": "tsc ./test/test.ts && node ./test/test.js",
9
- "centring": "tsc ./test/centring.ts && node ./test/centring.js",
10
- "logo": "tsc ./test/logo.ts && node ./test/logo.js",
11
- "text": "tsc ./test/text.ts && node ./test/text.js",
12
- "animation": "tsc ./test/animation.ts && node ./test/animation.js",
13
- "iotest": "tsc ./test/iotest.ts && node ./test/iotest.js",
14
- "gradient": "tsc ./test/gradient.ts && node ./test/gradient.js",
15
- "docgen": "tsx docgen.ts && tsx ./scripts/post-docgen.ts",
16
- "lint": "eslint ./src --ext .ts",
17
- "lint:fix": "eslint ./src --ext .ts --fix",
18
- "font": "tsx ./scripts/font-gen.ts",
19
- "build": "tsc && tsx ./scripts/post-build.ts"
20
- },
21
- "repository": {
22
- "type": "git",
23
- "url": "git+https://github.com/NMMTY/LazyCanvas.git"
24
- },
25
- "keywords": [
26
- "canvas",
27
- "@napi-rs/canvas",
28
- "node-canvas",
29
- "easy",
30
- "simple"
31
- ],
32
- "author": "NMMTY",
33
- "license": "MIT",
34
- "bugs": {
35
- "url": "https://github.com/NMMTY/LazyCanvas/issues"
36
- },
37
- "homepage": "https://github.com/NMMTY/LazyCanvas#readme",
38
- "dependencies": {
39
- "@napi-rs/canvas": "^0.1.72",
40
- "gifenc": "^1.0.3",
41
- "js-yaml": "^4.1.0",
42
- "path": "^0.12.7",
43
- "svgson": "^5.3.1"
44
- },
45
- "devDependencies": {
46
- "@hitomihiumi/colors.ts": "^1.0.3",
47
- "@hitomihiumi/micro-docgen": "workspace:*",
48
- "@types/js-yaml": "^4.0.9",
49
- "@types/node": "^22.10.2",
50
- "@typescript-eslint/utils": "^8.39.1",
51
- "ava": "^6.2.0",
52
- "eslint": "^9.23.0",
53
- "eslint-config-neon": "^0.2.7",
54
- "lodash.merge": "^4.6.2",
55
- "tslib": "^2.8.1",
56
- "tsx": "^4.19.2",
57
- "typescript": "^5.4.5"
58
- }
59
- }
1
+ {
2
+ "name": "@nmmty/lazycanvas",
3
+ "version": "1.0.0-dev.10",
4
+ "description": "A simple way to interact with @napi-rs/canvas in an advanced way!",
5
+ "main": "./dist/index.js",
6
+ "types": "./dist/index.d.ts",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "git+https://github.com/NMMTY/LazyCanvas.git"
10
+ },
11
+ "keywords": [
12
+ "canvas",
13
+ "@napi-rs/canvas",
14
+ "node-canvas",
15
+ "easy",
16
+ "simple"
17
+ ],
18
+ "author": "NMMTY",
19
+ "license": "MIT",
20
+ "bugs": {
21
+ "url": "https://github.com/NMMTY/LazyCanvas/issues"
22
+ },
23
+ "homepage": "https://github.com/NMMTY/LazyCanvas#readme",
24
+ "dependencies": {
25
+ "@napi-rs/canvas": "^0.1.88",
26
+ "gifenc": "^1.0.3",
27
+ "js-yaml": "^4.1.0",
28
+ "svgson": "^5.3.1",
29
+ "yoga-layout": "^3.2.1"
30
+ },
31
+ "devDependencies": {
32
+ "@biomejs/biome": "1.9.4",
33
+ "@hitomihiumi/colors.ts": "^1.0.3",
34
+ "@types/js-yaml": "^4.0.9",
35
+ "@types/node": "^22.10.2",
36
+ "@typescript-eslint/utils": "^8.39.1",
37
+ "ava": "^6.2.0",
38
+ "eslint": "^9.23.0",
39
+ "eslint-config-neon": "^0.2.7",
40
+ "lodash.merge": "^4.6.2",
41
+ "tslib": "^2.8.1",
42
+ "tsx": "^4.19.2",
43
+ "typescript": "^5.4.5",
44
+ "@hitomihiumi/micro-docgen": "0.4.2"
45
+ },
46
+ "scripts": {
47
+ "test": "tsc ./test/test.ts && node ./test/test.js",
48
+ "centring": "tsc ./test/centring.ts && node ./test/centring.js",
49
+ "logo": "tsc ./test/logo.ts && node ./test/logo.js",
50
+ "text": "tsc ./test/text.ts && node ./test/text.js",
51
+ "animation": "tsc ./test/animation.ts && node ./test/animation.js",
52
+ "iotest": "tsc ./test/iotest.ts && node ./test/iotest.js",
53
+ "gradient": "tsc ./test/gradient.ts && node ./test/gradient.js",
54
+ "docgen": "tsx docgen.ts && tsx ./scripts/post-docgen.ts",
55
+ "lint": "eslint ./src --ext .ts",
56
+ "lint:fix": "eslint ./src --ext .ts --fix",
57
+ "font": "tsx ./scripts/font-gen.ts",
58
+ "build": "tsc && tsx ./scripts/post-build.ts",
59
+ "biome-write": "npx @biomejs/biome format --write ."
60
+ }
61
+ }