@nmmty/lazycanvas 0.3.1 → 0.3.3

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 (45) hide show
  1. package/dist/helpers/{filters.d.ts → Filters.d.ts} +1 -1
  2. package/dist/helpers/{filters.js → Filters.js} +1 -1
  3. package/dist/helpers/FontsList.d.ts +98 -0
  4. package/dist/helpers/FontsList.js +65 -0
  5. package/dist/index.d.ts +6 -3
  6. package/dist/index.js +7 -3
  7. package/dist/structures/LazyCanvas.d.ts +4 -5
  8. package/dist/structures/LazyCanvas.js +1 -1
  9. package/dist/structures/components/BaseLayer.d.ts +6 -6
  10. package/dist/structures/components/BaseLayer.js +4 -4
  11. package/dist/structures/components/BezierLayer.d.ts +1 -1
  12. package/dist/structures/components/BezierLayer.js +2 -2
  13. package/dist/structures/components/ImageLayer.js +1 -1
  14. package/dist/structures/components/LineLayer.d.ts +31 -0
  15. package/dist/structures/components/LineLayer.js +103 -0
  16. package/dist/structures/components/MorphLayer.js +1 -1
  17. package/dist/structures/components/QuadraticLayer.d.ts +1 -1
  18. package/dist/structures/components/QuadraticLayer.js +2 -2
  19. package/dist/structures/components/TextLayer.d.ts +15 -11
  20. package/dist/structures/components/TextLayer.js +26 -19
  21. package/dist/structures/helpers/Font.d.ts +4 -4
  22. package/dist/structures/helpers/Font.js +2 -2
  23. package/dist/structures/helpers/Gradient.d.ts +4 -5
  24. package/dist/structures/helpers/Gradient.js +4 -1
  25. package/dist/structures/helpers/Pattern.d.ts +4 -5
  26. package/dist/structures/helpers/Pattern.js +1 -1
  27. package/dist/structures/managers/FontsManager.d.ts +1 -1
  28. package/dist/structures/managers/FontsManager.js +1 -2
  29. package/dist/structures/managers/RenderManager.js +3 -0
  30. package/dist/types/LazyCanvas.d.ts +2 -2
  31. package/dist/types/components/BaseLayer.d.ts +3 -3
  32. package/dist/types/components/Group.d.ts +3 -1
  33. package/dist/types/components/LineLayer.d.ts +12 -0
  34. package/dist/types/components/MorphLayer.d.ts +1 -1
  35. package/dist/types/components/TextLayer.d.ts +5 -6
  36. package/dist/types/enum.d.ts +1 -1
  37. package/dist/types/enum.js +1 -1
  38. package/dist/types/helpers/Font.d.ts +2 -2
  39. package/dist/types/helpers/Gradient.d.ts +2 -2
  40. package/dist/types/helpers/Pattern.d.ts +2 -2
  41. package/dist/types/index.d.ts +1 -0
  42. package/dist/types/types.d.ts +25 -1
  43. package/dist/utils/utils.d.ts +4 -4
  44. package/dist/utils/utils.js +11 -0
  45. package/package.json +4 -2
@@ -1,5 +1,5 @@
1
1
  /**
2
- * List of CSS [`filters`](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) that can be used with the `filter` property. Use this functions to `setFilter` on the layer.
2
+ * List of CSS [`filters`](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) that can be used with the `filter` property. Use this functions to `setFilters` on the layer.
3
3
  */
4
4
  export declare const Filters: {
5
5
  /**
@@ -2,7 +2,7 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Filters = void 0;
4
4
  /**
5
- * List of CSS [`filters`](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) that can be used with the `filter` property. Use this functions to `setFilter` on the layer.
5
+ * List of CSS [`filters`](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) that can be used with the `filter` property. Use this functions to `setFilters` on the layer.
6
6
  */
7
7
  exports.Filters = {
8
8
  /**
@@ -0,0 +1,98 @@
1
+ import { FontWeight } from "../types/enum";
2
+ /**
3
+ * The bundled fonts in this package.
4
+ * Used fonts:
5
+ * @see https://vercel.com/font
6
+ */
7
+ export declare const FontsList: {
8
+ Geist_Thin(size: number): {
9
+ family: string;
10
+ size: number;
11
+ weight: FontWeight;
12
+ };
13
+ Geist_ExtraLight(size: number): {
14
+ family: string;
15
+ size: number;
16
+ weight: FontWeight;
17
+ };
18
+ Geist_Light(size: number): {
19
+ family: string;
20
+ size: number;
21
+ weight: FontWeight;
22
+ };
23
+ Geist_Regular(size: number): {
24
+ family: string;
25
+ size: number;
26
+ weight: FontWeight;
27
+ };
28
+ Geist_Medium(size: number): {
29
+ family: string;
30
+ size: number;
31
+ weight: FontWeight;
32
+ };
33
+ Geist_SemiBold(size: number): {
34
+ family: string;
35
+ size: number;
36
+ weight: FontWeight;
37
+ };
38
+ Geist_Bold(size: number): {
39
+ family: string;
40
+ size: number;
41
+ weight: FontWeight;
42
+ };
43
+ Geist_ExtraBold(size: number): {
44
+ family: string;
45
+ size: number;
46
+ weight: FontWeight;
47
+ };
48
+ Geist_Black(size: number): {
49
+ family: string;
50
+ size: number;
51
+ weight: FontWeight;
52
+ };
53
+ GeistMono_Thin(size: number): {
54
+ family: string;
55
+ size: number;
56
+ weight: FontWeight;
57
+ };
58
+ GeistMono_ExtraLight(size: number): {
59
+ family: string;
60
+ size: number;
61
+ weight: FontWeight;
62
+ };
63
+ GeistMono_Light(size: number): {
64
+ family: string;
65
+ size: number;
66
+ weight: FontWeight;
67
+ };
68
+ GeistMono_Regular(size: number): {
69
+ family: string;
70
+ size: number;
71
+ weight: FontWeight;
72
+ };
73
+ GeistMono_Medium(size: number): {
74
+ family: string;
75
+ size: number;
76
+ weight: FontWeight;
77
+ };
78
+ GeistMono_SemiBold(size: number): {
79
+ family: string;
80
+ size: number;
81
+ weight: FontWeight;
82
+ };
83
+ GeistMono_Bold(size: number): {
84
+ family: string;
85
+ size: number;
86
+ weight: FontWeight;
87
+ };
88
+ GeistMono_Black(size: number): {
89
+ family: string;
90
+ size: number;
91
+ weight: FontWeight;
92
+ };
93
+ GeistMono_ExtraBlack(size: number): {
94
+ family: string;
95
+ size: number;
96
+ weight: FontWeight;
97
+ };
98
+ };
@@ -0,0 +1,65 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.FontsList = void 0;
4
+ const enum_1 = require("../types/enum");
5
+ /**
6
+ * The bundled fonts in this package.
7
+ * Used fonts:
8
+ * @see https://vercel.com/font
9
+ */
10
+ exports.FontsList = {
11
+ Geist_Thin(size) {
12
+ return { family: 'Geist', size, weight: enum_1.FontWeight.Thin };
13
+ },
14
+ Geist_ExtraLight(size) {
15
+ return { family: 'Geist', size, weight: enum_1.FontWeight.ExtraLight };
16
+ },
17
+ Geist_Light(size) {
18
+ return { family: 'Geist', size, weight: enum_1.FontWeight.Light };
19
+ },
20
+ Geist_Regular(size) {
21
+ return { family: 'Geist', size, weight: enum_1.FontWeight.Regular };
22
+ },
23
+ Geist_Medium(size) {
24
+ return { family: 'Geist', size, weight: enum_1.FontWeight.Medium };
25
+ },
26
+ Geist_SemiBold(size) {
27
+ return { family: 'Geist', size, weight: enum_1.FontWeight.SemiBold };
28
+ },
29
+ Geist_Bold(size) {
30
+ return { family: 'Geist', size, weight: enum_1.FontWeight.Bold };
31
+ },
32
+ Geist_ExtraBold(size) {
33
+ return { family: 'Geist', size, weight: enum_1.FontWeight.ExtraBold };
34
+ },
35
+ Geist_Black(size) {
36
+ return { family: 'Geist', size, weight: enum_1.FontWeight.Black };
37
+ },
38
+ GeistMono_Thin(size) {
39
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.Thin };
40
+ },
41
+ GeistMono_ExtraLight(size) {
42
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.ExtraLight };
43
+ },
44
+ GeistMono_Light(size) {
45
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.Light };
46
+ },
47
+ GeistMono_Regular(size) {
48
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.Regular };
49
+ },
50
+ GeistMono_Medium(size) {
51
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.Medium };
52
+ },
53
+ GeistMono_SemiBold(size) {
54
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.SemiBold };
55
+ },
56
+ GeistMono_Bold(size) {
57
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.Bold };
58
+ },
59
+ GeistMono_Black(size) {
60
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.Black };
61
+ },
62
+ GeistMono_ExtraBlack(size) {
63
+ return { family: 'GeistMono', size, weight: enum_1.FontWeight.ExtraBlack };
64
+ },
65
+ };
package/dist/index.d.ts CHANGED
@@ -4,13 +4,16 @@ import { MorphLayer } from "./structures/components/MorphLayer";
4
4
  import { TextLayer } from "./structures/components/TextLayer";
