markdown-exit-s3-image 0.0.1

package/dist/index.d.mts

@@ -0,0 +1,7 @@
+import { r as Options } from "./types-CsakQe1p.mjs";
+import { MarkdownExit } from "markdown-exit";
+
+//#region src/index.d.ts
+declare function image(md: MarkdownExit, userOptions: Options): void;
+//#endregion
+export { image };

package/dist/index.mjs

@@ -0,0 +1,225 @@
+import sharp from "sharp";
+import { rgbaToDataURL } from "thumbhash";
+import { promises } from "node:fs";
+
+//#region src/cache.ts
+var ImageCache = class {
+	cache = {};
+	isDirty = false;
+	cacheFilePath;
+	stats = {
+		apiRequests: 0,
+		cacheHits: 0
+	};
+	constructor(cacheFile) {
+		this.cacheFile = cacheFile;
+		this.cacheFilePath = this.cacheFile;
+	}
+	async load() {
+		try {
+			await promises.access(this.cacheFilePath);
+			const cacheContent = await promises.readFile(this.cacheFilePath, "utf8");
+			this.cache = JSON.parse(cacheContent || "{}");
+			console.log(`[ImageCache] Cache loaded from ${this.cacheFilePath} with ${Object.keys(this.cache).length} items.`);
+		} catch (_) {
+			console.log("[ImageCache] Cache file not found or failed to read, starting with an empty cache.");
+			this.cache = {};
+		}
+	}
+	async save() {
+		if (!this.isDirty) {
+			console.log("[ImageCache] No changes to save.");
+			return;
+		}
+		try {
+			const cacheContent = JSON.stringify(this.cache, null, 2);
+			await promises.writeFile(this.cacheFilePath, cacheContent, "utf8");
+			this.isDirty = false;
+			console.log(`[ImageCache] Cache saved to ${this.cacheFilePath}.`);
+		} catch (error) {
+			console.error("[ImageCache] Failed to save cache file:", error);
+		}
+	}
+	get(key) {
+		if (this.cache[key]) {
+			this.stats.cacheHits++;
+			return this.cache[key];
+		}
+		this.stats.apiRequests++;
+		return null;
+	}
+	set(key, value) {
+		if (JSON.stringify(this.cache[key]) !== JSON.stringify(value)) {
+			this.cache[key] = value;
+			this.isDirty = true;
+		}
+	}
+	getStats() {
+		const totalRequests = this.stats.apiRequests + this.stats.cacheHits;
+		return {
+			totalItems: Object.keys(this.cache).length,
+			isDirty: this.isDirty,
+			...this.stats,
+			totalRequests,
+			cacheHitRate: totalRequests > 0 ? (this.stats.cacheHits / totalRequests * 100).toFixed(1) : "0.0"
+		};
+	}
+};
+
+//#endregion
+//#region src/options.ts
+function resolveOptions(userOptions = {}) {
+	const defaultOptions = {
+		progressive: {
+			enable: true,
+			srcset_widths: [
+				400,
+				600,
+				800,
+				1200,
+				2e3,
+				3e3
+			]
+		},
+		lazy: {
+			enable: true,
+			skip_first: 2
+		},
+		supported_domains: [],
+		ignore_formats: ["svg"],
+		cache_path: null
+	};
+	return {
+		...defaultOptions,
+		...userOptions,
+		progressive: {
+			...defaultOptions.progressive,
+			...userOptions.progressive
+		},
+		lazy: {
+			...defaultOptions.lazy,
+			...userOptions.lazy
+		},
+		supported_domains: userOptions.supported_domains ?? defaultOptions.supported_domains,
+		ignore_formats: userOptions.ignore_formats ?? defaultOptions.ignore_formats,
+		cache_path: userOptions.cache_path ?? defaultOptions.cache_path
+	};
+}
+
+//#endregion
+//#region src/index.ts
+/**
+* Determine whether a remote URL matches the supported domain list.
+* Supports wildcards (*) for pattern matching.
+*/
+function isSupportedDomain(url, patterns) {
+	if (patterns.length === 0) return true;
+	try {
+		const hostname = new URL(url).hostname;
+		return patterns.some((pattern) => {
+			const regexPattern = pattern.replace(/\./g, "\\.").replace(/\*/g, ".*");
+			return new RegExp(`^${regexPattern}$`, "i").test(hostname);
+		});
+	} catch {
+		return false;
+	}
+}
+/**
+* Check if file format should be ignored based on URL extension.
+*/
+function shouldIgnoreFormat(url, formats) {
+	const pathname = new URL(url).pathname.toLowerCase();
+	return formats.some((format) => pathname.endsWith(`.${format.toLowerCase()}`));
+}
+function image(md, userOptions) {
+	const options = resolveOptions(userOptions);
+	if (!options.progressive.enable) return;
+	const cachePath = options.cache_path;
+	const cache = cachePath ? new ImageCache(cachePath) : null;
+	let cacheLoaded = false;
+	let imageCount = 0;
+	process.once("beforeExit", () => {
+		if (cache) cache.save();
+	});
+	const imageRule = md.renderer.rules.image;
+	if (!imageRule) return;
+	md.renderer.rules.image = async (tokens, idx, info, env, self) => {
+		const token = tokens[idx];
+		const src = token.attrGet("src");
+		if (!src) return imageRule(tokens, idx, info, env, self);
+		if (!src.startsWith("http")) return imageRule(tokens, idx, info, env, self);
+		if (!isSupportedDomain(src, options.supported_domains)) return imageRule(tokens, idx, info, env, self);
+		if (shouldIgnoreFormat(src, options.ignore_formats)) return imageRule(tokens, idx, info, env, self);
+		if (!cacheLoaded && cache) {
+			await cache.load();
+			cacheLoaded = true;
+		}
+		try {
+			if (cache) {
+				const cached = cache.get(src);
+				if (cached) {
+					imageCount++;
+					return buildImageHTML(token.content, src, options, imageCount, cached.width, cached.height, cached.placeholder);
+				}
+			}
+			const response = await fetch(src);
+			const image$1 = sharp(Buffer.from(await response.arrayBuffer()));
+			const { width, height } = await image$1.metadata();
+			const { data: thumbnailBuffer, info: thumbnailInfo } = await image$1.resize(100, 100, { fit: "inside" }).ensureAlpha().raw().toBuffer({ resolveWithObject: true });
+			const placeholderUrl = rgbaToDataURL(thumbnailInfo.width, thumbnailInfo.height, new Uint8Array(thumbnailBuffer));
+			if (cache) cache.set(src, {
+				width,
+				height,
+				placeholder: placeholderUrl
+			});
+			imageCount++;
+			return buildImageHTML(token.content, src, options, imageCount, width, height, placeholderUrl);
+		} catch (e) {
+			console.error(`[markdown-exit-image] Error processing image ${src}:`, e);
+			return imageRule(tokens, idx, info, env, self);
+		}
+	};
+}
+function generateSrcset(src, width, srcsetWidths) {
+	const validWidths = srcsetWidths.filter((w) => w < width).concat(width);
+	return Array.from(new Set(validWidths)).sort((a, b) => a - b).map((w) => {
+		return `${w === width ? src : src.includes("?") ? `${src}&w=${w}` : `${src}?w=${w}`} ${w}w`;
+	}).join(", ");
+}
+function buildImageHTML(alt, src, options, imageIndex, width, height, dataURL) {
+	const srcset = generateSrcset(src, width, options.progressive.srcset_widths);
+	const shouldLazyLoad = options.lazy.enable && imageIndex > options.lazy.skip_first;
+	/**
+	* 4. 返回包装后的 HTML
+	* - 外层 div 控制最大宽度并占用占位空间
+	* - aspect-ratio 确保容器高度在图片加载前就已确定
+	* - background-image 放置低分辨率模糊预览图 (dataURL)
+	*/
+	return `
+    <div class="img-container" style="
+      position: relative;
+      overflow: hidden;
+      aspect-ratio: ${width} / ${height};
+      max-width: ${width}px;
+      width: 100%;
+      background-image: url('${dataURL}');
+      background-size: cover;
+      background-repeat: no-repeat;
+    ">
+      <img ${[
+		`src="${src}"`,
+		`alt="${alt}"`,
+		`width="${width}"`,
+		`height="${height}"`,
+		`srcset="${srcset}"`,
+		`sizes="${options.progressive.sizes || `(max-width: ${width}px) 100vw, ${width}px`}"`,
+		shouldLazyLoad ? "loading=\"lazy\" decoding=\"async\"" : "fetchpriority=\"high\"",
+		`style="width: 100%; height: auto; display: block; transition: opacity 0.4s; opacity: 0;"`,
+		`onload="this.style.opacity=1; this.parentElement.style.backgroundImage='none';"`
+	].filter(Boolean).join(" ")}>
+    </div>
+  `;
+}
+
+//#endregion
+export { image };

