@napi-rs/canvas 0.1.26 → 0.1.29

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 (6) hide show
  1. package/README.md +7 -3
  2. package/index.d.ts +4 -1
  3. package/index.js +18 -178
  4. package/js-binding.js +12 -4
  5. package/load-image.js +9 -2
  6. package/package.json +30 -28
package/README.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # `skr canvas`
2
2
 
3
3
  ![CI](https://github.com/Brooooooklyn/canvas/workflows/CI/badge.svg)
4
- ![Skia Version](https://img.shields.io/badge/Skia-chrome%2Fm105-hotpink)
4
+ ![Skia Version](https://img.shields.io/badge/Skia-chrome%2Fm106-hotpink)
5
5
  [![install size](https://packagephobia.com/badge?p=@napi-rs/canvas)](https://packagephobia.com/result?p=@napi-rs/canvas)
6
6
  [![Downloads](https://img.shields.io/npm/dm/@napi-rs/canvas.svg?sanitize=true)](https://npmcharts.com/compare/@napi-rs/canvas?minimal=true)
7
7
 
@@ -41,12 +41,16 @@ npm install @napi-rs/canvas
41
41
 
42
42
  [**_cortex-a57_**](https://en.wikipedia.org/wiki/ARM_Cortex-A57) or newer CPU architecture on **Linux**.
43
43
 
44
- All `m` chips on **macOS**.
44
+ All Apple M chips on **macOS**.
45
45
 
46
46
  ### `armv7`
47
47
 
48
48
  [**_cortex-a7_**](https://en.wikipedia.org/wiki/ARM_Cortex-A7) or newer CPU architecture.
49
49
 
50
+ ### glibc
51
+
52
+ Since Skia relies on the [glibc](https://www.gnu.org/software/libc/) 2.18 API, you need to have at least glibc version >= 2.18 on your system.
53
+
50
54
  # Usage
51
55
 
52
56
  ```js
@@ -76,7 +80,7 @@ ctx.closePath()
76
80
  ctx.stroke()
77
81
 
78
82
  async function main() {
79
- const pngData = await canvas.encode('png') // JPEG and WebP is also supported
83
+ const pngData = await canvas.encode('png') // JPEG, AVIF and WebP are also supported
80
84
  // encoding in libuv thread pool, non-blocking
81
85
  await promises.writeFile(join(__dirname, 'simple.png'), pngData)
82
86
  }
package/index.d.ts CHANGED
@@ -1,5 +1,8 @@
1
1
  /// <reference lib="dom" />
2
2
 
3
+ // Clear all type of caches in Skia
4
+ export function clearAllCache(): void
5
+
3
6
  export interface DOMMatrix2DInit {
4
7
  a: number
5
8
  b: number
@@ -360,7 +363,7 @@ export enum PathOp {
360
363
  Difference = 0, // subtract the op path from the first path
361
364
  Intersect = 1, // intersect the two paths
362
365
  Union = 2, // union (inclusive-or) the two paths
363
- XOR = 3, // exclusive-or the two paths
366
+ Xor = 3, // exclusive-or the two paths
364
367
  ReverseDifference = 4, // subtract the first path from the op path
365
368
  }
366
369
 
package/index.js CHANGED
@@ -2,209 +2,53 @@ const { platform, homedir } = require('os')
2
2
  const { join } = require('path')
3
3
 
4
4
  const {
5
+ clearAllCache,
5
6
  CanvasRenderingContext2D,
6
7
  CanvasElement,
7
- createContext,
8
8
  SVGCanvas,
9
9
  Path2D,
10
10
  ImageData,
11
11
  Image,
12
12
  CanvasPattern,
13
13
  GlobalFonts,
14
- convertSVGTextToPath: _convertSVGTextToPath,
14
+ PathOp,
15
+ FillType,
16
+ StrokeJoin,
17
+ StrokeCap,
18
+ convertSVGTextToPath,
15
19
  } = require('./js-binding')
16
20
 
17
21
  const { DOMPoint, DOMMatrix, DOMRect } = require('./geometry')
18
22
 
19
23
  const loadImage = require('./load-image')
20
24
 
21
- const StrokeJoin = {
22
- Miter: 0,
23
- Round: 1,
24
- Bevel: 2,
25
- }
26
-
27
- const StrokeCap = {
28
- Butt: 0,
29
- Round: 1,
30
- Square: 2,
31
- }
32
-
33
- const PathOp = {
34
- Difference: 0, // subtract the op path from the first path
35
- Intersect: 1, // intersect the two paths
36
- Union: 2, // union (inclusive-or) the two paths
37
- XOR: 3, // exclusive-or the two paths
38
- ReverseDifference: 4, // subtract the first path from the op path
39
- }
40
-
41
- const FillType = {
42
- Winding: 0,
43
- EvenOdd: 1,
44
- InverseWinding: 2,
45
- InverseEvenOdd: 3,
46
- }
47
-
48
25
  const SvgExportFlag = {
49
26
  ConvertTextToPaths: 0x01,
50
27
  NoPrettyXML: 0x02,
51
28
  RelativePathEncoding: 0x04,
52
29
  }
53
30
 
54
- const GlobalFontsSingleton = new GlobalFonts()
55
- let FamilyNamesSet = JSON.parse(GlobalFontsSingleton._families)
56
-
57
31
  // eslint-disable-next-line sonarjs/no-unused-collection
58
32
  const Fonts = []
59
33
 
60
- Object.defineProperty(GlobalFontsSingleton, 'register', {
61
- value: function register(fontData, nameAlias = '') {
62
- const result = GlobalFontsSingleton._register(fontData, nameAlias)
63
- FamilyNamesSet = JSON.parse(GlobalFontsSingleton._families)
64
- Fonts.push(fontData)
65
- return result
66
- },
67
- configurable: false,
68
- enumerable: false,
69
- writable: false,
70
- })
71
-
72
- Object.defineProperty(GlobalFontsSingleton, 'registerFromPath', {
73
- value: function registerFromPath(path, nameAlias = '') {
74
- const result = GlobalFontsSingleton._registerFromPath(path, nameAlias)
75
- FamilyNamesSet = JSON.parse(GlobalFontsSingleton._families)
76
- return result
77
- },
78
- configurable: false,
79
- enumerable: false,
80
- writable: false,
81
- })
82
-
83
- Object.defineProperty(GlobalFontsSingleton, 'loadFontsFromDir', {
84
- value: function loadFontsFromDir(path) {
85
- const result = GlobalFontsSingleton._loadFontsFromDir(path)
86
- FamilyNamesSet = JSON.parse(GlobalFontsSingleton._families)
87
- return result
88
- },
89
- configurable: false,
90
- enumerable: false,
91
- writable: false,
92
- })
93
-
94
- Object.defineProperty(GlobalFontsSingleton, 'families', {
34
+ Object.defineProperty(GlobalFonts, 'families', {
95
35
  get: function () {
96
- return FamilyNamesSet
36
+ return JSON.parse(GlobalFonts.getFamilies())
97
37
  },
98
38
  })
99
39
 
100
- Object.defineProperty(GlobalFontsSingleton, 'has', {
40
+ Object.defineProperty(GlobalFonts, 'has', {
101
41
  value: function has(name) {
102
- return !!FamilyNamesSet.find(({ family }) => family === name)
42
+ return !!JSON.parse(GlobalFonts.getFamilies()).find(({ family }) => family === name)
103
43
  },
104
44
  configurable: false,
105
45
  enumerable: false,
106
46
  writable: false,
107
47
  })
108
48
 
109
- CanvasRenderingContext2D.prototype.createPattern = function createPattern(image, repetition) {
110
- if (image instanceof ImageData) {
111
- const pattern = new CanvasPattern(image, repetition, 0)
112
- Object.defineProperty(pattern, '_imageData', {
113
- writable: true,
114
- configurable: false,
115
- enumerable: false,
116
- value: null,
117
- })
118
- return pattern
119
- } else if (image instanceof Image) {
120
- return new CanvasPattern(image, repetition, 1)
121
- } else if (image instanceof CanvasElement || image instanceof SVGCanvas) {
122
- return new CanvasPattern(image, repetition, 2)
123
- }
124
- throw TypeError('Image should be instance of ImageData or Image')
125
- }
126
-
127
- CanvasRenderingContext2D.prototype.getImageData = function getImageData(x, y, w, h) {
128
- const data = this._getImageData(x, y, w, h)
129
- return new ImageData(data, w, h)
130
- }
131
-
132
- Path2D.prototype.stroke = function stroke(strokeOptions = {}) {
133
- const width = typeof strokeOptions.width === 'undefined' ? 1 : strokeOptions.width
134
- const miterLimit = typeof strokeOptions.miterLimit === 'undefined' ? 4 : strokeOptions.miterLimit
135
- const join = typeof strokeOptions.join === 'undefined' ? StrokeJoin.Miter : strokeOptions.join
136
- const cap = typeof strokeOptions.cap === 'undefined' ? StrokeCap.Butt : strokeOptions.cap
137
-
138
- return this._stroke(width, miterLimit, join, cap)
139
- }
140
-
141
- Path2D.prototype.getFillTypeString = function getFillTypeString() {
142
- const fillType = this.getFillType()
143
-
144
- if (fillType === FillType.Winding) {
145
- return 'nonzero'
146
- } else if (fillType === FillType.EvenOdd) {
147
- return 'evenodd'
148
- } else {
149
- return 'nonzero' // default
150
- }
151
- }
152
-
153
49
  function createCanvas(width, height, flag) {
154
50
  const isSvgBackend = typeof flag !== 'undefined'
155
- const canvasElement = isSvgBackend ? new SVGCanvas(width, height) : new CanvasElement(width, height)
156
-
157
- let ctx
158
- canvasElement.getContext = function getContext(type, attr = {}) {
159
- if (type !== '2d') {
160
- throw new Error('Unsupported type')
161
- }
162
- const attrs = { alpha: true, colorSpace: 'srgb', ...attr }
163
- ctx = ctx
164
- ? ctx
165
- : isSvgBackend
166
- ? new CanvasRenderingContext2D(this.width, this.height, GlobalFontsSingleton, attrs.colorSpace, flag)
167
- : new CanvasRenderingContext2D(this.width, this.height, GlobalFontsSingleton, attrs.colorSpace)
168
- createContext(ctx, this.width, this.height, attrs)
169
-
170
- // napi can not define writable: true but enumerable: false property
171
- Object.defineProperty(ctx, '_fillStyle', {
172
- value: '#000',
173
- configurable: false,
174
- enumerable: false,
175
- writable: true,
176
- })
177
-
178
- Object.defineProperty(ctx, '_strokeStyle', {
179
- value: '#000',
180
- configurable: false,
181
- enumerable: false,
182
- writable: true,
183
- })
184
-
185
- Object.defineProperty(ctx, 'createImageData', {
186
- value: function createImageData(widthOrImage, height, attrs = {}) {
187
- if (widthOrImage instanceof ImageData) {
188
- return new ImageData(widthOrImage.data, widthOrImage.width, widthOrImage.height)
189
- }
190
- return new ImageData(widthOrImage, height, { colorSpace: 'srgb', ...attrs })
191
- },
192
- configurable: true,
193
- enumerable: false,
194
- writable: true,
195
- })
196
-
197
- Object.defineProperty(canvasElement, 'ctx', {
198
- value: ctx,
199
- enumerable: false,
200
- configurable: false,
201
- })
202
-
203
- ctx.canvas = canvasElement
204
-
205
- return ctx
206
- }
207
-
51
+ const canvasElement = isSvgBackend ? new SVGCanvas(width, height, flag) : new CanvasElement(width, height)
208
52
  const {
209
53
  encode: canvasEncode,
210
54
  encodeSync: canvasEncodeSync,
@@ -258,29 +102,25 @@ class Canvas {
258
102
  }
259
103
 
260
104
  if (!process.env.DISABLE_SYSTEM_FONTS_LOAD) {
261
- GlobalFontsSingleton.loadSystemFonts()
105
+ GlobalFonts.loadSystemFonts()
262
106
  const platformName = platform()
263
107
  const homedirPath = homedir()
264
108
  switch (platformName) {
265
109
  case 'win32':
266
- GlobalFontsSingleton.loadFontsFromDir(join(homedirPath, 'AppData', 'Local', 'Microsoft', 'Windows', 'Fonts'))
110
+ GlobalFonts.loadFontsFromDir(join(homedirPath, 'AppData', 'Local', 'Microsoft', 'Windows', 'Fonts'))
267
111
  break
268
112
  case 'darwin':
269
- GlobalFontsSingleton.loadFontsFromDir(join(homedirPath, 'Library', 'Fonts'))
113
+ GlobalFonts.loadFontsFromDir(join(homedirPath, 'Library', 'Fonts'))
270
114
  break
271
115
  case 'linux':
272
- GlobalFontsSingleton.loadFontsFromDir(join('usr', 'local', 'share', 'fonts'))
273
- GlobalFontsSingleton.loadFontsFromDir(join(homedirPath, '.fonts'))
116
+ GlobalFonts.loadFontsFromDir(join('usr', 'local', 'share', 'fonts'))
117
+ GlobalFonts.loadFontsFromDir(join(homedirPath, '.fonts'))
274
118
  break
275
119
  }
276
- FamilyNamesSet = JSON.parse(GlobalFontsSingleton._families)
277
- }
278
-
279
- function convertSVGTextToPath(input) {
280
- return _convertSVGTextToPath(Buffer.isBuffer(input) ? input : Buffer.from(input), GlobalFontsSingleton)
281
120
  }
282
121
 
283
122
  module.exports = {
123
+ clearAllCache,
284
124
  Canvas,
285
125
  createCanvas,
286
126
  Path2D,
@@ -291,7 +131,7 @@ module.exports = {
291
131
  StrokeCap,
292
132
  StrokeJoin,
293
133
  SvgExportFlag,
294
- GlobalFonts: GlobalFontsSingleton,
134
+ GlobalFonts: GlobalFonts,
295
135
  convertSVGTextToPath,
296
136
  DOMPoint,
297
137
  DOMMatrix,
package/js-binding.js CHANGED
@@ -196,25 +196,33 @@ if (!nativeBinding) {
196
196
  }
197
197
 
198
198
  const {
199
+ clearAllCache,
199
200
  CanvasRenderingContext2D,
200
201
  CanvasElement,
201
- createContext,
202
202
  SVGCanvas,
203
- Path2D,
203
+ Path,
204
204
  ImageData,
205
205
  Image,
206
206
  CanvasPattern,
207
207
  GlobalFonts,
208
208
  convertSVGTextToPath,
209
+ PathOp,
210
+ FillType,
211
+ StrokeJoin,
212
+ StrokeCap,
209
213
  } = nativeBinding
210
214
 
215
+ module.exports.clearAllCache = clearAllCache
211
216
  module.exports.CanvasRenderingContext2D = CanvasRenderingContext2D
212
217
  module.exports.CanvasElement = CanvasElement
213
- module.exports.createContext = createContext
214
218
  module.exports.SVGCanvas = SVGCanvas
215
- module.exports.Path2D = Path2D
219
+ module.exports.Path2D = Path
216
220
  module.exports.ImageData = ImageData
217
221
  module.exports.Image = Image
218
222
  module.exports.CanvasPattern = CanvasPattern
219
223
  module.exports.GlobalFonts = GlobalFonts
220
224
  module.exports.convertSVGTextToPath = convertSVGTextToPath
225
+ module.exports.PathOp = PathOp
226
+ module.exports.FillType = FillType
227
+ module.exports.StrokeJoin = StrokeJoin
228
+ module.exports.StrokeCap = StrokeCap
package/load-image.js CHANGED
@@ -39,7 +39,13 @@ module.exports = async function loadImage(source, options = {}) {
39
39
  source = !(source instanceof URL) ? new URL(source) : source
40
40
  // attempt to download the remote source and construct image
41
41
  const data = await new Promise((resolve, reject) =>
42
- makeRequest(source, resolve, reject, options.maxRedirects ?? MAX_REDIRECTS, options.requestOptions),
42
+ makeRequest(
43
+ source,
44
+ resolve,
45
+ reject,
46
+ typeof options.maxRedirects === 'number' && options.maxRedirects >= 0 ? options.maxRedirects : MAX_REDIRECTS,
47
+ options.requestOptions,
48
+ ),
43
49
  )
44
50
  return createImage(data, options.alt)
45
51
  }
@@ -54,7 +60,7 @@ function makeRequest(url, resolve, reject, redirectCount, requestOptions) {
54
60
  // lazy load the lib
55
61
  const lib = isHttps ? (!https ? (https = require('https')) : https) : !http ? (http = require('http')) : http
56
62
 
57
- lib.get(url, requestOptions ?? {}, (res) => {
63
+ lib.get(url, requestOptions || {}, (res) => {
58
64
  const shouldRedirect = REDIRECT_STATUSES.has(res.statusCode) && typeof res.headers.location === 'string'
59
65
  if (shouldRedirect && redirectCount > 0)
60
66
  return makeRequest(new URL(res.headers.location), resolve, reject, redirectCount - 1, requestOptions)
@@ -86,6 +92,7 @@ function createImage(src, alt) {
86
92
 
87
93
  function isBufferLike(src) {
88
94
  return (
95
+ (src && src.type === 'Buffer') ||
89
96
  Array.isArray(src) ||
90
97
  src instanceof ArrayBuffer ||
91
98
  src instanceof SharedArrayBuffer ||
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@napi-rs/canvas",
3
- "version": "0.1.26",
3
+ "version": "0.1.29",
4
4
  "description": "Canvas for Node.js with skia backend",
5
5
  "main": "index.js",
6
6
  "repository": "https://github.com/Brooooooklyn/canvas.git",
@@ -65,34 +65,36 @@
65
65
  "@jimp/custom": "^0.16.1",
66
66
  "@jimp/jpeg": "^0.16.1",
67
67
  "@jimp/png": "^0.16.1",
68
- "@napi-rs/cli": "^2.9.0",
69
- "@octokit/rest": "^19.0.0",
68
+ "@napi-rs/cli": "^2.11.4",
69
+ "@octokit/rest": "^19.0.4",
70
70
  "@swc-node/register": "^1.5.1",
71
- "@types/lodash": "^4.14.182",
72
- "@types/node": "^17.0.35",
73
- "@typescript-eslint/eslint-plugin": "^5.26.0",
74
- "@typescript-eslint/parser": "^5.26.0",
75
- "ava": "^4.2.0",
71
+ "@types/lodash": "^4.14.184",
72
+ "@types/node": "^18.7.13",
73
+ "@typescript-eslint/eslint-plugin": "^5.35.1",
74
+ "@typescript-eslint/parser": "^5.35.1",
75
+ "ava": "^4.3.3",
76
76
  "benny": "^3.7.1",
77
- "canvas": "^2.9.1",
78
- "canvaskit-wasm": "^0.35.0",
79
- "colorette": "^2.0.16",
77
+ "canvas": "^2.9.3",
78
+ "canvaskit-wasm": "^0.36.1",
79
+ "colorette": "^2.0.19",
80
80
  "conventional-changelog-cli": "^2.2.2",
81
- "echarts": "^5.3.2",
82
- "eslint": "^8.16.0",
81
+ "echarts": "^5.3.3",
82
+ "eslint": "^8.22.0",
83
83
  "eslint-config-prettier": "^8.5.0",
84
84
  "eslint-plugin-import": "^2.26.0",
85
- "eslint-plugin-prettier": "^4.0.0",
86
- "eslint-plugin-sonarjs": "^0.14.0",
85
+ "eslint-plugin-prettier": "^4.2.1",
86
+ "eslint-plugin-sonarjs": "^0.15.0",
87
87
  "husky": "^8.0.1",
88
- "lint-staged": "^13.0.0",
88
+ "lint-staged": "^13.0.3",
89
89
  "lodash": "^4.17.21",
90
90
  "npm-run-all": "^4.1.5",
91
91
  "pinst": "^3.0.0",
92
92
  "png.js": "^0.2.1",
93
- "prettier": "^2.6.2",
93
+ "prettier": "^2.7.1",
94
+ "pretty-bytes": "^6.0.0",
94
95
  "skia-canvas": "^1.0.0",
95
- "typescript": "^4.7.2"
96
+ "table": "^6.8.0",
97
+ "typescript": "^4.7.4"
96
98
  },
97
99
  "lint-staged": {
98
100
  "*.@(js|ts|tsx|yml|yaml|md|json|html)": [
@@ -128,16 +130,16 @@
128
130
  "singleQuote": true,
129
131
  "arrowParens": "always"
130
132
  },
131
- "packageManager": "yarn@3.2.2",
133
+ "packageManager": "yarn@3.2.3",
132
134
  "optionalDependencies": {
133
- "@napi-rs/canvas-win32-x64-msvc": "0.1.26",
134
- "@napi-rs/canvas-darwin-x64": "0.1.26",
135
- "@napi-rs/canvas-linux-x64-gnu": "0.1.26",
136
- "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.26",
137
- "@napi-rs/canvas-linux-x64-musl": "0.1.26",
138
- "@napi-rs/canvas-linux-arm64-gnu": "0.1.26",
139
- "@napi-rs/canvas-linux-arm64-musl": "0.1.26",
140
- "@napi-rs/canvas-darwin-arm64": "0.1.26",
141
- "@napi-rs/canvas-android-arm64": "0.1.26"
135
+ "@napi-rs/canvas-win32-x64-msvc": "0.1.29",
136
+ "@napi-rs/canvas-darwin-x64": "0.1.29",
137
+ "@napi-rs/canvas-linux-x64-gnu": "0.1.29",
138
+ "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.29",
139
+ "@napi-rs/canvas-linux-x64-musl": "0.1.29",
140
+ "@napi-rs/canvas-linux-arm64-gnu": "0.1.29",
141
+ "@napi-rs/canvas-linux-arm64-musl": "0.1.29",
142
+ "@napi-rs/canvas-darwin-arm64": "0.1.29",
143
+ "@napi-rs/canvas-android-arm64": "0.1.29"
142
144
  }
143
145
  }