5
5
  import { BezierLayer } from "./structures/components/BezierLayer";
6
6
  import { QuadraticLayer } from "./structures/components/QuadraticLayer";
7
+ import { LineLayer } from "./structures/components/LineLayer";
7
8
  import { BaseLayer } from "./structures/components/BaseLayer";
8
9
  import { Group } from "./structures/components/Group";
9
10
  import { LayerType, LayerScaleType, LineCap, LineJoin, TextAlign, TextDirection, TextBaseline, FontWeight, Export, Centring, PatternType, SaveFormat, GradientType } from "./types/enum";
10
- import type { AnyLayer, ScaleType, ColorType, IFont, IFonts, IGradient, IPattern, IImageLayer, IImageLayerProps, IMorphLayer, IMorphLayerProps, ITextLayer, ITextLayerProps, IBezierLayer, IBezierLayerProps, IQuadraticLayer, IQuadraticLayerProps, IBaseLayer, IBaseLayerProps, IGroup } from "./types";
11
+ import type { AnyLayer, AnyCentring, AnyPatternType, AnyGradientType, AnyTextAlign, AnyTextDirection, AnyTextBaseline, AnyWeight, AnyExport, AnyLineCap, AnyLineJoin, AnySaveFormat, ScaleType, ColorType, IFont, IFonts, IGradient, IPattern, IImageLayer, IImageLayerProps, IMorphLayer, IMorphLayerProps, ITextLayer, ITextLayerProps, IBezierLayer, IBezierLayerProps, IQuadraticLayer, IQuadraticLayerProps, ILineLayer, ILineLayerProps, IBaseLayer, IBaseLayerProps, IGroup } from "./types";
11
12
  import { Font } from "./structures/helpers/Font";
12
13
  import { Gradient } from "./structures/helpers/Gradient";
13
14
  import { Pattern } from "./structures/helpers/Pattern";
14
15
  import { saveFile } from "./utils/utils";
15
- import { Filters } from "./helpers/filters";
16
- export { LazyCanvas, ImageLayer, MorphLayer, TextLayer, BezierLayer, QuadraticLayer, BaseLayer, Group, Font, Gradient, Pattern, LayerScaleType, LayerType, FontWeight, GradientType, Export, LineCap, LineJoin, TextAlign, TextDirection, TextBaseline, SaveFormat, Centring, PatternType, saveFile, Filters, IFont, IFonts, IGradient, IPattern, IImageLayer, IImageLayerProps, IMorphLayer, IMorphLayerProps, ITextLayer, ITextLayerProps, IBaseLayer, IBaseLayerProps, IBezierLayer, IBezierLayerProps, IQuadraticLayer, IQuadraticLayerProps, IGroup, AnyLayer, ScaleType, ColorType, };
16
+ import { Filters } from "./helpers/Filters";
17
+ import { FontsList } from "./helpers/FontsList";
18
+ export { LazyCanvas, ImageLayer, MorphLayer, TextLayer, BezierLayer, QuadraticLayer, LineLayer, BaseLayer, Group, Font, Gradient, Pattern, LayerScaleType, LayerType, FontWeight, GradientType, Export, LineCap, LineJoin, TextAlign, TextDirection, TextBaseline, SaveFormat, Centring, PatternType, saveFile, Filters, FontsList, };
19
+ export type { IFont, IFonts, IGradient, IPattern, IImageLayer, IImageLayerProps, IMorphLayer, IMorphLayerProps, ITextLayer, ITextLayerProps, IBaseLayer, IBaseLayerProps, IBezierLayer, IBezierLayerProps, IQuadraticLayer, IQuadraticLayerProps, ILineLayer, ILineLayerProps, IGroup, AnyLayer, AnyCentring, AnyPatternType, AnyGradientType, AnyTextAlign, AnyTextDirection, AnyTextBaseline, AnyWeight, AnyExport, AnyLineCap, AnyLineJoin, AnySaveFormat, ScaleType, ColorType };
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Filters = exports.saveFile = exports.PatternType = exports.Centring = exports.SaveFormat = exports.TextBaseline = exports.TextDirection = exports.TextAlign = exports.LineJoin = exports.LineCap = exports.Export = exports.GradientType = exports.FontWeight = exports.LayerType = exports.LayerScaleType = exports.Pattern = exports.Gradient = exports.Font = exports.Group = exports.BaseLayer = exports.QuadraticLayer = exports.BezierLayer = exports.TextLayer = exports.MorphLayer = exports.ImageLayer = exports.LazyCanvas = void 0;
3
+ exports.FontsList = exports.Filters = exports.saveFile = exports.PatternType = exports.Centring = exports.SaveFormat = exports.TextBaseline = exports.TextDirection = exports.TextAlign = exports.LineJoin = exports.LineCap = exports.Export = exports.GradientType = exports.FontWeight = exports.LayerType = exports.LayerScaleType = exports.Pattern = exports.Gradient = exports.Font = exports.Group = exports.BaseLayer = exports.LineLayer = exports.QuadraticLayer = exports.BezierLayer = exports.TextLayer = exports.MorphLayer = exports.ImageLayer = exports.LazyCanvas = void 0;
4
4
  const LazyCanvas_1 = require("./structures/LazyCanvas");
5
5
  Object.defineProperty(exports, "LazyCanvas", { enumerable: true, get: function () { return LazyCanvas_1.LazyCanvas; } });
6
6
  const ImageLayer_1 = require("./structures/components/ImageLayer");
@@ -13,6 +13,8 @@ const BezierLayer_1 = require("./structures/components/BezierLayer");
13
13
  Object.defineProperty(exports, "BezierLayer", { enumerable: true, get: function () { return BezierLayer_1.BezierLayer; } });
14
14
  const QuadraticLayer_1 = require("./structures/components/QuadraticLayer");
15
15
  Object.defineProperty(exports, "QuadraticLayer", { enumerable: true, get: function () { return QuadraticLayer_1.QuadraticLayer; } });
16
+ const LineLayer_1 = require("./structures/components/LineLayer");
17
+ Object.defineProperty(exports, "LineLayer", { enumerable: true, get: function () { return LineLayer_1.LineLayer; } });
16
18
  const BaseLayer_1 = require("./structures/components/BaseLayer");