package/dist/types-CsakQe1p.d.mts

@@ -0,0 +1,87 @@
+//#region src/types.d.ts
+type CachePathOption = string | null;
+/**
+ * Options controlling progressive image loading.
+ */
+interface ProgressiveOptions {
+  /**
+   * Enable or disable progressive image loading.
+   * @default true
+   */
+  enable?: boolean;
+  /**
+   * An array of widths to generate for the srcset attribute.
+   * @default [400, 600, 800, 1200, 2000, 3000]
+   */
+  srcset_widths?: number[];
+  /**
+   * Optional value for the sizes attribute.
+   * @example "(max-width: 800px) 100vw, 800px"
+   */
+  sizes?: string;
+}
+/**
+ * Options for controlling lazy loading behaviour.
+ */
+interface LazyOptions {
+  /**
+   * Enable or disable lazy loading.
+   * @default true
+   */
+  enable?: boolean;
+  /**
+   * Number of images to skip before applying lazy loading.
+   * @default 2
+   */
+  skip_first?: number;
+}
+/**
+ * Configuration options consumed by the plugin.
+ */
+interface Options {
+  /**
+   * Options for progressive image generation.
+   */
+  progressive?: ProgressiveOptions;
+  /**
+   * Domains that are eligible for processing. Supports wildcards.
+   * When empty, all remote domains are processed.
+   * @default []
+   * @example ["example.com", "*.cdn.example.com"]
+   */
+  supported_domains?: string[];
+  /**
+   * Array of file format extensions to ignore (case-insensitive).
+   * @default ["svg"]
+   * @example ["svg", "gif"]
+   */
+  ignore_formats?: string[];
+  /**
+   * Options for lazy loading.
+   */
+  lazy?: LazyOptions;
+  /**
+   * Path to the cache file. When unset, caching is disabled.
+   * @default null
+   * @example ".cache/thumbhash-cache.json"
+   */
+  cache_path?: CachePathOption;
+}
+/**
+ * Fully resolved options with defaults applied.
+ */
+interface ResolvedOptions extends Options {
+  progressive: ProgressiveOptions & {
+    enable: boolean;
+    srcset_widths: number[];
+  };
+  lazy: LazyOptions & {
+    enable: boolean;
+    skip_first: number;
+  };
+  supported_domains: string[];
+  ignore_formats: string[];
+  cache_path: CachePathOption;
+}
+//#endregion
+export { ResolvedOptions as a, ProgressiveOptions as i, LazyOptions as n, Options as r, CachePathOption as t };

