koishi-plugin-vercel-satori-png-service 0.1.5 → 0.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/Satori.d.ts +38 -0
- package/lib/index.d.ts +37 -0
- package/lib/index.js +46 -11
- package/lib/og.d.ts +1 -0
- package/package.json +4 -3
package/lib/Satori.d.ts
CHANGED
|
@@ -1,5 +1,43 @@
|
|
|
1
1
|
import { Readable } from "node:stream";
|
|
2
|
+
import * as resvg from "@resvg/resvg-wasm";
|
|
2
3
|
import { ReactElement } from "react";
|
|
3
4
|
import { ImageOptions } from "./og";
|
|
4
5
|
export declare const initSatori: () => Promise<void>;
|
|
5
6
|
export declare const createNodejsStream: (element: ReactElement<any, any>, options: ImageOptions) => Promise<Readable>;
|
|
7
|
+
export declare const renderSvg: (element: ReactElement<any, any>, options: ImageOptions) => Promise<string>;
|
|
8
|
+
export declare const getResvg: () => new (svg: Uint8Array | string, options?: resvg.ResvgRenderOptions) => {
|
|
9
|
+
free(): void;
|
|
10
|
+
render(): {
|
|
11
|
+
free(): void;
|
|
12
|
+
asPng(): Uint8Array;
|
|
13
|
+
readonly height: number;
|
|
14
|
+
readonly pixels: Uint8Array;
|
|
15
|
+
readonly width: number;
|
|
16
|
+
};
|
|
17
|
+
toString(): string;
|
|
18
|
+
innerBBox(): {
|
|
19
|
+
free(): void;
|
|
20
|
+
height: number;
|
|
21
|
+
width: number;
|
|
22
|
+
x: number;
|
|
23
|
+
y: number;
|
|
24
|
+
} | undefined;
|
|
25
|
+
getBBox(): {
|
|
26
|
+
free(): void;
|
|
27
|
+
height: number;
|
|
28
|
+
width: number;
|
|
29
|
+
x: number;
|
|
30
|
+
y: number;
|
|
31
|
+
} | undefined;
|
|
32
|
+
cropByBBox(bbox: {
|
|
33
|
+
free(): void;
|
|
34
|
+
height: number;
|
|
35
|
+
width: number;
|
|
36
|
+
x: number;
|
|
37
|
+
y: number;
|
|
38
|
+
}): void;
|
|
39
|
+
imagesToResolve(): any[];
|
|
40
|
+
resolveImage(href: string, buffer: Uint8Array): void;
|
|
41
|
+
readonly height: number;
|
|
42
|
+
readonly width: number;
|
|
43
|
+
};
|
package/lib/index.d.ts
CHANGED
|
@@ -22,6 +22,43 @@ declare class VercelSatoriPngService extends Service {
|
|
|
22
22
|
jsxToPng(jsxCode: string, options?: ImageOptions, data?: Record<any, any>): Promise<Readable>;
|
|
23
23
|
htmlToPng(htmlCode: string, options?: ImageOptions): Promise<Readable>;
|
|
24
24
|
reactElementToPng(reactElement: ReactElement<any, any>, options?: ImageOptions): Promise<Readable>;
|
|
25
|
+
reactElementToSvg(reactElement: ReactElement<any, any>, options?: ImageOptions): Promise<string>;
|
|
26
|
+
getResvg(): new (svg: Uint8Array | string, options?: import("@resvg/resvg-wasm").ResvgRenderOptions) => {
|
|
27
|
+
free(): void;
|
|
28
|
+
render(): {
|
|
29
|
+
free(): void;
|
|
30
|
+
asPng(): Uint8Array;
|
|
31
|
+
readonly height: number;
|
|
32
|
+
readonly pixels: Uint8Array;
|
|
33
|
+
readonly width: number;
|
|
34
|
+
};
|
|
35
|
+
toString(): string;
|
|
36
|
+
innerBBox(): {
|
|
37
|
+
free(): void;
|
|
38
|
+
height: number;
|
|
39
|
+
width: number;
|
|
40
|
+
x: number;
|
|
41
|
+
y: number;
|
|
42
|
+
} | undefined;
|
|
43
|
+
getBBox(): {
|
|
44
|
+
free(): void;
|
|
45
|
+
height: number;
|
|
46
|
+
width: number;
|
|
47
|
+
x: number;
|
|
48
|
+
y: number;
|
|
49
|
+
} | undefined;
|
|
50
|
+
cropByBBox(bbox: {
|
|
51
|
+
free(): void;
|
|
52
|
+
height: number;
|
|
53
|
+
width: number;
|
|
54
|
+
x: number;
|
|
55
|
+
y: number;
|
|
56
|
+
}): void;
|
|
57
|
+
imagesToResolve(): any[];
|
|
58
|
+
resolveImage(href: string, buffer: Uint8Array): void;
|
|
59
|
+
readonly height: number;
|
|
60
|
+
readonly width: number;
|
|
61
|
+
};
|
|
25
62
|
}
|
|
26
63
|
declare namespace VercelSatoriPngService {
|
|
27
64
|
const usage: string;
|
package/lib/index.js
CHANGED
|
@@ -250,8 +250,8 @@ var loadDynamicAsset = /* @__PURE__ */ __name(({ emoji }) => {
|
|
|
250
250
|
return asset;
|
|
251
251
|
};
|
|
252
252
|
}, "loadDynamicAsset");
|
|
253
|
-
|
|
254
|
-
|
|
253
|
+
function mergeOptions(opts) {
|
|
254
|
+
return Object.assign(
|
|
255
255
|
{
|
|
256
256
|
width: 1200,
|
|
257
257
|
height: 630,
|
|
@@ -259,6 +259,23 @@ async function render(satori2, resvg2, opts, defaultFonts, element) {
|
|
|
259
259
|
},
|
|
260
260
|
opts
|
|
261
261
|
);
|
|
262
|
+
}
|
|
263
|
+
__name(mergeOptions, "mergeOptions");
|
|
264
|
+
async function renderSvg(satori2, opts, defaultFonts, element) {
|
|
265
|
+
const options = mergeOptions(opts);
|
|
266
|
+
return await satori2(element, {
|
|
267
|
+
width: options.width,
|
|
268
|
+
height: options.height,
|
|
269
|
+
debug: options.debug,
|
|
270
|
+
fonts: options.fonts || defaultFonts,
|
|
271
|
+
loadAdditionalAsset: loadDynamicAsset({
|
|
272
|
+
emoji: options.emoji
|
|
273
|
+
})
|
|
274
|
+
});
|
|
275
|
+
}
|
|
276
|
+
__name(renderSvg, "renderSvg");
|
|
277
|
+
async function render(satori2, resvg2, opts, defaultFonts, element) {
|
|
278
|
+
const options = mergeOptions(opts);
|
|
262
279
|
const svg = await satori2(element, {
|
|
263
280
|
width: options.width,
|
|
264
281
|
height: options.height,
|
|
@@ -297,18 +314,30 @@ var initSatori = /* @__PURE__ */ __name(async () => {
|
|
|
297
314
|
require2.resolve("../noto-sans-v27-latin-regular.ttf")
|
|
298
315
|
);
|
|
299
316
|
}, "initSatori");
|
|
317
|
+
var getDefaultFonts = /* @__PURE__ */ __name(() => [
|
|
318
|
+
{
|
|
319
|
+
name: "sans serif",
|
|
320
|
+
data: fontData,
|
|
321
|
+
weight: 700,
|
|
322
|
+
style: "normal"
|
|
323
|
+
}
|
|
324
|
+
], "getDefaultFonts");
|
|
300
325
|
var createNodejsStream = /* @__PURE__ */ __name(async (element, options) => {
|
|
301
|
-
const
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
];
|
|
309
|
-
const result = await render(satori, resvg, options, fonts, element);
|
|
326
|
+
const result = await render(
|
|
327
|
+
satori,
|
|
328
|
+
resvg,
|
|
329
|
+
options,
|
|
330
|
+
getDefaultFonts(),
|
|
331
|
+
element
|
|
332
|
+
);
|
|
310
333
|
return import_node_stream.Readable.from(Buffer.from(result));
|
|
311
334
|
}, "createNodejsStream");
|
|
335
|
+
var renderSvg2 = /* @__PURE__ */ __name(async (element, options) => {
|
|
336
|
+
return renderSvg(satori, options, getDefaultFonts(), element);
|
|
337
|
+
}, "renderSvg");
|
|
338
|
+
var getResvg = /* @__PURE__ */ __name(() => {
|
|
339
|
+
return resvg.Resvg;
|
|
340
|
+
}, "getResvg");
|
|
312
341
|
|
|
313
342
|
// src/index.ts
|
|
314
343
|
var serviceName = "vercelSatoriPngService";
|
|
@@ -394,6 +423,12 @@ var VercelSatoriPngService = class extends import_koishi.Service {
|
|
|
394
423
|
async reactElementToPng(reactElement, options) {
|
|
395
424
|
return createNodejsStream(reactElement, this.buildOptions(options));
|
|
396
425
|
}
|
|
426
|
+
async reactElementToSvg(reactElement, options) {
|
|
427
|
+
return renderSvg2(reactElement, this.buildOptions(options));
|
|
428
|
+
}
|
|
429
|
+
getResvg() {
|
|
430
|
+
return getResvg();
|
|
431
|
+
}
|
|
397
432
|
};
|
|
398
433
|
((VercelSatoriPngService2) => {
|
|
399
434
|
VercelSatoriPngService2.usage = 'html to ReactElement <a target="_blank" href="https://www.npmjs.com/package/html-react-parser">html-react-parser</a> \njsx to ReactElement <a target="_blank" href="https://www.npmjs.com/package/sucrase">sucrase</a> \nReactElement to svg <a target="_blank" href="https://github.com/vercel/satori#overview">vercel/satori</a> \n<a target="_blank" href="https://og-playground.vercel.app/">og-playground</a> \nsvg to png <a target="_blank" href="https://www.npmjs.com/package/@resvg/resvg-wasm">@resvg/resvg-wasm</a>';
|
package/lib/og.d.ts
CHANGED
|
@@ -41,4 +41,5 @@ export type ImageOptions = {
|
|
|
41
41
|
emoji?: EmojiType;
|
|
42
42
|
};
|
|
43
43
|
export type Font = ImageOptions["fonts"][number];
|
|
44
|
+
export declare function renderSvg(satori: typeof Satori, opts: ImageOptions, defaultFonts: Font[], element: ReactElement<any, any>): Promise<string>;
|
|
44
45
|
export default function render(satori: typeof Satori, resvg: typeof Resvg, opts: ImageOptions, defaultFonts: Font[], element: ReactElement<any, any>): Promise<Uint8Array<ArrayBufferLike>>;
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "koishi-plugin-vercel-satori-png-service",
|
|
3
3
|
"description": "Use Vercel Satori and Resvg.js to convert html to png",
|
|
4
|
-
"version": "0.1.
|
|
4
|
+
"version": "0.1.7",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"typings": "lib/index.d.ts",
|
|
7
7
|
"scripts": {
|
|
8
8
|
"build": "cd ../../ && yarn build vercel-satori-png-service",
|
|
9
9
|
"pub": "cd ../../ && yarn pub vercel-satori-png-service",
|
|
10
10
|
"fastPub": "cd ../../ && yarn bump -3 vercel-satori-png-service && yarn build vercel-satori-png-service && yarn pub vercel-satori-png-service",
|
|
11
|
-
"test": "node
|
|
11
|
+
"test": "node test/test.js"
|
|
12
12
|
},
|
|
13
13
|
"files": [
|
|
14
14
|
"lib",
|
|
@@ -33,7 +33,8 @@
|
|
|
33
33
|
"plugin",
|
|
34
34
|
"render",
|
|
35
35
|
"html to png",
|
|
36
|
-
"jsx to png"
|
|
36
|
+
"jsx to png",
|
|
37
|
+
"vercelSatoriPngService"
|
|
37
38
|
],
|
|
38
39
|
"peerDependencies": {
|
|
39
40
|
"koishi": "^4.18.8"
|