17
19
  Object.defineProperty(exports, "BaseLayer", { enumerable: true, get: function () { return BaseLayer_1.BaseLayer; } });
18
20
  const Group_1 = require("./structures/components/Group");
@@ -39,5 +41,7 @@ const Pattern_1 = require("./structures/helpers/Pattern");
39
41
  Object.defineProperty(exports, "Pattern", { enumerable: true, get: function () { return Pattern_1.Pattern; } });
40
42
  const utils_1 = require("./utils/utils");
41
43
  Object.defineProperty(exports, "saveFile", { enumerable: true, get: function () { return utils_1.saveFile; } });
42
- const filters_1 = require("./helpers/filters");
43
- Object.defineProperty(exports, "Filters", { enumerable: true, get: function () { return filters_1.Filters; } });
44
+ const Filters_1 = require("./helpers/Filters");
45
+ Object.defineProperty(exports, "Filters", { enumerable: true, get: function () { return Filters_1.Filters; } });
46
+ const FontsList_1 = require("./helpers/FontsList");
47
+ Object.defineProperty(exports, "FontsList", { enumerable: true, get: function () { return FontsList_1.FontsList; } });
@@ -1,5 +1,4 @@
1
- import { Export } from "../types/enum";
2
- import { ILazyCanvas } from "../types";
1
+ import { AnyExport, ILazyCanvas } from "../types";
3
2
  import { Canvas, SKRSContext2D, SvgExportFlag } from "@napi-rs/canvas";
4
3
  import { LayersManager } from "./managers/LayersManager";
5
4
  import { RenderManager } from "./managers/RenderManager";