package/dist/types.d.mts

@@ -0,0 +1,2 @@
+import { a as ResolvedOptions, i as ProgressiveOptions, n as LazyOptions, r as Options, t as CachePathOption } from "./types-CsakQe1p.mjs";
+export { CachePathOption, LazyOptions, Options, ProgressiveOptions, ResolvedOptions };

package/dist/types.mjs

@@ -0,0 +1 @@
+export {  };

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "markdown-exit-s3-image",
+  "type": "module",
+  "author": "gnix_aij",
+  "version": "0.0.1",
+  "license": "MIT",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.mts",
+      "import": "./dist/index.mjs"
+    },
+    "./types": {
+      "types": "./dist/types.d.mts",
+      "import": "./dist/types.mjs"
+    },
+    "./*": "./*"
+  },
+  "main": "dist/index.mjs",
+  "types": "dist/index.d.mts",
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "build": "tsdown"
+  },
+  "peerDependencies": {
+    "markdown-exit": "1.0.0-beta.6"
+  },
+  "dependencies": {
+    "sharp": "^0.34.5",
+    "thumbhash": "^0.1.1"
+  },
+  "devDependencies": {
+    "@tsconfig/node20": "^20.1.8",
+    "@types/node": "^24.10.1",
+    "tsdown": "^0.16.6"
+  }
+}