@fraqjs/plugin-takumi 0.2.1 → 0.4.0

package/dist/index.d.mts

@@ -1,15 +1,16 @@
 import { Context, Disposable } from "@fraqjs/fraq";
-import { ConstructRendererOptions, Font, RenderOptions, Renderer } from "@takumi-rs/core";
+import { FontLoader, RenderOptions, Renderer } from "@takumi-rs/core";
 import { ReactElementLike } from "@takumi-rs/helpers";
 import { EmojiType } from "@takumi-rs/helpers/emoji";
 import { ReactNode } from "react";
-
 //#region src/service.d.ts
 interface TakumiServiceOptions {
-  renderer?: ConstructRendererOptions;
   renderDefaults?: RenderOptions;
   onFontRegisterConflict?: 'error' | 'warn-and-ignore' | 'warn-and-replace';
 }
+type RenderCallOptions = RenderOptions & {
+  emojiType?: EmojiType;
+};
 interface PathBasedFontDetails {
   name?: string;
   path: string;
@@ -21,16 +22,19 @@ declare class TakumiService implements Disposable {
   private readonly ctx?;
   readonly renderer: Renderer;
   private readonly abortController;
+  private readonly imageFetchCache;
   private readonly registeredFontFamilies;
   private onFontRegisterConflict;
   constructor(options?: TakumiServiceOptions | undefined, ctx?: Context | undefined);
-  registerFontFamily(family: string, fonts: (string | PathBasedFontDetails | Font)[], signal?: AbortSignal): Promise<void>;
-  renderJsx(jsx: ReactNode | ReactElementLike, renderOptions?: RenderOptions, signal?: AbortSignal): Promise<Buffer>;
-  renderJsxWithEmoji(jsx: ReactNode | ReactElementLike, renderOptions?: RenderOptions, signal?: AbortSignal, emojiType?: EmojiType): Promise<Buffer>;
-  renderHtml(html: string, renderOptions?: RenderOptions, signal?: AbortSignal): Promise<Buffer>;
-  renderHtmlWithEmoji(html: string, renderOptions?: RenderOptions, signal?: AbortSignal, emojiType?: EmojiType): Promise<Buffer>;
+  registerFontFamily(family: string, fonts: (string | PathBasedFontDetails | FontLoader)[], signal?: AbortSignal): Promise<void>;
+  renderJsx(jsx: ReactNode | ReactElementLike, options?: RenderCallOptions): Promise<Buffer>;
+  renderHtml(html: string, options?: RenderCallOptions): Promise<Buffer>;
+  private renderNode;
   private mergeRenderOptions;
-  private processEmoji;
+  private mergeFonts;
+  private mergeImages;
+  private toImagesInput;
+  private toFontLoader;
   dispose(): void;
 }
 //#endregion
@@ -41,4 +45,4 @@ interface TakumiPluginOptions extends TakumiServiceOptions {
 declare function loadBuiltinFontsForService(service: TakumiService): Promise<void>;
 declare const TakumiPlugin: import("@fraqjs/fraq").Plugin<[options?: TakumiPluginOptions | undefined], import("@fraqjs/fraq").Injection | undefined, import("@fraqjs/fraq").Injection | undefined>;
 //#endregion
-export { PathBasedFontDetails, TakumiPlugin, TakumiPlugin as default, TakumiPluginOptions, TakumiService, TakumiServiceOptions, loadBuiltinFontsForService };
+export { PathBasedFontDetails, RenderCallOptions, TakumiPlugin, TakumiPlugin as default, TakumiPluginOptions, TakumiService, TakumiServiceOptions, loadBuiltinFontsForService };

package/dist/index.mjs

@@ -1,26 +1,39 @@
 import { createRequire } from "node:module";
 import { definePlugin } from "@fraqjs/fraq";
-import { Renderer, extractResourceUrls } from "@takumi-rs/core";
-import { fetchResources } from "@takumi-rs/helpers";
+import { Renderer } from "@takumi-rs/core";
+import { fontFromUrl, prepareImages } from "@takumi-rs/helpers";
 import { extractEmojis } from "@takumi-rs/helpers/emoji";
 import { fromHtml } from "@takumi-rs/helpers/html";
 import { fromJsx } from "@takumi-rs/helpers/jsx";
 import fs from "node:fs/promises";
 //#region src/service.ts
 function combineAbortSignals(...signals) {
-	return AbortSignal.any(signals.filter((signal) => signal !== void 0));
+	const filteredSignals = signals.filter((signal) => signal !== void 0);
+	if (filteredSignals.length === 0) return;
+	if (filteredSignals.length === 1) return filteredSignals[0];
+	return AbortSignal.any(filteredSignals);
+}
+function getImageSources(images) {
+	if (!images) return [];
+	if (Array.isArray(images)) return images;
+	return images.sources ?? [];
+}
+function getImageCache(images) {
+	if (!images || Array.isArray(images)) return;
+	return images.cache;
 }
 var TakumiService = class {
 	options;
 	ctx;
 	renderer;
 	abortController = new AbortController();
-	registeredFontFamilies = /* @__PURE__ */ new Set();
+	imageFetchCache = /* @__PURE__ */ new Map();
+	registeredFontFamilies = /* @__PURE__ */ new Map();
 	onFontRegisterConflict;
 	constructor(options, ctx) {
 		this.options = options;
 		this.ctx = ctx;
-		this.renderer = new Renderer(options?.renderer);
+		this.renderer = new Renderer();
 		this.onFontRegisterConflict = options?.onFontRegisterConflict ?? "warn-and-ignore";
 	}
 	async registerFontFamily(family, fonts, signal) {
@@ -34,56 +47,49 @@ var TakumiService = class {
 			} else if (this.onFontRegisterConflict === "warn-and-replace") if (this.ctx) this.ctx.logger.warn(`${message} Replacing previous registration.`);
 			else console.warn(`${message} Replacing previous registration.`);
 		}
-		await this.renderer.loadFonts(await Promise.all(fonts.map(async (font) => {
-			if (typeof font === "string") return {
-				name: family,
-				data: await fs.readFile(font)
-			};
-			else if ("path" in font) {
-				const { path, name = family, weight, style } = font;
-				return {
-					name,
-					data: await fs.readFile(path),
-					weight,
-					style
-				};
-			} else return font;
-		})), combineAbortSignals(signal, this.abortController.signal));
-		this.registeredFontFamilies.add(family);
-	}
-	async renderJsx(jsx, renderOptions, signal) {
-		const { node, stylesheets } = await fromJsx(jsx);
-		return this.renderer.render(node, this.mergeRenderOptions({
-			stylesheets,
-			userOptions: renderOptions
-		}), combineAbortSignals(signal, this.abortController.signal));
+		signal?.throwIfAborted();
+		this.registeredFontFamilies.set(family, fonts.map((font) => this.toFontLoader(family, font)));
 	}
-	async renderJsxWithEmoji(jsx, renderOptions, signal, emojiType = "noto") {
+	async renderJsx(jsx, options) {
+		const { emojiType, ...renderOptions } = options ?? {};
 		const { node, stylesheets } = await fromJsx(jsx);
-		const { node: processedNode, fetchedResources } = await this.processEmoji(node, emojiType);
-		return this.renderer.render(processedNode, this.mergeRenderOptions({
+		return await this.renderNode({
+			node,
 			stylesheets,
-			fetchedResources,
-			userOptions: renderOptions
-		}), combineAbortSignals(signal, this.abortController.signal));
+			renderOptions,
+			emojiType
+		});
 	}
-	async renderHtml(html, renderOptions, signal) {
+	async renderHtml(html, options) {
+		const { emojiType, ...renderOptions } = options ?? {};
 		const { node, stylesheets } = fromHtml(html);
-		return this.renderer.render(node, this.mergeRenderOptions({
+		return await this.renderNode({
+			node,
 			stylesheets,
-			userOptions: renderOptions
-		}), combineAbortSignals(signal, this.abortController.signal));
+			renderOptions,
+			emojiType
+		});
 	}
-	async renderHtmlWithEmoji(html, renderOptions, signal, emojiType = "noto") {
-		const { node, stylesheets } = fromHtml(html);
-		const { node: processedNode, fetchedResources } = await this.processEmoji(node, emojiType);
-		return this.renderer.render(processedNode, this.mergeRenderOptions({
-			stylesheets,
-			fetchedResources,
-			userOptions: renderOptions
-		}), combineAbortSignals(signal, this.abortController.signal));
+	async renderNode(components) {
+		const node = components.emojiType === void 0 ? components.node : extractEmojis(components.node, components.emojiType);
+		return await this.renderer.render(node, await this.mergeRenderOptions({
+			node,
+			stylesheets: components.stylesheets,
+			userOptions: components.renderOptions,
+			images: components.emojiType !== void 0
+		}));
 	}
-	mergeRenderOptions(components) {
+	async mergeRenderOptions(components) {
+		const renderDefaults = this.options?.renderDefaults;
+		const signal = combineAbortSignals(components.userOptions?.signal, this.abortController.signal);
+		const images = await this.mergeImages({
+			node: components.node,
+			prepareImages: components.images ?? false,
+			signal,
+			defaultImages: renderDefaults?.images,
+			userImages: components.userOptions?.images
+		});
+		const fonts = this.mergeFonts(renderDefaults?.fonts, components.userOptions?.fonts);
 		return {
 			...this.options?.renderDefaults,
 			...components.userOptions,
@@ -92,20 +98,63 @@ var TakumiService = class {
 				...components.stylesheets ?? [],
 				...components.userOptions?.stylesheets ?? []
 			],
-			fetchedResources: [
-				...this.options?.renderDefaults?.fetchedResources ?? [],
-				...components.fetchedResources ?? [],
-				...components.userOptions?.fetchedResources ?? []
-			]
+			...fonts ? { fonts } : {},
+			...images ? { images } : {},
+			...signal ? { signal } : {}
 		};
 	}
-	async processEmoji(node, emojiType = "twemoji") {
-		const processedNode = extractEmojis(node, emojiType);
-		return {
-			node: processedNode,
-			fetchedResources: await fetchResources(extractResourceUrls(processedNode), { throwOnError: false })
+	mergeFonts(defaultFonts, userFonts) {
+		const fonts = [...this.registeredFontFamilies.values()].flat();
+		if (defaultFonts) fonts.push(...defaultFonts);
+		if (userFonts) fonts.push(...userFonts);
+		return fonts.length > 0 ? fonts : void 0;
+	}
+	async mergeImages(components) {
+		const sources = [...getImageSources(components.defaultImages), ...getImageSources(components.userImages)];
+		const cache = getImageCache(components.userImages) ?? getImageCache(components.defaultImages);
+		if (components.prepareImages) {
+			const preparedSources = await prepareImages({
+				node: components.node,
+				sources,
+				fetchCache: this.imageFetchCache,
+				signal: components.signal,
+				throwOnError: false
+			});
+			return this.toImagesInput(preparedSources, cache);
+		}
+		return this.toImagesInput(sources, cache);
+	}
+	toImagesInput(sources, cache) {
+		if (sources.length === 0) return cache === void 0 ? void 0 : { cache };
+		return cache === void 0 ? sources : {
+			sources,
+			cache
 		};
 	}
+	toFontLoader(family, font) {
+		if (typeof font === "string") {
+			if (font.startsWith("https://") || font.startsWith("http://")) return {
+				...fontFromUrl(font),
+				name: family
+			};
+			return {
+				name: family,
+				key: `${family}:${font}`,
+				data: () => fs.readFile(font)
+			};
+		}
+		if ("path" in font) {
+			const { path, name = family, weight, style } = font;
+			return {
+				name,
+				key: `${name}:${path}:${weight ?? ""}:${style ?? ""}`,
+				weight,
+				style,
+				data: () => fs.readFile(path)
+			};
+		}
+		return font;
+	}
 	dispose() {
 		this.abortController.abort();
 	}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fraqjs/plugin-takumi",
   "type": "module",
-  "version": "0.2.1",
+  "version": "0.4.0",
   "description": "Takumi integration plugin for Fraq",
   "files": [
     "dist",
@@ -19,12 +19,12 @@
   "license": "MIT",
   "peerDependencies": {
     "react": "^19.0.0",
-    "@fraqjs/fraq": "^0.11.0"
+    "@fraqjs/fraq": "^0.13.2"
   },
   "dependencies": {
     "@fraqjs/takumi-builtin-fonts": "^1.0.0",
-    "@takumi-rs/core": "^1.7.0",
-    "@takumi-rs/helpers": "^1.7.0"
+    "@takumi-rs/core": "^2.0.1",
+    "@takumi-rs/helpers": "^2.0.1"
   },
   "devDependencies": {
     "@types/react": "^19.2.15",