@@ -12,13 +11,13 @@ export declare class LazyCanvas implements ILazyCanvas {
12
11
  layers: LayersManager;
13
12
  render: RenderManager;
14
13
  fonts: FontsManager;
15
- exportType: Export;
14
+ exportType: AnyExport;
16
15
  constructor(debug?: boolean);
17
16
  /**
18
17
  * Set the export type
19
- * @param type {Export} - The `export` type
18
+ * @param type {AnyExport} - The `export` type
20
19
  */
21
- setExportType(type: Export): this;
20
+ setExportType(type: AnyExport): this;
22
21
  /**
23
22
  * Set the SVG export flag. This method should be called after `setExportType` method.
24
23
  * @param flag {SvgExportFlag} - The `flag` of the SVG export
@@ -27,7 +27,7 @@ class LazyCanvas {
27
27
  }
28
28
  /**
29
29
  * Set the export type
30
- * @param type {Export} - The `export` type
30
+ * @param type {AnyExport} - The `export` type
31
31
  */
32
32
  setExportType(type) {
33
33
  this.exportType = type;
@@ -1,5 +1,5 @@
1
- import { ScaleType, IBaseLayer, IBaseLayerProps } from "../../types";
2
- import { Centring, LayerType } from "../../types/enum";
1
+ import { ScaleType, IBaseLayer, IBaseLayerProps, AnyCentring } from "../../types";
2
+ import { LayerType } from "../../types/enum";
3
3
  export declare class BaseLayer<T extends IBaseLayerProps> {
4
4
  id: string;
5
5
  type: LayerType;
@@ -56,14 +56,14 @@ export declare class BaseLayer<T extends IBaseLayerProps> {
56
56
  /**
57
57
  * @description The **`CanvasRenderingContext2D`**. filter property of the Canvas 2D API provides filter effects such as blurring and grayscaling.
58
58
  * It is similar to the CSS [`filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) property and accepts the same values.
59
- * @param filter {string} - The `filter` of the layer. Not support multiple filters.
59
+ * @param filter {string} - The `filter` of the layer. Multiple filters are supported.
60
60
  */
61
- setFilter(filter: string): this;
61
+ setFilters(...filter: string[]): this;
62
62
  /**
63
63
  * @description Sets type of centring of the layer.
64
- * @param centring {Centring} - The `centring` of the layer
64
+ * @param centring {AnyCentring} - The `centring` of the layer
65
65
  */
66
- setCentring(centring: Centring): this;
66
+ setCentring(centring: AnyCentring): this;
67
67
  /**
68
68
  * @description Sets the visibility of the layer.
69
69
  * @param visible {boolean} - The `visibility` of the layer
@@ -111,15 +111,15 @@ class BaseLayer {
111
111
  /**
112
112
  * @description The **`CanvasRenderingContext2D`**. filter property of the Canvas 2D API provides filter effects such as blurring and grayscaling.
113
113
  * It is similar to the CSS [`filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) property and accepts the same values.
114
- * @param filter {string} - The `filter` of the layer. Not support multiple filters.
114
+ * @param filter {string} - The `filter` of the layer. Multiple filters are supported.
115
115
  */
116
- setFilter(filter) {
117
- this.props.filter = filter;
116
+ setFilters(...filter) {
117
+ this.props.filter = filter.join(' ');
118
118
  return this;
119
119
  }
120
120
  /**
121
121
  * @description Sets type of centring of the layer.
122
- * @param centring {Centring} - The `centring` of the layer
122
+ * @param centring {AnyCentring} - The `centring` of the layer
123
123
  */
124
124
  setCentring(centring) {
125
125
  this.props.centring = centring;
@@ -18,7 +18,7 @@ export declare class BezierLayer extends BaseLayer<IBezierLayerProps> {
18
18
  * @param x {ScaleType} - The end `x` of the bezier layer.
19
19
  * @param y {ScaleType} - The end `y` of the bezier layer.
20
20
  */
21
- setEndPoint(x: ScaleType, y: ScaleType): this;
21
+ setEndPosition(x: ScaleType, y: ScaleType): this;
22
22
  /**
23
23
  * @description Sets the color of the layer. You can use `hex`, `rgb`, `rgba`, `hsl`, `hsla`, and `Gradient`color.
24
24
  * @param color {string} - The `color` of the layer.
@@ -10,7 +10,7 @@ const Pattern_1 = require("../helpers/Pattern");
10
10
  class BezierLayer extends BaseLayer_1.BaseLayer {
11
11
  props;
12
12
  constructor(props) {
13
- super(enum_1.LayerType.BezierCurve, props);
13
+ super(enum_1.LayerType.BezierCurve, props || {});
14
14
  this.props = props ? props : {};
15
15
  if (!this.props.fillStyle)
16
16
  this.props.fillStyle = '#000000';
@@ -31,7 +31,7 @@ class BezierLayer extends BaseLayer_1.BaseLayer {
31
31
  * @param x {ScaleType} - The end `x` of the bezier layer.
32
32
  * @param y {ScaleType} - The end `y` of the bezier layer.
33
33
  */
34
- setEndPoint(x, y) {
34
+ setEndPosition(x, y) {
35
35
  this.props.endPoint = { x, y };
36
36
  return this;
37
37
  }
@@ -33,7 +33,7 @@ const jimp = __importStar(require("jimp"));
33
33
  class ImageLayer extends BaseLayer_1.BaseLayer {
34
34
  props;
35
35
  constructor(props) {
36
- super(enum_1.LayerType.Image, props);
36
+ super(enum_1.LayerType.Image, props || {});
37
37
  this.props = props ? props : {};
38
38
  this.props.centring = enum_1.Centring.Center;
39
39
  }
@@ -0,0 +1,31 @@
1
+ import { BaseLayer } from "./BaseLayer";
2
+ import { ColorType, ILineLayer, ILineLayerProps, ScaleType } from "../../types/";
3
+ import { Canvas, SKRSContext2D } from "@napi-rs/canvas";
4
+ import { LayersManager } from "../managers/LayersManager";
5
+ export declare class LineLayer extends BaseLayer<ILineLayerProps> {
6
+ props: ILineLayerProps;
7
+ constructor(props?: ILineLayerProps);
8
+ /**
9
+ * @description Sets the end point of the line layer. You can use `numbers`, `percentages`, `px`, `vw`, `vh`, `vmin`, `vmax`.
10
+ * @param x {ScaleType} - The end `x` of the line layer.
11
+ * @param y {ScaleType} - The end `y` of the line layer.
12
+ */
13
+ setEndPosition(x: ScaleType, y: ScaleType): this;
14
+ /**
15
+ * @description Sets the color of the layer. You can use `hex`, `rgb`, `rgba`, `hsl`, `hsla`, and `Gradient`color.
16
+ * @param color {string} - The `color` of the layer.
17
+ */
18
+ setColor(color: ColorType): this;
19
+ /**
20
+ * @description Sets the stroke of the layer.
21
+ * @param width {number} - The `width` of the stroke.
22
+ * @param cap {string} - The `cap` of the stroke.
23
+ * @param join {string} - The `join` of the stroke.
24
+ * @param dash {number[]} - The `dash` of the stroke.
25
+ * @param dashOffset {number} - The `dashOffset` of the stroke.
26
+ * @param miterLimit {number} - The `miterLimit` of the stroke.
27
+ */
28
+ setStroke(width: number, cap?: CanvasLineCap, join?: CanvasLineJoin, dash?: number[], dashOffset?: number, miterLimit?: number): this;
29
+ draw(ctx: SKRSContext2D, canvas: Canvas, manager: LayersManager, debug: boolean): Promise<void>;
30
+ toJSON(): ILineLayer;
31
+ }
@@ -0,0 +1,103 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.LineLayer = void 0;
4
+ const BaseLayer_1 = require("./BaseLayer");
5
+ const enum_1 = require("../../types/enum");
6
+ const LazyUtil_1 = require("../../utils/LazyUtil");
7
+ const utils_1 = require("../../utils/utils");
8
+ const Gradient_1 = require("../helpers/Gradient");
9
+ const Pattern_1 = require("../helpers/Pattern");
10
+ class LineLayer extends BaseLayer_1.BaseLayer {
11
+ props;
12
+ constructor(props) {
13
+ super(enum_1.LayerType.Line, props || {});
14
+ this.props = props ? props : {};
15
+ if (!this.props.fillStyle)
16
+ this.props.fillStyle = '#000000';
17
+ this.props.centring = enum_1.Centring.None;
18
+ }
19
+ /**
20
+ * @description Sets the end point of the line layer. You can use `numbers`, `percentages`, `px`, `vw`, `vh`, `vmin`, `vmax`.
21
+ * @param x {ScaleType} - The end `x` of the line layer.
22
+ * @param y {ScaleType} - The end `y` of the line layer.
23
+ */
24
+ setEndPosition(x, y) {
25
+ this.props.endPoint = { x, y };
26
+ return this;
27
+ }
28
+ /**
29
+ * @description Sets the color of the layer. You can use `hex`, `rgb`, `rgba`, `hsl`, `hsla`, and `Gradient`color.
30
+ * @param color {string} - The `color` of the layer.
31
+ */
32
+ setColor(color) {
33
+ if (!color)
34
+ throw new LazyUtil_1.LazyError('The color of the layer must be provided');
35
+ if (!(0, utils_1.isColor)(color))
36
+ throw new LazyUtil_1.LazyError('The color of the layer must be a valid color');
37
+ let fill = (0, utils_1.parseColor)(color);
38
+ if (fill instanceof Gradient_1.Gradient || fill instanceof Pattern_1.Pattern) {
39
+ this.props.fillStyle = fill;
40
+ }
41
+ else {
42
+ let arr = fill.split(':');
43
+ this.props.fillStyle = arr[0];
44
+ this.props.opacity = parseFloat(arr[1]) || 1;
45
+ }
46
+ return this;
47
+ }
48
+ /**
49
+ * @description Sets the stroke of the layer.
50
+ * @param width {number} - The `width` of the stroke.
51
+ * @param cap {string} - The `cap` of the stroke.
52
+ * @param join {string} - The `join` of the stroke.
53
+ * @param dash {number[]} - The `dash` of the stroke.
54
+ * @param dashOffset {number} - The `dashOffset` of the stroke.
55
+ * @param miterLimit {number} - The `miterLimit` of the stroke.
56
+ */
57
+ setStroke(width, cap, join, dash, dashOffset, miterLimit) {
58
+ this.props.stroke = {
59
+ width,
60
+ cap: cap || 'butt',
61
+ join: join || 'miter',
62
+ dash: dash || [],
63
+ dashOffset: dashOffset || 0,
64
+ miterLimit: miterLimit || 10,
65
+ };
66
+ return this;
67
+ }
68
+ async draw(ctx, canvas, manager, debug) {
69
+ const xs = (0, utils_1.parseToNormal)(this.props.x, ctx, canvas);
70
+ const ys = (0, utils_1.parseToNormal)(this.props.y, ctx, canvas, { width: 0, height: 0 }, { vertical: true });
71
+ const xe = (0, utils_1.parseToNormal)(this.props.endPoint.x, ctx, canvas);
72
+ const ye = (0, utils_1.parseToNormal)(this.props.endPoint.y, ctx, canvas, { width: 0, height: 0 }, { vertical: true });
73
+ let width = xe - xs;
74
+ let height = ye - ys;
75
+ let fillStyle = await (0, utils_1.parseFillStyle)(ctx, this.props.fillStyle);
76
+ if (debug)
77
+ LazyUtil_1.LazyLog.log('none', `LineLayer:`, { xs, ys, xe, ye, width, height });
78
+ ctx.save();
79
+ (0, utils_1.transform)(ctx, this.props.transform, { x: xs, y: ys, width, height, type: this.type });
80
+ (0, utils_1.drawShadow)(ctx, this.props.shadow);
81
+ (0, utils_1.opacity)(ctx, this.props.opacity);
82
+ (0, utils_1.filters)(ctx, this.props.filter);
83
+ ctx.beginPath();
84
+ ctx.moveTo(xs, ys);
85
+ ctx.strokeStyle = fillStyle;
86
+ ctx.lineWidth = this.props.stroke?.width || 1;
87
+ ctx.lineCap = this.props.stroke?.cap || 'butt';
88
+ ctx.lineJoin = this.props.stroke?.join || 'miter';
89
+ ctx.miterLimit = this.props.stroke?.miterLimit || 10;
90
+ ctx.lineDashOffset = this.props.stroke?.dashOffset || 0;
91
+ ctx.setLineDash(this.props.stroke?.dash || []);
92
+ ctx.lineTo(xe, ye);
93
+ ctx.stroke();
94
+ ctx.closePath();
95
+ ctx.restore();
96
+ }
97
+ toJSON() {
98
+ let data = super.toJSON();
99
+ data.props = this.props;
100
+ return { ...data };
101
+ }
102
+ }
103
+ exports.LineLayer = LineLayer;
@@ -10,7 +10,7 @@ const Pattern_1 = require("../helpers/Pattern");
10
10
  class MorphLayer extends BaseLayer_1.BaseLayer {
11
11
  props;
12
12
  constructor(props) {
13
- super(enum_1.LayerType.Morph, props);
13
+ super(enum_1.LayerType.Morph, props || {});
14
14
  this.props = props ? props : {};
15
15
  if (!this.props.fillStyle)
16
16
  this.props.fillStyle = '#000000';
@@ -16,7 +16,7 @@ export declare class QuadraticLayer extends BaseLayer<IQuadraticLayerProps> {
16
16
  * @param x {ScaleType} - The end `x` of the quadratic layer.
17
17
  * @param y {ScaleType} - The end `y` of the quadratic layer.
18
18
  */
19
- setEndPoint(x: ScaleType, y: ScaleType): this;
19
+ setEndPosition(x: ScaleType, y: ScaleType): this;
20
20
  /**
21
21
  * @description Sets the color of the layer. You can use `hex`, `rgb`, `rgba`, `hsl`, `hsla`, and `Gradient`color.
22
22
  * @param color {string} - The `color` of the layer.
@@ -10,7 +10,7 @@ const Pattern_1 = require("../helpers/Pattern");
10
10
  class QuadraticLayer extends BaseLayer_1.BaseLayer {
11
11
  props;
12
12
  constructor(props) {
13
- super(enum_1.LayerType.QuadraticCurve, props);
13
+ super(enum_1.LayerType.QuadraticCurve, props || {});
14
14
  this.props = props ? props : {};
15
15
  if (!this.props.fillStyle)
16
16
  this.props.fillStyle = '#000000';
@@ -30,7 +30,7 @@ class QuadraticLayer extends BaseLayer_1.BaseLayer {
30
30
  * @param x {ScaleType} - The end `x` of the quadratic layer.
31
31
  * @param y {ScaleType} - The end `y` of the quadratic layer.
32
32
  */
33
- setEndPoint(x, y) {
33
+ setEndPosition(x, y) {
34
34
  this.props.endPoint = { x, y };
35
35
  return this;
36
36
  }
@@ -1,6 +1,6 @@
1
1
  import { BaseLayer } from "./BaseLayer";
2
- import { FontWeight, LineCap, LineJoin, TextAlign, TextBaseline, TextDirection } from "../../types/enum";
3
- import { ITextLayer, ITextLayerProps, ScaleType, ColorType } from "../../types";
2
+ import { LineCap, LineJoin } from "../../types/enum";
3
+ import { ITextLayer, ITextLayerProps, ScaleType, ColorType, AnyWeight, AnyTextAlign, AnyTextBaseline, AnyTextDirection } from "../../types";
4
4
  import { Canvas, SKRSContext2D } from "@napi-rs/canvas";
5
5
  import { LayersManager } from "../managers/LayersManager";
6
6
  export declare class TextLayer extends BaseLayer<ITextLayerProps> {
@@ -13,11 +13,15 @@ export declare class TextLayer extends BaseLayer<ITextLayerProps> {
13
13
  setText(text: string): this;
14
14
  /**
15
15
  * @description Set the font of the text layer. You can use `Geist` and `GeistMono`, or you can upload your own font from file/base64 buffer.
16
- * @param family {string} - The `family` of the font.
16
+ * @param familyOrConfig {string | { font: string; size: number; weight: AnyWeight }} - The `family` of the font. If you want to use FontsList, you can use the object config.
17
17
  * @param size {number} - The `size` of the font.
18
- * @param weight {FontWeight} - The `weight` of the font.
18
+ * @param weight {AnyWeight} - The `weight` of the font.
19
19
  */
20
- setFont(family: string, size: number, weight: FontWeight): this;
20
+ setFont(familyOrConfig: string | {
21
+ family: string;
22
+ size: number;
23
+ weight: AnyWeight;
24
+ }, size?: number, weight?: AnyWeight): this;
21
25
  /**
22
26
  * @description Set the multiline of the text layer. You can use `numbers`, `percentages`, `px`, `vw`, `vh`, `vmin`, `vmax`.
23
27
  * @param enabled {boolean} - Whether the text is multiline.
@@ -33,19 +37,19 @@ export declare class TextLayer extends BaseLayer<ITextLayerProps> {
33
37
  setColor(color: ColorType): this;
34
38
  /**
35
39
  * @description Set the align of the text layer.
36
- * @param align {TextAlign} - The `align` of the text layer.
40
+ * @param align {AnyTextAlign} - The `align` of the text layer.
37
41
  */
38
- setAlign(align: TextAlign): this;
42
+ setAlign(align: AnyTextAlign): this;
39
43
  /**
40
44
  * @description Set the baseline of the text layer.
41
- * @param baseline {TextBaseline} - The `baseline` of the text layer.
45
+ * @param baseline {AnyTextBaseline} - The `baseline` of the text layer.
42
46
  */
43
- setBaseline(baseline: TextBaseline): this;
47
+ setBaseline(baseline: AnyTextBaseline): this;
44
48
  /**
45
49
  * @description Set the direction of the text layer.
46
- * @param direction {TextDirection} - The `direction` of the text layer.
50
+ * @param direction {AnyTextDirection} - The `direction` of the text layer.
47
51
  */
48
- setDirection(direction: TextDirection): this;
52
+ setDirection(direction: AnyTextDirection): this;
49
53
  /**
50
54
  * @description Set the stroke of the layer.
51
55
  * @param width {number} - The `width` of the stroke.
@@ -10,13 +10,13 @@ const Pattern_1 = require("../helpers/Pattern");
10
10
  class TextLayer extends BaseLayer_1.BaseLayer {
11
11
  props;
12
12
  constructor(props) {
13
- super(enum_1.LayerType.Text, props);
13
+ super(enum_1.LayerType.Text, props || {});
14
14
  this.props = props ? props : {};
15
15
  this.props.align = enum_1.TextAlign.Left;
16
16
  this.props.font = {
17
17
  family: 'Geist',
18
18
  size: 16,
19
- weight: enum_1.FontWeight.Normal,
19
+ weight: enum_1.FontWeight.Regular,
20
20
  };
21
21
  this.props.fillStyle = '#ffffff';
22
22
  this.props.filled = true;
@@ -38,22 +38,29 @@ class TextLayer extends BaseLayer_1.BaseLayer {
38
38
  }
39
39
  /**
40
40
  * @description Set the font of the text layer. You can use `Geist` and `GeistMono`, or you can upload your own font from file/base64 buffer.
41
- * @param family {string} - The `family` of the font.
41
+ * @param familyOrConfig {string | { font: string; size: number; weight: AnyWeight }} - The `family` of the font. If you want to use FontsList, you can use the object config.
42
42
  * @param size {number} - The `size` of the font.
43
- * @param weight {FontWeight} - The `weight` of the font.
43
+ * @param weight {AnyWeight} - The `weight` of the font.
44
44
  */
45
- setFont(family, size, weight) {
46
- if (!family)
47
- throw new LazyUtil_1.LazyError('The family of the font must be provided');
48
- if (!size)
49
- throw new LazyUtil_1.LazyError('The size of the font must be provided');
50
- if (!weight)
51
- throw new LazyUtil_1.LazyError('The weight of the font must be provided');
52
- this.props.font = {
53
- family: family,
54
- size: size,
55
- weight: weight,
56
- };
45
+ setFont(familyOrConfig, size, weight) {
46
+ if (typeof familyOrConfig === "string") {
47
+ if (!size)
48
+ throw new LazyUtil_1.LazyError('The size of the font must be provided');
49
+ if (!weight)
50
+ throw new LazyUtil_1.LazyError('The weight of the font must be provided');
51
+ this.props.font = {
52
+ family: familyOrConfig,
53
+ size,
54
+ weight,
55
+ };
56
+ }
57
+ else {
58
+ this.props.font = {
59
+ family: familyOrConfig.family,
60
+ size: familyOrConfig.size,
61
+ weight: familyOrConfig.weight,
62
+ };
63
+ }
57
64
  return this;
58
65
  }
59
66
  /**
@@ -94,7 +101,7 @@ class TextLayer extends BaseLayer_1.BaseLayer {
94
101
  }
95
102
  /**
96
103
  * @description Set the align of the text layer.
97
- * @param align {TextAlign} - The `align` of the text layer.
104
+ * @param align {AnyTextAlign} - The `align` of the text layer.
98
105
  */
99
106
  setAlign(align) {
100
107
  this.props.align = align;
@@ -102,7 +109,7 @@ class TextLayer extends BaseLayer_1.BaseLayer {
102
109
  }
103
110
  /**
104
111
  * @description Set the baseline of the text layer.
105
- * @param baseline {TextBaseline} - The `baseline` of the text layer.
112
+ * @param baseline {AnyTextBaseline} - The `baseline` of the text layer.
106
113
  */
107
114
  setBaseline(baseline) {
108
115
  this.props.baseline = baseline;
@@ -110,7 +117,7 @@ class TextLayer extends BaseLayer_1.BaseLayer {
110
117
  }
111
118
  /**
112
119
  * @description Set the direction of the text layer.
113
- * @param direction {TextDirection} - The `direction` of the text layer.
120
+ * @param direction {AnyTextDirection} - The `direction` of the text layer.
114
121
  */
115
122
  setDirection(direction) {
116
123
  this.props.direction = direction;
@@ -1,10 +1,10 @@
1
1
  /// <reference types="node" />
2
2
  /// <reference types="node" />
3
- import { FontWeight } from "../../types/enum";
3
+ import { AnyWeight } from "../../types";
4
4
  import { IFont } from "../../types";
5
5
  export declare class Font implements IFont {
6
6
  family: string;
7
- weight: FontWeight;
7
+ weight: AnyWeight;
8
8
  path?: string;
9
9
  base64?: Buffer;
10
10
  constructor();
@@ -15,9 +15,9 @@ export declare class Font implements IFont {
15
15
  setFamily(family: string): this;
16
16
  /**
17
17
  * Set the font weight
18
- * @param weight {FontWeight} - The `weight` of the font
18
+ * @param weight {AnyWeight} - The `weight` of the font
19
19
  */
20
- setWeight(weight: FontWeight): this;
20
+ setWeight(weight: AnyWeight): this;
21
21
  /**
22
22
  * Set the path of the font
23
23
  * @param path {string} - The `path` of the font
@@ -9,7 +9,7 @@ class Font {
9
9
  base64;
10
10
  constructor() {
11
11
  this.family = "Arial";
12
- this.weight = enum_1.FontWeight.Normal;
12
+ this.weight = enum_1.FontWeight.Regular;
13
13
  }
14
14
  /**
15
15
  * Set the font family
@@ -23,7 +23,7 @@ class Font {
23
23
  }
24
24
  /**
25
25
  * Set the font weight
26
- * @param weight {FontWeight} - The `weight` of the font
26
+ * @param weight {AnyWeight} - The `weight` of the font
27
27
  */
28
28
  setWeight(weight) {
29
29
  if (!weight)
@@ -1,16 +1,15 @@
1
- import { GradientType } from "../../types/enum";
2
- import { IGradient, GradientPoint, GradientColorStop } from "../../types";
1
+ import { IGradient, GradientPoint, GradientColorStop, AnyGradientType } from "../../types";
3
2
  import { SKRSContext2D } from "@napi-rs/canvas";
4
3
  export declare class Gradient implements IGradient {
5
- type: GradientType;
4
+ type: AnyGradientType;
6
5
  points: Array<GradientPoint>;
7
6
  stops: Array<GradientColorStop>;
8
7
  constructor();
9
8
  /**
10
9
  * Set the type of the gradient
11
- * @param type {GradientType} - The `type` of the gradient. Can be `linear`, `radial`, or `conic`
10
+ * @param type {AnyGradientType} - The `type` of the gradient. Can be `linear`, `radial`, or `conic`
12
11
  */
13
- setType(type: GradientType): this;
12
+ setType(type: AnyGradientType): this;
14
13
  /**
15
14
  * Add a point to the gradient
16
15
  * @param points {GradientPoint[]} - The `points` to add to the gradient. `{ x: number, y: number }`
@@ -14,7 +14,7 @@ class Gradient {
14
14
  }
15
15
  /**
16
16
  * Set the type of the gradient
17
- * @param type {GradientType} - The `type` of the gradient. Can be `linear`, `radial`, or `conic`
17
+ * @param type {AnyGradientType} - The `type` of the gradient. Can be `linear`, `radial`, or `conic`
18
18
  */
19
19
  setType(type) {
20
20
  this.type = type;
@@ -41,12 +41,15 @@ class Gradient {
41
41
  let gradient;
42
42
  switch (gradientData.type) {
43
43
  case enum_1.GradientType.Linear:
44
+ case "linear":
44
45
  gradient = ctx.createLinearGradient(gradientData.points[0].x, gradientData.points[0].y, gradientData.points[1].x, gradientData.points[1].y);
45
46
  break;
46
47
  case enum_1.GradientType.Radial:
48
+ case "radial":
47
49
  gradient = ctx.createRadialGradient(gradientData.points[0].x, gradientData.points[0].y, (gradientData.points[0].r || 0), (gradientData.points[1].x || gradientData.points[0].x), (gradientData.points[1].y || gradientData.points[0].y), (gradientData.points[1].r || 0));
48
50
  break;
49
51
  case enum_1.GradientType.Conic:
52
+ case "conic":
50
53
  gradient = ctx.createConicGradient((gradientData.points[0].startAngle || 0), gradientData.points[0].x, gradientData.points[0].y);
51
54
  break;
52
55
  default:
@@ -1,16 +1,15 @@
1
- import { PatternType } from "../../types/enum";
2
- import { IPattern } from "../../types";
1
+ import { IPattern, AnyPatternType } from "../../types";
3
2
  import { LazyCanvas } from "../LazyCanvas";
4
3
  import { SKRSContext2D } from "@napi-rs/canvas";
5
4
  export declare class Pattern implements IPattern {
6
- type: PatternType;
5
+ type: AnyPatternType;
7
6
  src: string | LazyCanvas;
8
7
  constructor();
9
8
  /**
10
9
  * Set the type of the pattern
11
- * @param type {PatternType} - The `type` of the pattern
10
+ * @param type {AnyPatternType} - The `type` of the pattern
12
11
  */
13
- setType(type: PatternType): this;
12
+ setType(type: AnyPatternType): this;
14
13
  /**
15
14
  * Set the source of the pattern
16
15
  * @param src {string | LazyCanvas} - The `src` of the pattern
@@ -37,7 +37,7 @@ class Pattern {
37
37
  }
38
38
  /**
39
39
  * Set the type of the pattern
40
- * @param type {PatternType} - The `type` of the pattern
40
+ * @param type {AnyPatternType} - The `type` of the pattern
41
41
  */
42
42
  setType(type) {
43
43
  this.type = type;
@@ -1,4 +1,4 @@
1
- import { IFontsManager, IFonts } from "../../types";
1
+ import { IFonts, IFontsManager } from "../../types";
2
2
  import { Font } from "../helpers/Font";
3
3
  export declare class FontsManager implements IFontsManager {
4
4
  map: Map<string, Font>;
@@ -11,8 +11,7 @@ class FontsManager {
11
11
  constructor(debug = false) {
12
12
  this.debug = debug;
13
13
  this.map = new Map();
14
- let fontList = Fonts_1.Fonts;
15
- this.loadFonts(fontList);
14
+ this.loadFonts(Fonts_1.Fonts);
16
15
  }
17
16
  /**
18
17
  * Replace base fonts with custom fonts by special file.
@@ -35,10 +35,13 @@ class RenderManager {
35
35
  }
36
36
  switch (this.lazyCanvas.exportType) {
37
37
  case enum_1.Export.Buffer:
38
+ case "buffer":
38
39
  return this.lazyCanvas.canvas.toBuffer('image/png');
39
40
  case enum_1.Export.CTX:
41
+ case "ctx":
40
42
  return this.lazyCanvas.ctx;
41
43
  case enum_1.Export.SVG:
44
+ case "svg":
42
45
  // @ts-ignore
43
46
  return this.lazyCanvas.canvas.getContent().toString('utf8');
44
47
  default:
@@ -2,7 +2,7 @@ import { Canvas, SKRSContext2D } from "@napi-rs/canvas";
2
2
  import { LayersManager } from "../structures/managers/LayersManager";
3
3
  import { RenderManager } from "../structures/managers/RenderManager";
4
4
  import { FontsManager } from "../structures/managers/FontsManager";
5
- import { Export } from "./enum";
5
+ import { AnyExport } from "../";
6
6
 
7
7
  export interface ILazyCanvas {
8
8
  width: number;
@@ -12,5 +12,5 @@ export interface ILazyCanvas {
12
12
  layers: LayersManager;
13
13
  render: RenderManager;
14
14
  fonts: FontsManager;
15
- exportType: Export;
15
+ exportType: AnyExport;
16
16
  }
@@ -1,5 +1,5 @@
1
- import { ColorType, ScaleType } from "../";
2
- import { Centring, LayerType } from "../enum";
1
+ import { ColorType, ScaleType, AnyCentring } from "../";
2
+ import { LayerType } from "../enum";
3
3
 
4
4
  export interface IBaseLayer {
5
5
  id: string;
@@ -12,7 +12,7 @@ export interface IBaseLayer {
12
12
  export interface IBaseLayerProps {
13
13
  x: ScaleType;
14
14
  y: ScaleType;
15
- centring: Centring;
15
+ centring: AnyCentring;
16
16
  filter: string;
17
17
  opacity: number;
18
18
  filled: boolean;
@@ -1,6 +1,8 @@
1
+ import { AnyLayer } from "../";
2
+
1
3
  export interface IGroup {
2
4
  id: string;
3
5
  visible: boolean;
4
6
  zIndex: number;
5
- components: Array<any>;
7
+ components: Array<AnyLayer>;
6
8
  }
@@ -0,0 +1,12 @@
1
+ import { IBaseLayer, IBaseLayerProps, ScaleType } from "../";
2
+
3
+ export interface ILineLayer extends IBaseLayer {
4
+ props: ILineLayerProps;
5
+ }
6
+
7
+ export interface ILineLayerProps extends IBaseLayerProps {
8
+ endPoint: {
9
+ x: ScaleType,
10
+ y: ScaleType
11
+ }
12
+ }
@@ -1,5 +1,5 @@
1
1
  import { IBaseLayer, IBaseLayerProps } from "./BaseLayer";
2
- import {ColorType, ScaleType} from "../";
2
+ import { ScaleType } from "../";
3
3
 
4
4
  export interface IMorphLayer extends IBaseLayer {
5
5
  props: IMorphLayerProps;
@@ -1,6 +1,5 @@
1
- import { ColorType, ScaleType } from "../";
1
+ import { AnyWeight, ScaleType, AnyTextAlign, AnyTextBaseline, AnyTextDirection } from "../";
2
2
  import { IBaseLayer, IBaseLayerProps } from "./BaseLayer";
3
- import { FontWeight, TextAlign, TextBaseline, TextDirection } from "../enum";
4
3
 
5
4
  export interface ITextLayer extends IBaseLayer {
6
5
  props: ITextLayerProps;
@@ -11,7 +10,7 @@ export interface ITextLayerProps extends IBaseLayerProps {
11
10
  font: {
12
11
  family: string;
13
12
  size: number;
14
- weight: FontWeight;
13
+ weight: AnyWeight;
15
14
  };
16
15
  multiline: {
17
16
  enabled: boolean;
@@ -19,7 +18,7 @@ export interface ITextLayerProps extends IBaseLayerProps {
19
18
  height: ScaleType;
20
19
  spacing?: number;
21
20
  };
22
- align: TextAlign;
23
- baseline: TextBaseline;
24
- direction: TextDirection;
21
+ align: AnyTextAlign;
22
+ baseline: AnyTextBaseline;
23
+ direction: AnyTextDirection;
25
24
  }
@@ -27,7 +27,7 @@ export declare enum FontWeight {
27
27
  Thin = 100,
28
28
  ExtraLight = 200,
29
29
  Light = 300,
30
- Normal = 400,
30
+ Regular = 400,
31
31
  Medium = 500,
32
32
  SemiBold = 600,
33
33
  Bold = 700,
@@ -34,7 +34,7 @@ var FontWeight;
34
34
  FontWeight[FontWeight["Thin"] = 100] = "Thin";
35
35
  FontWeight[FontWeight["ExtraLight"] = 200] = "ExtraLight";
36
36
  FontWeight[FontWeight["Light"] = 300] = "Light";
37
- FontWeight[FontWeight["Normal"] = 400] = "Normal";
37
+ FontWeight[FontWeight["Regular"] = 400] = "Regular";
38
38
  FontWeight[FontWeight["Medium"] = 500] = "Medium";
39
39
  FontWeight[FontWeight["SemiBold"] = 600] = "SemiBold";
40
40
  FontWeight[FontWeight["Bold"] = 700] = "Bold";
@@ -1,8 +1,8 @@
1
- import { FontWeight } from "../enum";
1
+ import { AnyWeight } from "../";
2
2
 
3
3
  export interface IFont {
4
4
  family: string;
5
- weight: FontWeight;
5
+ weight: AnyWeight;
6
6
  path?: string;
7
7
  base64?: Buffer;
8
8
  }
@@ -1,7 +1,7 @@
1
- import { GradientType } from "../enum";
1
+ import { AnyGradientType } from "../";
2
2
 
3
3
  export interface IGradient {
4
- type: GradientType;
4
+ type: AnyGradientType;
5
5
  points: Array<GradientPoint>;
6
6
  stops: Array<GradientColorStop>;
7
7
  }
@@ -1,7 +1,7 @@
1
1
  import { LazyCanvas } from '../../';
2
- import { PatternType } from '../enum';
2
+ import { AnyPatternType } from "../";
3
3
 
4
4
  export interface IPattern {
5
- type: PatternType;
5
+ type: AnyPatternType;
6
6
  src: string | LazyCanvas;
7
7
  }
@@ -5,6 +5,7 @@ export * from "./components/ImageLayer";
5
5
  export * from "./components/MorphLayer";
6
6
  export * from "./components/BezierLayer";
7
7
  export * from "./components/QuadraticLayer";
8
+ export * from "./components/LineLayer";
8
9
  export * from "./components/Group";
9
10
  export * from "./helpers/Font";
10
11
  export * from "./helpers/Gradient";
@@ -5,13 +5,37 @@ import { ImageLayer } from "../structures/components/ImageLayer";
5
5
  import { TextLayer } from "../structures/components/TextLayer";
6
6
  import { BezierLayer } from "../structures/components/BezierLayer";
7
7
  import { QuadraticLayer } from "../structures/components/QuadraticLayer";
8
+ import { LineLayer } from "../structures/components/LineLayer";
8
9
  import { Group } from "../structures/components/Group";
10
+ import { FontWeight, GradientType, TextAlign, TextBaseline, TextDirection, LineCap, LineJoin, Export, Centring, PatternType, SaveFormat } from "./enum";
9
11
 
10
12
  export type ScaleType = string | number | 'vw' | 'vh' | 'vmin' | 'vmax';
11
13
 
12
14
  export type ColorType = string | Gradient | Pattern;
13
15
 
14
- export type AnyLayer = MorphLayer | ImageLayer | TextLayer | BezierLayer | QuadraticLayer | Group;
16
+ export type AnyLayer = MorphLayer | ImageLayer | TextLayer | BezierLayer | QuadraticLayer | LineLayer | Group;
17
+
18
+ export type AnyWeight = FontWeight | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 950;
19
+
20
+ export type AnyGradientType = GradientType | 'linear' | 'radial' | 'conic';
21
+
22
+ export type AnyTextAlign = TextAlign | 'left' | 'right' | 'center' | 'start' | 'end';
23
+
24
+ export type AnyTextBaseline = TextBaseline | 'top' | 'hanging' | 'middle' | 'alphabetic' | 'ideographic' | 'bottom';
25
+
26
+ export type AnyTextDirection = TextDirection | 'ltr' | 'rtl' | 'inherit';
27
+
28
+ export type AnyLineCap = LineCap | 'butt' | 'round' | 'square';
29
+
30
+ export type AnyLineJoin = LineJoin | 'bevel' | 'round' | 'miter';
31
+
32
+ export type AnyExport = Export | 'buffer' | 'svg' | 'ctx';
33
+
34
+ export type AnyCentring = Centring | 'start' | 'start-top' | 'start-bottom' | 'center' | 'center-top' | 'center-bottom' | 'end' | 'end-top' | 'end-bottom' | 'none';
35
+
36
+ export type AnyPatternType = PatternType | 'repeat' | 'repeat-x' | 'repeat-y' | 'no-repeat';
37
+
38
+ export type AnySaveFormat = SaveFormat | 'png' | 'jpeg' | 'jpg' | 'svg';
15
39
 
16
40
  export type Point = {
17
41
  x: ScaleType;
@@ -1,5 +1,5 @@
1
- import { Centring, LayerType, SaveFormat, TextAlign } from "../types/enum";
2
- import { Transform, ScaleType, ColorType, PointNumber } from "../types";
1
+ import { LayerType, SaveFormat } from "../types/enum";
2
+ import { Transform, ScaleType, ColorType, PointNumber, AnyCentring, AnyTextAlign } from "../types";
3
3
  import { Gradient } from "../structures/helpers/Gradient";
4
4
  import { Canvas, SKRSContext2D } from "@napi-rs/canvas";
5
5
  import { Pattern } from "../structures/helpers/Pattern";
@@ -27,14 +27,14 @@ export declare function transform(ctx: SKRSContext2D, transform: Transform, laye
27
27
  type: LayerType;
28
28
  }, extra?: {
29
29
  text: string;
30
- textAlign: TextAlign;
30
+ textAlign: AnyTextAlign;
31
31
  fontSize: number;
32
32
  multiline: boolean;
33
33
  }): void;
34
34
  export declare function saveFile(buffer: any, extension: SaveFormat, name: string): Promise<void>;
35
35
  export declare function generateRandomName(): string;
36
36
  export declare function isImageUrlValid(src: string): boolean;
37
- export declare function centring(centring: Centring, type: LayerType, width: number, height: number, x: number, y: number): {
37
+ export declare function centring(centring: AnyCentring, type: LayerType, width: number, height: number, x: number, y: number): {
38
38
  x: number;
39
39
  y: number;
40
40
  };
@@ -202,6 +202,7 @@ function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, ty
202
202
  case enum_1.LayerType.Morph:
203
203
  case enum_1.LayerType.BezierCurve:
204
204
  case enum_1.LayerType.QuadraticCurve:
205
+ case enum_1.LayerType.Line:
205
206
  ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
206
207
  ctx.rotate((Math.PI / 180) * transform.rotate);
207
208
  ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
@@ -268,6 +269,7 @@ exports.isImageUrlValid = isImageUrlValid;
268
269
  function centring(centring, type, width, height, x, y) {
269
270
  switch (centring) {
270
271
  case enum_1.Centring.Center:
272
+ case "center":
271
273
  switch (type) {
272
274
  case enum_1.LayerType.Image:
273
275
  case enum_1.LayerType.Morph:
@@ -277,6 +279,7 @@ function centring(centring, type, width, height, x, y) {
277
279
  }
278
280
  return { x, y };
279
281
  case enum_1.Centring.CenterBottom:
282
+ case "center-bottom":
280
283
  switch (type) {
281
284
  case enum_1.LayerType.Image:
282
285
  case enum_1.LayerType.Morph:
@@ -285,6 +288,7 @@ function centring(centring, type, width, height, x, y) {
285
288
  }
286
289
  return { x, y };
287
290
  case enum_1.Centring.CenterTop:
291
+ case "center-top":
288
292
  switch (type) {
289
293
  case enum_1.LayerType.Image:
290
294
  case enum_1.LayerType.Morph:
@@ -294,6 +298,7 @@ function centring(centring, type, width, height, x, y) {
294
298
  }
295
299
  return { x, y };
296
300
  case enum_1.Centring.Start:
301
+ case "start":
297
302
  switch (type) {
298
303
  case enum_1.LayerType.Image:
299
304
  case enum_1.LayerType.Morph:
@@ -302,8 +307,10 @@ function centring(centring, type, width, height, x, y) {
302
307
  }
303
308
  return { x, y };
304
309
  case enum_1.Centring.StartBottom:
310
+ case "start-bottom":
305
311
  return { x, y };
306
312
  case enum_1.Centring.StartTop:
313
+ case "start-top":
307
314
  switch (type) {
308
315
  case enum_1.LayerType.Image:
309
316
  case enum_1.LayerType.Morph:
@@ -312,6 +319,7 @@ function centring(centring, type, width, height, x, y) {
312
319
  }
313
320
  return { x, y };
314
321
  case enum_1.Centring.End:
322
+ case "end":
315
323
  switch (type) {
316
324
  case enum_1.LayerType.Image:
317
325
  case enum_1.LayerType.Morph:
@@ -321,6 +329,7 @@ function centring(centring, type, width, height, x, y) {
321
329
  }
322
330
  return { x, y };
323
331
  case enum_1.Centring.EndBottom:
332
+ case "end-bottom":
324
333
  switch (type) {
325
334
  case enum_1.LayerType.Image:
326
335
  case enum_1.LayerType.Morph:
@@ -329,6 +338,7 @@ function centring(centring, type, width, height, x, y) {
329
338
  }
330
339
  return { x, y };
331
340
  case enum_1.Centring.EndTop:
341
+ case "end-top":
332
342
  switch (type) {
333
343
  case enum_1.LayerType.Image:
334
344
  case enum_1.LayerType.Morph:
@@ -338,6 +348,7 @@ function centring(centring, type, width, height, x, y) {
338
348
  }
339
349
  return { x, y };
340
350
  case enum_1.Centring.None:
351
+ case "none":
341
352
  return { x, y };
342
353
  }
343
354
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nmmty/lazycanvas",
3
- "version": "0.3.1",
3
+ "version": "0.3.3",
4
4
  "description": "A simple way to interact with @napi-rs/canvas in an advanced way!",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -10,6 +10,7 @@
10
10
  "logo": "tsc ./test/logo.ts && node ./test/logo.js",
11
11
  "text": "tsc ./test/text.ts && node ./test/text.js",
12
12
  "doc": "tsx docgen.ts",
13
+ "font": "tsc ./scripts/font-gen.ts && node ./scripts/font-gen.js",
13
14
  "build": "tsc"
14
15
  },
15
16
  "repository": {
@@ -30,12 +31,13 @@
30
31
  },
31
32
  "homepage": "https://github.com/NMMTY/LazyCanvas#readme",
32
33
  "dependencies": {
33
- "@napi-rs/canvas": "^0.1.65",
34
+ "@napi-rs/canvas": "^0.1.68",
34
35
  "jimp": "0.22.12",
35
36
  "path": "^0.12.7",
36
37
  "svgson": "^5.3.1"
37
38
  },
38
39
  "devDependencies": {
40
+ "@hitomihiumi/colors.ts": "^1.0.3",
39
41
  "@hitomihiumi/micro-docgen": "^0.3.0",
40
42
  "@types/jimp": "^0.2.28",
41
43
  "@types/node": "^22.10.2",