@eclipsa/image 0.0.0

package/.turbo/turbo-build.log

@@ -0,0 +1,16 @@
+$ vp pack && bun ../../scripts/release/write-dist-package-json.ts
+ℹ entry: mod.ts, client.ts, vite.ts
+ℹ tsconfig: ../../tsconfig.json
+ℹ Build start
+ℹ Cleaning 10 files
+ℹ dist/vite.mjs       9.43 kB │ gzip: 3.07 kB
+ℹ dist/mod.mjs        0.72 kB │ gzip: 0.40 kB
+ℹ dist/client.mjs     0.01 kB │ gzip: 0.03 kB
+ℹ dist/vite.mjs.map  18.38 kB │ gzip: 5.62 kB
+ℹ dist/mod.mjs.map    2.24 kB │ gzip: 0.87 kB
+ℹ dist/mod.d.mts      1.00 kB │ gzip: 0.43 kB
+ℹ dist/vite.d.mts     0.90 kB │ gzip: 0.41 kB
+ℹ dist/client.d.mts   0.01 kB │ gzip: 0.03 kB
+ℹ 8 files, total: 32.68 kB
+✔ Build complete in 2818ms
+dist/package.json

package/.turbo/turbo-pack.log

@@ -0,0 +1,16 @@
+$ vp pack && bun ../../scripts/release/write-dist-package-json.ts
+ℹ entry: mod.ts, client.ts, vite.ts
+ℹ tsconfig: ../../tsconfig.json
+ℹ Build start
+ℹ Cleaning 10 files
+ℹ dist/vite.mjs       9.43 kB │ gzip: 3.07 kB
+ℹ dist/mod.mjs        0.74 kB │ gzip: 0.39 kB
+ℹ dist/client.mjs     0.01 kB │ gzip: 0.03 kB
+ℹ dist/vite.mjs.map  18.38 kB │ gzip: 5.62 kB
+ℹ dist/mod.mjs.map    2.10 kB │ gzip: 0.86 kB
+ℹ dist/mod.d.mts      1.00 kB │ gzip: 0.43 kB
+ℹ dist/vite.d.mts     0.90 kB │ gzip: 0.41 kB
+ℹ dist/client.d.mts   0.01 kB │ gzip: 0.03 kB
+ℹ 8 files, total: 32.57 kB
+✔ Build complete in 2090ms
+dist/package.json

package/.turbo/turbo-test.log

@@ -0,0 +1,11 @@
+$ vp test --run
+ RUN  /home/nakasyou/eclipsa/packages/image
+
+ ✓ vite-config.test.ts (1 test) 6ms
+ ✓ mod.test.tsx (6 tests) 30ms
+
+ Test Files  2 passed (2)
+      Tests  7 passed (7)
+   Start at  17:36:38
+   Duration  555ms (transform 117ms, setup 0ms, import 609ms, tests 36ms, environment 0ms)
+

package/.turbo/turbo-typecheck.log

@@ -0,0 +1 @@
+$ bun x tsc -p ../../tsconfig.json --noEmit

package/client.d.ts

@@ -0,0 +1,41 @@
+declare module '*.avif?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.jpeg?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.jpg?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.png?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.svg?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.webp?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}

package/client.ts

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

package/dist/client.d.mts

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

package/dist/client.d.ts

@@ -0,0 +1,41 @@
+declare module '*.avif?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.jpeg?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.jpg?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.png?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.svg?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}
+
+declare module '*.webp?eclipsa-image' {
+  import type { ImageSource } from '@eclipsa/image'
+
+  const image: ImageSource
+  export default image
+}

package/dist/client.mjs

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

package/dist/mod.d.mts

@@ -0,0 +1,48 @@
+//#region mod.d.ts
+type ImageOutputFormat = 'avif' | 'jpeg' | 'png' | 'webp';
+interface ImageVariant {
+  format: string;
+  height: number;
+  src: string;
+  width: number;
+}
+interface ImageSource {
+  format: string;
+  height: number;
+  src: string;
+  variants: ImageVariant[];
+  width: number;
+}
+interface ImageProps extends Record<string, unknown> {
+  alt: string;
+  decoding?: 'async' | 'auto' | 'sync';
+  height?: number;
+  loading?: 'eager' | 'lazy';
+  sizes?: string;
+  src: ImageSource | string;
+  srcset?: string;
+  width?: number;
+}
+interface EclipsaImageOptions {
+  formats?: ImageOutputFormat[];
+  quality?: number;
+  widths?: number[];
+}
+declare const Image: ({
+  alt,
+  decoding,
+  height,
+  loading,
+  sizes,
+  src,
+  srcset,
+  width,
+  ...props
+}: ImageProps) => {
+  isStatic: boolean;
+  props: Record<string, unknown>;
+  type: string;
+};
+//#endregion
+export { EclipsaImageOptions, Image, ImageOutputFormat, ImageProps, ImageSource, ImageVariant };
+//# sourceMappingURL=mod.d.mts.map

package/dist/mod.mjs

@@ -0,0 +1,33 @@
+//#region mod.ts
+const createImageElement = (props) => ({
+	isStatic: false,
+	props,
+	type: "img"
+});
+const Image = ({ alt, decoding = "async", height, loading = "lazy", sizes, src, srcset, width, ...props }) => {
+	return createImageElement({ ...typeof src === "string" ? {
+		...props,
+		alt,
+		decoding,
+		height,
+		loading,
+		sizes,
+		src,
+		srcset,
+		width
+	} : {
+		...props,
+		alt,
+		decoding,
+		height: height ?? src.height,
+		loading,
+		sizes: sizes ?? (src.variants.length > 1 ? "100vw" : void 0),
+		src: src.src,
+		srcset: srcset ?? src.variants.map((variant) => `${variant.src} ${variant.width}w`).join(", "),
+		width: width ?? src.width
+	} });
+};
+//#endregion
+export { Image };
+
+//# sourceMappingURL=mod.mjs.map

package/dist/mod.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mod.mjs","names":[],"sources":["../mod.ts"],"sourcesContent":["export type ImageOutputFormat = 'avif' | 'jpeg' | 'png' | 'webp'\n\nexport interface ImageVariant {\n  format: string\n  height: number\n  src: string\n  width: number\n}\n\nexport interface ImageSource {\n  format: string\n  height: number\n  src: string\n  variants: ImageVariant[]\n  width: number\n}\n\nexport interface ImageProps extends Record<string, unknown> {\n  alt: string\n  decoding?: 'async' | 'auto' | 'sync'\n  height?: number\n  loading?: 'eager' | 'lazy'\n  sizes?: string\n  src: ImageSource | string\n  srcset?: string\n  width?: number\n}\n\nexport interface EclipsaImageOptions {\n  formats?: ImageOutputFormat[]\n  quality?: number\n  widths?: number[]\n}\n\nconst createImageElement = (props: Record<string, unknown>) => ({\n  isStatic: false,\n  props,\n  type: 'img',\n})\n\nexport const Image = ({\n  alt,\n  decoding = 'async',\n  height,\n  loading = 'lazy',\n  sizes,\n  src,\n  srcset,\n  width,\n  ...props\n}: ImageProps) => {\n  const imageProps =\n    typeof src === 'string'\n      ? {\n          ...props,\n          alt,\n          decoding,\n          height,\n          loading,\n          sizes,\n          src,\n          srcset,\n          width,\n        }\n      : {\n          ...props,\n          alt,\n          decoding,\n          height: height ?? src.height,\n          loading,\n          sizes: sizes ?? (src.variants.length > 1 ? '100vw' : undefined),\n          src: src.src,\n          srcset:\n            srcset ?? src.variants.map((variant) => `${variant.src} ${variant.width}w`).join(', '),\n          width: width ?? src.width,\n        }\n\n  return createImageElement({\n    ...imageProps,\n  })\n}\n"],"mappings":";AAkCA,MAAM,sBAAsB,WAAoC;CAC9D,UAAU;CACV;CACA,MAAM;CACP;AAED,MAAa,SAAS,EACpB,KACA,WAAW,SACX,QACA,UAAU,QACV,OACA,KACA,QACA,OACA,GAAG,YACa;AA2BhB,QAAO,mBAAmB,EACxB,GA1BA,OAAO,QAAQ,WACX;EACE,GAAG;EACH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,GACD;EACE,GAAG;EACH;EACA;EACA,QAAQ,UAAU,IAAI;EACtB;EACA,OAAO,UAAU,IAAI,SAAS,SAAS,IAAI,UAAU,KAAA;EACrD,KAAK,IAAI;EACT,QACE,UAAU,IAAI,SAAS,KAAK,YAAY,GAAG,QAAQ,IAAI,GAAG,QAAQ,MAAM,GAAG,CAAC,KAAK,KAAK;EACxF,OAAO,SAAS,IAAI;EACrB,EAIN,CAAC"}

package/dist/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@eclipsa/image",
+  "homepage": "https://github.com/pnsk-lab/eclipsa",
+  "bugs": {
+    "url": "https://github.com/pnsk-lab/eclipsa/issues"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/pnsk-lab/eclipsa.git",
+    "directory": "packages/image"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./mod.d.mts",
+      "import": "./mod.mjs"
+    },
+    "./client": {
+      "types": "./client.d.ts",
+      "import": "./client.mjs"
+    },
+    "./vite": {
+      "types": "./vite.d.mts",
+      "import": "./vite.mjs"
+    }
+  },
+  "dependencies": {
+    "eclipsa": "0.2.0-alpha.0",
+    "sharp": "^0.34.5"
+  },
+  "peerDependencies": {
+    "vite": "*"
+  },
+  "version": "0.0.0",
+  "private": false
+}

package/dist/vite.d.mts

@@ -0,0 +1,19 @@
+import { EclipsaImageOptions } from "./mod.mjs";
+import { Plugin, ResolvedConfig } from "vite";
+
+//#region vite.d.ts
+interface LoadedImage {
+  format: string;
+  height: number;
+  source: Buffer;
+  width: number;
+}
+declare const toContentType: (format: string) => string;
+declare const resolveImageWidths: (sourceWidth: number, configuredWidths: readonly number[]) => number[];
+declare const readLocalImage: (filePath: string) => Promise<LoadedImage>;
+declare const isAllowedImagePath: (filePath: string, config: Pick<ResolvedConfig, "root" | "server">) => Promise<boolean>;
+declare const createAssetName: (filePath: string, width: number, format: string) => string;
+declare const eclipsaImage: (options?: EclipsaImageOptions) => Plugin;
+//#endregion
+export { createAssetName, eclipsaImage, isAllowedImagePath, readLocalImage, resolveImageWidths, toContentType };
+//# sourceMappingURL=vite.d.mts.map

package/dist/vite.mjs

@@ -0,0 +1,263 @@
+import { createHash } from "node:crypto";
+import * as fs from "node:fs/promises";
+import * as path from "node:path";
+import sharp from "sharp";
+//#region vite.ts
+const IMAGE_QUERY_FLAG = "eclipsa-image";
+const VIRTUAL_IMAGE_PREFIX = "\0eclipsa-image:";
+const DEV_IMAGE_ENDPOINT = "/__eclipsa/image";
+const DEFAULT_WIDTHS = [
+	320,
+	640,
+	960,
+	1280,
+	1600
+];
+const DEFAULT_QUALITY = 80;
+const SUPPORTED_OUTPUT_FORMATS = new Set([
+	"avif",
+	"jpeg",
+	"png",
+	"webp"
+]);
+const splitId = (id) => {
+	const queryIndex = id.indexOf("?");
+	return queryIndex === -1 ? {
+		pathname: id,
+		query: ""
+	} : {
+		pathname: id.slice(0, queryIndex),
+		query: id.slice(queryIndex + 1)
+	};
+};
+const toOutputExtension = (format) => format === "jpeg" ? "jpg" : format;
+const toContentType = (format) => {
+	if (format === "svg") return "image/svg+xml";
+	if (format === "jpeg") return "image/jpeg";
+	return `image/${toOutputExtension(format)}`;
+};
+const toRoundedHeight = (sourceWidth, sourceHeight, targetWidth) => Math.max(1, Math.round(sourceHeight * targetWidth / sourceWidth));
+const resolveImageWidths = (sourceWidth, configuredWidths) => {
+	const widths = configuredWidths.map((value) => Math.floor(value)).filter((value) => Number.isFinite(value) && value > 0 && value < sourceWidth).sort((left, right) => left - right);
+	return [...new Set(widths), sourceWidth];
+};
+const readLocalImage = async (filePath) => {
+	const source = await fs.readFile(filePath);
+	const metadata = await sharp(source, { animated: true }).metadata();
+	if (!metadata.width || !metadata.height || !metadata.format) throw new Error(`Unable to read image metadata for ${filePath}`);
+	return {
+		format: metadata.format,
+		height: metadata.height,
+		source,
+		width: metadata.width
+	};
+};
+const resolveRealPath = async (filePath) => {
+	const resolvedPath = path.resolve(filePath);
+	try {
+		return await fs.realpath(resolvedPath);
+	} catch {
+		return resolvedPath;
+	}
+};
+const isInsideDirectory = (filePath, directoryPath) => {
+	const relative = path.relative(directoryPath, filePath);
+	return relative === "" || !relative.startsWith("..") && !path.isAbsolute(relative);
+};
+const isAllowedImagePath = async (filePath, config) => {
+	const allowedRoots = /* @__PURE__ */ new Set();
+	for (const allowedPath of [config.root, ...config.server.fs.allow ?? []]) allowedRoots.add(await resolveRealPath(path.resolve(config.root, allowedPath)));
+	const resolvedFilePath = await resolveRealPath(filePath);
+	for (const allowedRoot of allowedRoots) if (isInsideDirectory(resolvedFilePath, allowedRoot)) return true;
+	return false;
+};
+const parseWidths = (value) => value?.split(/[;,]/).map((part) => Number(part.trim())).filter((part) => Number.isFinite(part) && part > 0) ?? [];
+const normalizeOutputFormat = (sourceFormat, requestedFormat, configuredFormats) => {
+	if (requestedFormat) return requestedFormat;
+	if (sourceFormat === "svg") return null;
+	if (SUPPORTED_OUTPUT_FORMATS.has(sourceFormat)) return sourceFormat;
+	return configuredFormats[0] ?? "webp";
+};
+const parseImageRequest = (id, options) => {
+	const { pathname, query } = splitId(id);
+	const params = new URLSearchParams(query);
+	if (!params.has(IMAGE_QUERY_FLAG)) return null;
+	const format = params.get("format");
+	if (format && !SUPPORTED_OUTPUT_FORMATS.has(format)) throw new Error(`Unsupported @eclipsa/image format "${format}". Expected one of avif, jpeg, png, webp.`);
+	const widths = parseWidths(params.get("widths"));
+	return {
+		filePath: pathname,
+		format: format ?? null,
+		widths: widths.length > 0 ? widths : options.widths ?? [...DEFAULT_WIDTHS]
+	};
+};
+const applyOutputFormat = (pipeline, format, quality) => {
+	switch (format) {
+		case "avif": return pipeline.avif({ quality });
+		case "jpeg": return pipeline.jpeg({
+			mozjpeg: true,
+			quality
+		});
+		case "png": return pipeline.png({
+			compressionLevel: 9,
+			quality
+		});
+		case "webp": return pipeline.webp({ quality });
+	}
+};
+const buildVariantAssets = async (image, variantWidths, format, quality) => {
+	if (format === null) return [{
+		buffer: image.source,
+		format: image.format,
+		height: image.height,
+		width: image.width
+	}];
+	return Promise.all(variantWidths.map(async (width) => {
+		const targetHeight = toRoundedHeight(image.width, image.height, width);
+		return {
+			buffer: await applyOutputFormat(sharp(image.source, { animated: true }).resize({
+				fit: "inside",
+				height: targetHeight,
+				width,
+				withoutEnlargement: true
+			}), format, quality).toBuffer(),
+			format,
+			height: targetHeight,
+			width
+		};
+	}));
+};
+const createAssetName = (filePath, width, format) => {
+	return `${path.basename(filePath, path.extname(filePath))}-${createHash("sha1").update(path.normalize(filePath)).digest("hex").slice(0, 8)}-${width}w.${toOutputExtension(format)}`;
+};
+const createBuildModule = (variants, filePath, emitFile) => {
+	const references = variants.map((variant) => emitFile({
+		fileName: `assets/${createAssetName(filePath, variant.width, variant.format)}`,
+		name: createAssetName(filePath, variant.width, variant.format),
+		source: variant.buffer,
+		type: "asset"
+	}));
+	const sourceIndex = variants.length - 1;
+	return `const variants = [
+${variants.map((variant, index) => `  { format: ${JSON.stringify(variant.format)}, height: ${variant.height}, src: import.meta.ROLLUP_FILE_URL_${references[index]}, width: ${variant.width} },`).join("\n")}
+];
+
+export default {
+  format: ${JSON.stringify(variants[sourceIndex].format)},
+  height: ${variants[sourceIndex].height},
+  src: import.meta.ROLLUP_FILE_URL_${references[sourceIndex]},
+  variants,
+  width: ${variants[sourceIndex].width},
+};
+`;
+};
+const createDevModule = (variants, filePath) => {
+	const sourceIndex = variants.length - 1;
+	const entries = variants.map((variant) => {
+		const params = new URLSearchParams({
+			format: variant.format,
+			path: filePath,
+			width: String(variant.width)
+		});
+		return {
+			format: variant.format,
+			height: variant.height,
+			src: `${DEV_IMAGE_ENDPOINT}?${params.toString()}`,
+			width: variant.width
+		};
+	});
+	return `const variants = ${JSON.stringify(entries)};
+
+export default {
+  format: ${JSON.stringify(entries[sourceIndex].format)},
+  height: ${entries[sourceIndex].height},
+  src: ${JSON.stringify(entries[sourceIndex].src)},
+  variants,
+  width: ${entries[sourceIndex].width},
+};
+`;
+};
+const writeDevImageResponse = async (req, res, config) => {
+	const requestUrl = new URL(req.url ?? "/", "http://localhost");
+	if (requestUrl.pathname !== DEV_IMAGE_ENDPOINT) return false;
+	const filePath = requestUrl.searchParams.get("path");
+	const width = Number(requestUrl.searchParams.get("width"));
+	const format = requestUrl.searchParams.get("format");
+	if (!filePath || !Number.isFinite(width) || width <= 0) {
+		res.statusCode = 400;
+		res.end("Invalid image request.");
+		return true;
+	}
+	if (!await isAllowedImagePath(filePath, config)) {
+		res.statusCode = 403;
+		res.end("Image path is not allowed.");
+		return true;
+	}
+	const image = await readLocalImage(filePath);
+	if (format === "svg") {
+		res.setHeader("Cache-Control", "no-store");
+		res.setHeader("Content-Type", "image/svg+xml");
+		res.end(image.source);
+		return true;
+	}
+	if (!format || !SUPPORTED_OUTPUT_FORMATS.has(format)) {
+		res.statusCode = 400;
+		res.end("Invalid image format.");
+		return true;
+	}
+	const [variant] = await buildVariantAssets(image, [Math.min(width, image.width)], format, DEFAULT_QUALITY);
+	if (!variant) {
+		res.statusCode = 500;
+		res.end("Failed to render image variant.");
+		return true;
+	}
+	res.setHeader("Cache-Control", "no-store");
+	res.setHeader("Content-Type", toContentType(variant.format));
+	res.end(variant.buffer);
+	return true;
+};
+const eclipsaImage = (options = {}) => {
+	let config = null;
+	return {
+		configResolved(resolvedConfig) {
+			config = resolvedConfig;
+		},
+		configureServer(server) {
+			server.middlewares.use(async (req, res, next) => {
+				try {
+					if (!config) {
+						next(/* @__PURE__ */ new Error("vite-plugin-eclipsa-image requires a resolved Vite config."));
+						return;
+					}
+					if (await writeDevImageResponse(req, res, config)) return;
+				} catch (error) {
+					next(error);
+					return;
+				}
+				next();
+			});
+		},
+		enforce: "pre",
+		async load(id) {
+			const resolved = id.startsWith(VIRTUAL_IMAGE_PREFIX) ? parseImageRequest(id.slice(15), options) : null;
+			if (!resolved) return null;
+			const image = await readLocalImage(resolved.filePath);
+			const format = normalizeOutputFormat(image.format, resolved.format, options.formats ?? []);
+			const variants = await buildVariantAssets(image, format === null ? [image.width] : resolveImageWidths(image.width, resolved.widths), format, options.quality ?? DEFAULT_QUALITY);
+			return config?.command === "build" ? createBuildModule(variants, resolved.filePath, this.emitFile.bind(this)) : createDevModule(variants, resolved.filePath);
+		},
+		name: "vite-plugin-eclipsa-image",
+		async resolveId(source, importer) {
+			const requested = parseImageRequest(source, options);
+			if (!requested) return null;
+			const resolved = await this.resolve(requested.filePath, importer, { skipSelf: true });
+			if (!resolved) return null;
+			const params = new URLSearchParams(splitId(source).query);
+			return `${VIRTUAL_IMAGE_PREFIX}${resolved.id}?${params.toString()}`;
+		}
+	};
+};
+//#endregion
+export { createAssetName, eclipsaImage, isAllowedImagePath, readLocalImage, resolveImageWidths, toContentType };
+
+//# sourceMappingURL=vite.mjs.map

package/dist/vite.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"vite.mjs","names":[],"sources":["../vite.ts"],"sourcesContent":["import type { IncomingMessage, ServerResponse } from 'node:http'\nimport { createHash } from 'node:crypto'\nimport * as fs from 'node:fs/promises'\nimport * as path from 'node:path'\nimport sharp from 'sharp'\nimport type { Plugin, ResolvedConfig } from 'vite'\nimport type { EclipsaImageOptions, ImageOutputFormat } from './mod.ts'\n\nconst IMAGE_QUERY_FLAG = 'eclipsa-image'\nconst VIRTUAL_IMAGE_PREFIX = '\\0eclipsa-image:'\nconst DEV_IMAGE_ENDPOINT = '/__eclipsa/image'\nconst DEFAULT_WIDTHS = [320, 640, 960, 1280, 1600] as const\nconst DEFAULT_QUALITY = 80\nconst SUPPORTED_OUTPUT_FORMATS = new Set(['avif', 'jpeg', 'png', 'webp'] as const)\n\ninterface ParsedImageRequest {\n  filePath: string\n  format: ImageOutputFormat | null\n  widths: number[]\n}\n\ninterface LoadedImage {\n  format: string\n  height: number\n  source: Buffer\n  width: number\n}\n\ninterface ImageVariantAsset {\n  buffer: Buffer\n  format: string\n  height: number\n  width: number\n}\n\ntype PluginContext = {\n  emitFile: (emittedFile: {\n    fileName?: string\n    name?: string\n    source: string | Uint8Array\n    type: 'asset'\n  }) => string\n}\n\nconst splitId = (id: string) => {\n  const queryIndex = id.indexOf('?')\n  return queryIndex === -1\n    ? { pathname: id, query: '' }\n    : {\n        pathname: id.slice(0, queryIndex),\n        query: id.slice(queryIndex + 1),\n      }\n}\n\nconst toOutputExtension = (format: string) => (format === 'jpeg' ? 'jpg' : format)\n\nexport const toContentType = (format: string) => {\n  if (format === 'svg') {\n    return 'image/svg+xml'\n  }\n  if (format === 'jpeg') {\n    return 'image/jpeg'\n  }\n  return `image/${toOutputExtension(format)}`\n}\n\nconst toRoundedHeight = (sourceWidth: number, sourceHeight: number, targetWidth: number) =>\n  Math.max(1, Math.round((sourceHeight * targetWidth) / sourceWidth))\n\nexport const resolveImageWidths = (sourceWidth: number, configuredWidths: readonly number[]) => {\n  const widths = configuredWidths\n    .map((value) => Math.floor(value))\n    .filter((value) => Number.isFinite(value) && value > 0 && value < sourceWidth)\n    .sort((left, right) => left - right)\n\n  return [...new Set(widths), sourceWidth]\n}\n\nexport const readLocalImage = async (filePath: string): Promise<LoadedImage> => {\n  const source = await fs.readFile(filePath)\n  const metadata = await sharp(source, { animated: true }).metadata()\n  if (!metadata.width || !metadata.height || !metadata.format) {\n    throw new Error(`Unable to read image metadata for ${filePath}`)\n  }\n\n  return {\n    format: metadata.format,\n    height: metadata.height,\n    source,\n    width: metadata.width,\n  }\n}\n\nconst resolveRealPath = async (filePath: string) => {\n  const resolvedPath = path.resolve(filePath)\n  try {\n    return await fs.realpath(resolvedPath)\n  } catch {\n    return resolvedPath\n  }\n}\n\nconst isInsideDirectory = (filePath: string, directoryPath: string) => {\n  const relative = path.relative(directoryPath, filePath)\n  return relative === '' || (!relative.startsWith('..') && !path.isAbsolute(relative))\n}\n\nexport const isAllowedImagePath = async (\n  filePath: string,\n  config: Pick<ResolvedConfig, 'root' | 'server'>,\n) => {\n  const allowedRoots = new Set<string>()\n  for (const allowedPath of [config.root, ...(config.server.fs.allow ?? [])]) {\n    allowedRoots.add(await resolveRealPath(path.resolve(config.root, allowedPath)))\n  }\n\n  const resolvedFilePath = await resolveRealPath(filePath)\n  for (const allowedRoot of allowedRoots) {\n    if (isInsideDirectory(resolvedFilePath, allowedRoot)) {\n      return true\n    }\n  }\n  return false\n}\n\nconst parseWidths = (value: string | null) =>\n  value\n    ?.split(/[;,]/)\n    .map((part) => Number(part.trim()))\n    .filter((part) => Number.isFinite(part) && part > 0) ?? []\n\nconst normalizeOutputFormat = (\n  sourceFormat: string,\n  requestedFormat: ImageOutputFormat | null,\n  configuredFormats: readonly ImageOutputFormat[],\n): ImageOutputFormat | null => {\n  if (requestedFormat) {\n    return requestedFormat\n  }\n  if (sourceFormat === 'svg') {\n    return null\n  }\n  if (SUPPORTED_OUTPUT_FORMATS.has(sourceFormat as ImageOutputFormat)) {\n    return sourceFormat as ImageOutputFormat\n  }\n  return configuredFormats[0] ?? 'webp'\n}\n\nconst parseImageRequest = (id: string, options: EclipsaImageOptions): ParsedImageRequest | null => {\n  const { pathname, query } = splitId(id)\n  const params = new URLSearchParams(query)\n  if (!params.has(IMAGE_QUERY_FLAG)) {\n    return null\n  }\n\n  const format = params.get('format')\n  if (format && !SUPPORTED_OUTPUT_FORMATS.has(format as ImageOutputFormat)) {\n    throw new Error(\n      `Unsupported @eclipsa/image format \"${format}\". Expected one of avif, jpeg, png, webp.`,\n    )\n  }\n\n  const widths = parseWidths(params.get('widths'))\n\n  return {\n    filePath: pathname,\n    format: (format as ImageOutputFormat | null) ?? null,\n    widths: widths.length > 0 ? widths : (options.widths ?? [...DEFAULT_WIDTHS]),\n  }\n}\n\nconst applyOutputFormat = (pipeline: sharp.Sharp, format: ImageOutputFormat, quality: number) => {\n  switch (format) {\n    case 'avif':\n      return pipeline.avif({ quality })\n    case 'jpeg':\n      return pipeline.jpeg({ mozjpeg: true, quality })\n    case 'png':\n      return pipeline.png({ compressionLevel: 9, quality })\n    case 'webp':\n      return pipeline.webp({ quality })\n  }\n}\n\nconst buildVariantAssets = async (\n  image: LoadedImage,\n  variantWidths: readonly number[],\n  format: ImageOutputFormat | null,\n  quality: number,\n): Promise<ImageVariantAsset[]> => {\n  if (format === null) {\n    return [\n      {\n        buffer: image.source,\n        format: image.format,\n        height: image.height,\n        width: image.width,\n      },\n    ]\n  }\n\n  return Promise.all(\n    variantWidths.map(async (width) => {\n      const targetHeight = toRoundedHeight(image.width, image.height, width)\n      const resized = await applyOutputFormat(\n        sharp(image.source, { animated: true }).resize({\n          fit: 'inside',\n          height: targetHeight,\n          width,\n          withoutEnlargement: true,\n        }),\n        format,\n        quality,\n      ).toBuffer()\n\n      return {\n        buffer: resized,\n        format,\n        height: targetHeight,\n        width,\n      }\n    }),\n  )\n}\n\nexport const createAssetName = (filePath: string, width: number, format: string) => {\n  const fileName = path.basename(filePath, path.extname(filePath))\n  const fileHash = createHash('sha1').update(path.normalize(filePath)).digest('hex').slice(0, 8)\n  return `${fileName}-${fileHash}-${width}w.${toOutputExtension(format)}`\n}\n\nconst createBuildModule = (\n  variants: ImageVariantAsset[],\n  filePath: string,\n  emitFile: PluginContext['emitFile'],\n) => {\n  const references = variants.map((variant) =>\n    emitFile({\n      fileName: `assets/${createAssetName(filePath, variant.width, variant.format)}`,\n      name: createAssetName(filePath, variant.width, variant.format),\n      source: variant.buffer,\n      type: 'asset',\n    }),\n  )\n  const sourceIndex = variants.length - 1\n\n  return `const variants = [\n${variants\n  .map(\n    (variant, index) =>\n      `  { format: ${JSON.stringify(variant.format)}, height: ${variant.height}, src: import.meta.ROLLUP_FILE_URL_${references[index]}, width: ${variant.width} },`,\n  )\n  .join('\\n')}\n];\n\nexport default {\n  format: ${JSON.stringify(variants[sourceIndex]!.format)},\n  height: ${variants[sourceIndex]!.height},\n  src: import.meta.ROLLUP_FILE_URL_${references[sourceIndex]!},\n  variants,\n  width: ${variants[sourceIndex]!.width},\n};\n`\n}\n\nconst createDevModule = (variants: ImageVariantAsset[], filePath: string) => {\n  const sourceIndex = variants.length - 1\n  const entries = variants.map((variant) => {\n    const params = new URLSearchParams({\n      format: variant.format,\n      path: filePath,\n      width: String(variant.width),\n    })\n    return {\n      format: variant.format,\n      height: variant.height,\n      src: `${DEV_IMAGE_ENDPOINT}?${params.toString()}`,\n      width: variant.width,\n    }\n  })\n\n  return `const variants = ${JSON.stringify(entries)};\n\nexport default {\n  format: ${JSON.stringify(entries[sourceIndex]!.format)},\n  height: ${entries[sourceIndex]!.height},\n  src: ${JSON.stringify(entries[sourceIndex]!.src)},\n  variants,\n  width: ${entries[sourceIndex]!.width},\n};\n`\n}\n\nconst writeDevImageResponse = async (\n  req: IncomingMessage,\n  res: ServerResponse,\n  config: Pick<ResolvedConfig, 'root' | 'server'>,\n) => {\n  const requestUrl = new URL(req.url ?? '/', 'http://localhost')\n  if (requestUrl.pathname !== DEV_IMAGE_ENDPOINT) {\n    return false\n  }\n\n  const filePath = requestUrl.searchParams.get('path')\n  const width = Number(requestUrl.searchParams.get('width'))\n  const format = requestUrl.searchParams.get('format')\n  if (!filePath || !Number.isFinite(width) || width <= 0) {\n    res.statusCode = 400\n    res.end('Invalid image request.')\n    return true\n  }\n\n  if (!(await isAllowedImagePath(filePath, config))) {\n    res.statusCode = 403\n    res.end('Image path is not allowed.')\n    return true\n  }\n\n  const image = await readLocalImage(filePath)\n  if (format === 'svg') {\n    res.setHeader('Cache-Control', 'no-store')\n    res.setHeader('Content-Type', 'image/svg+xml')\n    res.end(image.source)\n    return true\n  }\n\n  if (!format || !SUPPORTED_OUTPUT_FORMATS.has(format as ImageOutputFormat)) {\n    res.statusCode = 400\n    res.end('Invalid image format.')\n    return true\n  }\n\n  const [variant] = await buildVariantAssets(\n    image,\n    [Math.min(width, image.width)],\n    format as ImageOutputFormat,\n    DEFAULT_QUALITY,\n  )\n  if (!variant) {\n    res.statusCode = 500\n    res.end('Failed to render image variant.')\n    return true\n  }\n\n  res.setHeader('Cache-Control', 'no-store')\n  res.setHeader('Content-Type', toContentType(variant.format))\n  res.end(variant.buffer)\n  return true\n}\n\nexport const eclipsaImage = (options: EclipsaImageOptions = {}): Plugin => {\n  let config: ResolvedConfig | null = null\n\n  return {\n    configResolved(resolvedConfig) {\n      config = resolvedConfig\n    },\n    configureServer(server) {\n      server.middlewares.use(async (req, res, next) => {\n        try {\n          if (!config) {\n            next(new Error('vite-plugin-eclipsa-image requires a resolved Vite config.'))\n            return\n          }\n          if (await writeDevImageResponse(req, res, config)) {\n            return\n          }\n        } catch (error) {\n          next(error as Error)\n          return\n        }\n        next()\n      })\n    },\n    enforce: 'pre',\n    async load(id) {\n      const resolved = id.startsWith(VIRTUAL_IMAGE_PREFIX)\n        ? parseImageRequest(id.slice(VIRTUAL_IMAGE_PREFIX.length), options)\n        : null\n      if (!resolved) {\n        return null\n      }\n\n      const image = await readLocalImage(resolved.filePath)\n      const format = normalizeOutputFormat(image.format, resolved.format, options.formats ?? [])\n      const widths =\n        format === null ? [image.width] : resolveImageWidths(image.width, resolved.widths)\n      const variants = await buildVariantAssets(\n        image,\n        widths,\n        format,\n        options.quality ?? DEFAULT_QUALITY,\n      )\n\n      return config?.command === 'build'\n        ? createBuildModule(variants, resolved.filePath, this.emitFile.bind(this))\n        : createDevModule(variants, resolved.filePath)\n    },\n    name: 'vite-plugin-eclipsa-image',\n    async resolveId(source, importer) {\n      const requested = parseImageRequest(source, options)\n      if (!requested) {\n        return null\n      }\n\n      const resolved = await this.resolve(requested.filePath, importer, { skipSelf: true })\n      if (!resolved) {\n        return null\n      }\n\n      const params = new URLSearchParams(splitId(source).query)\n      return `${VIRTUAL_IMAGE_PREFIX}${resolved.id}?${params.toString()}`\n    },\n  }\n}\n"],"mappings":"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"}

package/mod.test.tsx

@@ -0,0 +1,116 @@
+import * as fs from 'node:fs/promises'
+import * as path from 'node:path'
+import { tmpdir } from 'node:os'
+import sharp from 'sharp'
+import { describe, expect, it } from 'vitest'
+import { Image } from './mod.ts'
+import {
+  createAssetName,
+  isAllowedImagePath,
+  readLocalImage,
+  resolveImageWidths,
+  toContentType,
+} from './vite.ts'
+
+describe('@eclipsa/image helpers', () => {
+  it('keeps configured widths ordered and appends the source width', () => {
+    expect(resolveImageWidths(1200, [960, 320, 320, 1600, -5])).toEqual([320, 960, 1200])
+  })
+
+  it('reads local image metadata', async () => {
+    const root = await fs.mkdtemp(path.join(tmpdir(), 'eclipsa-image-'))
+    const filePath = path.join(root, 'sample.png')
+
+    await sharp({
+      create: {
+        background: { alpha: 1, b: 200, g: 120, r: 40 },
+        channels: 4,
+        height: 600,
+        width: 900,
+      },
+    })
+      .png()
+      .toFile(filePath)
+
+    await expect(readLocalImage(filePath)).resolves.toMatchObject({
+      format: 'png',
+      height: 600,
+      width: 900,
+    })
+  })
+
+  it('returns the correct jpeg mime type', () => {
+    expect(toContentType('jpeg')).toBe('image/jpeg')
+    expect(toContentType('png')).toBe('image/png')
+  })
+
+  it('creates distinct emitted asset names for duplicate basenames', () => {
+    expect(createAssetName('/tmp/one/hero.png', 320, 'png')).not.toBe(
+      createAssetName('/tmp/two/hero.png', 320, 'png'),
+    )
+  })
+
+  it('only serves dev image paths inside the configured allowlist', async () => {
+    const root = await fs.mkdtemp(path.join(tmpdir(), 'eclipsa-image-root-'))
+    const allowed = path.join(root, 'allowed')
+    const denied = await fs.mkdtemp(path.join(tmpdir(), 'eclipsa-image-denied-'))
+    const allowedFile = path.join(allowed, 'hero.png')
+    const deniedFile = path.join(denied, 'hero.png')
+
+    await fs.mkdir(allowed, { recursive: true })
+    await fs.writeFile(allowedFile, 'ok')
+    await fs.writeFile(deniedFile, 'nope')
+
+    const config = {
+      root,
+      server: {
+        fs: {
+          allow: [allowed],
+        },
+      },
+    } as const
+
+    await expect(isAllowedImagePath(allowedFile, config as any)).resolves.toBe(true)
+    await expect(isAllowedImagePath(deniedFile, config as any)).resolves.toBe(false)
+  })
+
+  it('renders img defaults from imported metadata', () => {
+    const element = Image({
+      alt: 'Preview',
+      src: {
+        format: 'webp',
+        height: 400,
+        src: '/assets/example-960w.webp',
+        variants: [
+          {
+            format: 'webp',
+            height: 133,
+            src: '/assets/example-320w.webp',
+            width: 320,
+          },
+          {
+            format: 'webp',
+            height: 400,
+            src: '/assets/example-960w.webp',
+            width: 960,
+          },
+        ],
+        width: 960,
+      },
+    })
+
+    expect(element).toMatchObject({
+      props: {
+        alt: 'Preview',
+        decoding: 'async',
+        height: 400,
+        loading: 'lazy',
+        sizes: '100vw',
+        src: '/assets/example-960w.webp',
+        srcset: '/assets/example-320w.webp 320w, /assets/example-960w.webp 960w',
+        width: 960,
+      },
+      type: 'img',
+    })
+  })
+})

package/mod.ts

@@ -0,0 +1,81 @@
+export type ImageOutputFormat = 'avif' | 'jpeg' | 'png' | 'webp'
+
+export interface ImageVariant {
+  format: string
+  height: number
+  src: string
+  width: number
+}
+
+export interface ImageSource {
+  format: string
+  height: number
+  src: string
+  variants: ImageVariant[]
+  width: number
+}
+
+export interface ImageProps extends Record<string, unknown> {
+  alt: string
+  decoding?: 'async' | 'auto' | 'sync'
+  height?: number
+  loading?: 'eager' | 'lazy'
+  sizes?: string
+  src: ImageSource | string
+  srcset?: string
+  width?: number
+}
+
+export interface EclipsaImageOptions {
+  formats?: ImageOutputFormat[]
+  quality?: number
+  widths?: number[]
+}
+
+const createImageElement = (props: Record<string, unknown>) => ({
+  isStatic: false,
+  props,
+  type: 'img',
+})
+
+export const Image = ({
+  alt,
+  decoding = 'async',
+  height,
+  loading = 'lazy',
+  sizes,
+  src,
+  srcset,
+  width,
+  ...props
+}: ImageProps) => {
+  const imageProps =
+    typeof src === 'string'
+      ? {
+          ...props,
+          alt,
+          decoding,
+          height,
+          loading,
+          sizes,
+          src,
+          srcset,
+          width,
+        }
+      : {
+          ...props,
+          alt,
+          decoding,
+          height: height ?? src.height,
+          loading,
+          sizes: sizes ?? (src.variants.length > 1 ? '100vw' : undefined),
+          src: src.src,
+          srcset:
+            srcset ?? src.variants.map((variant) => `${variant.src} ${variant.width}w`).join(', '),
+          width: width ?? src.width,
+        }
+
+  return createImageElement({
+    ...imageProps,
+  })
+}

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@eclipsa/image",
+  "private": false,
+  "version": "0.0.0",
+  "homepage": "https://github.com/pnsk-lab/eclipsa",
+  "bugs": {
+    "url": "https://github.com/pnsk-lab/eclipsa/issues"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/pnsk-lab/eclipsa.git",
+    "directory": "packages/image"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./mod.ts",
+      "import": "./mod.ts"
+    },
+    "./client": {
+      "types": "./client.d.ts",
+      "import": "./client.ts"
+    },
+    "./vite": {
+      "types": "./vite.ts",
+      "import": "./vite.ts"
+    }
+  },
+  "publishConfig": {
+    "exports": {
+      ".": {
+        "types": "./mod.d.mts",
+        "import": "./mod.mjs"
+      },
+      "./client": {
+        "types": "./client.d.ts",
+        "import": "./client.mjs"
+      },
+      "./vite": {
+        "types": "./vite.d.mts",
+        "import": "./vite.mjs"
+      }
+    }
+  },
+  "scripts": {
+    "build": "vp pack && bun ../../scripts/release/write-dist-package-json.ts",
+    "pack": "vp pack && bun ../../scripts/release/write-dist-package-json.ts",
+    "test": "vp test --run",
+    "typecheck": "bun x tsc -p ../../tsconfig.json --noEmit"
+  },
+  "dependencies": {
+    "eclipsa": "0.2.0-alpha.0",
+    "sharp": "^0.34.5"
+  },
+  "peerDependencies": {
+    "vite": "*"
+  }
+}

package/vite-config.test.ts

@@ -0,0 +1,15 @@
+import { describe, expect, it } from 'vitest'
+import config from './vite.config.ts'
+
+describe('@eclipsa/image vite pack config', () => {
+  it('builds every published entrypoint with declarations', () => {
+    expect(config.pack).toMatchObject({
+      clean: true,
+      copy: ['client.d.ts'],
+      dts: true,
+      entry: ['mod.ts', 'client.ts', 'vite.ts'],
+      format: ['esm'],
+      sourcemap: true,
+    })
+  })
+})

package/vite.config.ts

@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite-plus'
+
+export default defineConfig({
+  test: {
+    include: ['*.test.ts', '*.test.tsx'],
+    environment: 'node',
+  },
+  pack: {
+    copy: ['client.d.ts'],
+    entry: ['mod.ts', 'client.ts', 'vite.ts'],
+    dts: true,
+    format: ['esm'],
+    clean: true,
+    sourcemap: true,
+  },
+})

package/vite.ts

@@ -0,0 +1,415 @@
+import type { IncomingMessage, ServerResponse } from 'node:http'
+import { createHash } from 'node:crypto'
+import * as fs from 'node:fs/promises'
+import * as path from 'node:path'
+import sharp from 'sharp'
+import type { Plugin, ResolvedConfig } from 'vite'
+import type { EclipsaImageOptions, ImageOutputFormat } from './mod.ts'
+
+const IMAGE_QUERY_FLAG = 'eclipsa-image'
+const VIRTUAL_IMAGE_PREFIX = '\0eclipsa-image:'
+const DEV_IMAGE_ENDPOINT = '/__eclipsa/image'
+const DEFAULT_WIDTHS = [320, 640, 960, 1280, 1600] as const
+const DEFAULT_QUALITY = 80
+const SUPPORTED_OUTPUT_FORMATS = new Set(['avif', 'jpeg', 'png', 'webp'] as const)
+
+interface ParsedImageRequest {
+  filePath: string
+  format: ImageOutputFormat | null
+  widths: number[]
+}
+
+interface LoadedImage {
+  format: string
+  height: number
+  source: Buffer
+  width: number
+}
+
+interface ImageVariantAsset {
+  buffer: Buffer
+  format: string
+  height: number
+  width: number
+}
+
+type PluginContext = {
+  emitFile: (emittedFile: {
+    fileName?: string
+    name?: string
+    source: string | Uint8Array
+    type: 'asset'
+  }) => string
+}
+
+const splitId = (id: string) => {
+  const queryIndex = id.indexOf('?')
+  return queryIndex === -1
+    ? { pathname: id, query: '' }
+    : {
+        pathname: id.slice(0, queryIndex),
+        query: id.slice(queryIndex + 1),
+      }
+}
+
+const toOutputExtension = (format: string) => (format === 'jpeg' ? 'jpg' : format)
+
+export const toContentType = (format: string) => {
+  if (format === 'svg') {
+    return 'image/svg+xml'
+  }
+  if (format === 'jpeg') {
+    return 'image/jpeg'
+  }
+  return `image/${toOutputExtension(format)}`
+}
+
+const toRoundedHeight = (sourceWidth: number, sourceHeight: number, targetWidth: number) =>
+  Math.max(1, Math.round((sourceHeight * targetWidth) / sourceWidth))
+
+export const resolveImageWidths = (sourceWidth: number, configuredWidths: readonly number[]) => {
+  const widths = configuredWidths
+    .map((value) => Math.floor(value))
+    .filter((value) => Number.isFinite(value) && value > 0 && value < sourceWidth)
+    .sort((left, right) => left - right)
+
+  return [...new Set(widths), sourceWidth]
+}
+
+export const readLocalImage = async (filePath: string): Promise<LoadedImage> => {
+  const source = await fs.readFile(filePath)
+  const metadata = await sharp(source, { animated: true }).metadata()
+  if (!metadata.width || !metadata.height || !metadata.format) {
+    throw new Error(`Unable to read image metadata for ${filePath}`)
+  }
+
+  return {
+    format: metadata.format,
+    height: metadata.height,
+    source,
+    width: metadata.width,
+  }
+}
+
+const resolveRealPath = async (filePath: string) => {
+  const resolvedPath = path.resolve(filePath)
+  try {
+    return await fs.realpath(resolvedPath)
+  } catch {
+    return resolvedPath
+  }
+}
+
+const isInsideDirectory = (filePath: string, directoryPath: string) => {
+  const relative = path.relative(directoryPath, filePath)
+  return relative === '' || (!relative.startsWith('..') && !path.isAbsolute(relative))
+}
+
+export const isAllowedImagePath = async (
+  filePath: string,
+  config: Pick<ResolvedConfig, 'root' | 'server'>,
+) => {
+  const allowedRoots = new Set<string>()
+  for (const allowedPath of [config.root, ...(config.server.fs.allow ?? [])]) {
+    allowedRoots.add(await resolveRealPath(path.resolve(config.root, allowedPath)))
+  }
+
+  const resolvedFilePath = await resolveRealPath(filePath)
+  for (const allowedRoot of allowedRoots) {
+    if (isInsideDirectory(resolvedFilePath, allowedRoot)) {
+      return true
+    }
+  }
+  return false
+}
+
+const parseWidths = (value: string | null) =>
+  value
+    ?.split(/[;,]/)
+    .map((part) => Number(part.trim()))
+    .filter((part) => Number.isFinite(part) && part > 0) ?? []
+
+const normalizeOutputFormat = (
+  sourceFormat: string,
+  requestedFormat: ImageOutputFormat | null,
+  configuredFormats: readonly ImageOutputFormat[],
+): ImageOutputFormat | null => {
+  if (requestedFormat) {
+    return requestedFormat
+  }
+  if (sourceFormat === 'svg') {
+    return null
+  }
+  if (SUPPORTED_OUTPUT_FORMATS.has(sourceFormat as ImageOutputFormat)) {
+    return sourceFormat as ImageOutputFormat
+  }
+  return configuredFormats[0] ?? 'webp'
+}
+
+const parseImageRequest = (id: string, options: EclipsaImageOptions): ParsedImageRequest | null => {
+  const { pathname, query } = splitId(id)
+  const params = new URLSearchParams(query)
+  if (!params.has(IMAGE_QUERY_FLAG)) {
+    return null
+  }
+
+  const format = params.get('format')
+  if (format && !SUPPORTED_OUTPUT_FORMATS.has(format as ImageOutputFormat)) {
+    throw new Error(
+      `Unsupported @eclipsa/image format "${format}". Expected one of avif, jpeg, png, webp.`,
+    )
+  }
+
+  const widths = parseWidths(params.get('widths'))
+
+  return {
+    filePath: pathname,
+    format: (format as ImageOutputFormat | null) ?? null,
+    widths: widths.length > 0 ? widths : (options.widths ?? [...DEFAULT_WIDTHS]),
+  }
+}
+
+const applyOutputFormat = (pipeline: sharp.Sharp, format: ImageOutputFormat, quality: number) => {
+  switch (format) {
+    case 'avif':
+      return pipeline.avif({ quality })
+    case 'jpeg':
+      return pipeline.jpeg({ mozjpeg: true, quality })
+    case 'png':
+      return pipeline.png({ compressionLevel: 9, quality })
+    case 'webp':
+      return pipeline.webp({ quality })
+  }
+}
+
+const buildVariantAssets = async (
+  image: LoadedImage,
+  variantWidths: readonly number[],
+  format: ImageOutputFormat | null,
+  quality: number,
+): Promise<ImageVariantAsset[]> => {
+  if (format === null) {
+    return [
+      {
+        buffer: image.source,
+        format: image.format,
+        height: image.height,
+        width: image.width,
+      },
+    ]
+  }
+
+  return Promise.all(
+    variantWidths.map(async (width) => {
+      const targetHeight = toRoundedHeight(image.width, image.height, width)
+      const resized = await applyOutputFormat(
+        sharp(image.source, { animated: true }).resize({
+          fit: 'inside',
+          height: targetHeight,
+          width,
+          withoutEnlargement: true,
+        }),
+        format,
+        quality,
+      ).toBuffer()
+
+      return {
+        buffer: resized,
+        format,
+        height: targetHeight,
+        width,
+      }
+    }),
+  )
+}
+
+export const createAssetName = (filePath: string, width: number, format: string) => {
+  const fileName = path.basename(filePath, path.extname(filePath))
+  const fileHash = createHash('sha1').update(path.normalize(filePath)).digest('hex').slice(0, 8)
+  return `${fileName}-${fileHash}-${width}w.${toOutputExtension(format)}`
+}
+
+const createBuildModule = (
+  variants: ImageVariantAsset[],
+  filePath: string,
+  emitFile: PluginContext['emitFile'],
+) => {
+  const references = variants.map((variant) =>
+    emitFile({
+      fileName: `assets/${createAssetName(filePath, variant.width, variant.format)}`,
+      name: createAssetName(filePath, variant.width, variant.format),
+      source: variant.buffer,
+      type: 'asset',
+    }),
+  )
+  const sourceIndex = variants.length - 1
+
+  return `const variants = [
+${variants
+  .map(
+    (variant, index) =>
+      `  { format: ${JSON.stringify(variant.format)}, height: ${variant.height}, src: import.meta.ROLLUP_FILE_URL_${references[index]}, width: ${variant.width} },`,
+  )
+  .join('\n')}
+];
+
+export default {
+  format: ${JSON.stringify(variants[sourceIndex]!.format)},
+  height: ${variants[sourceIndex]!.height},
+  src: import.meta.ROLLUP_FILE_URL_${references[sourceIndex]!},
+  variants,
+  width: ${variants[sourceIndex]!.width},
+};
+`
+}
+
+const createDevModule = (variants: ImageVariantAsset[], filePath: string) => {
+  const sourceIndex = variants.length - 1
+  const entries = variants.map((variant) => {
+    const params = new URLSearchParams({
+      format: variant.format,
+      path: filePath,
+      width: String(variant.width),
+    })
+    return {
+      format: variant.format,
+      height: variant.height,
+      src: `${DEV_IMAGE_ENDPOINT}?${params.toString()}`,
+      width: variant.width,
+    }
+  })
+
+  return `const variants = ${JSON.stringify(entries)};
+
+export default {
+  format: ${JSON.stringify(entries[sourceIndex]!.format)},
+  height: ${entries[sourceIndex]!.height},
+  src: ${JSON.stringify(entries[sourceIndex]!.src)},
+  variants,
+  width: ${entries[sourceIndex]!.width},
+};
+`
+}
+
+const writeDevImageResponse = async (
+  req: IncomingMessage,
+  res: ServerResponse,
+  config: Pick<ResolvedConfig, 'root' | 'server'>,
+) => {
+  const requestUrl = new URL(req.url ?? '/', 'http://localhost')
+  if (requestUrl.pathname !== DEV_IMAGE_ENDPOINT) {
+    return false
+  }
+
+  const filePath = requestUrl.searchParams.get('path')
+  const width = Number(requestUrl.searchParams.get('width'))
+  const format = requestUrl.searchParams.get('format')
+  if (!filePath || !Number.isFinite(width) || width <= 0) {
+    res.statusCode = 400
+    res.end('Invalid image request.')
+    return true
+  }
+
+  if (!(await isAllowedImagePath(filePath, config))) {
+    res.statusCode = 403
+    res.end('Image path is not allowed.')
+    return true
+  }
+
+  const image = await readLocalImage(filePath)
+  if (format === 'svg') {
+    res.setHeader('Cache-Control', 'no-store')
+    res.setHeader('Content-Type', 'image/svg+xml')
+    res.end(image.source)
+    return true
+  }
+
+  if (!format || !SUPPORTED_OUTPUT_FORMATS.has(format as ImageOutputFormat)) {
+    res.statusCode = 400
+    res.end('Invalid image format.')
+    return true
+  }
+
+  const [variant] = await buildVariantAssets(
+    image,
+    [Math.min(width, image.width)],
+    format as ImageOutputFormat,
+    DEFAULT_QUALITY,
+  )
+  if (!variant) {
+    res.statusCode = 500
+    res.end('Failed to render image variant.')
+    return true
+  }
+
+  res.setHeader('Cache-Control', 'no-store')
+  res.setHeader('Content-Type', toContentType(variant.format))
+  res.end(variant.buffer)
+  return true
+}
+
+export const eclipsaImage = (options: EclipsaImageOptions = {}): Plugin => {
+  let config: ResolvedConfig | null = null
+
+  return {
+    configResolved(resolvedConfig) {
+      config = resolvedConfig
+    },
+    configureServer(server) {
+      server.middlewares.use(async (req, res, next) => {
+        try {
+          if (!config) {
+            next(new Error('vite-plugin-eclipsa-image requires a resolved Vite config.'))
+            return
+          }
+          if (await writeDevImageResponse(req, res, config)) {
+            return
+          }
+        } catch (error) {
+          next(error as Error)
+          return
+        }
+        next()
+      })
+    },
+    enforce: 'pre',
+    async load(id) {
+      const resolved = id.startsWith(VIRTUAL_IMAGE_PREFIX)
+        ? parseImageRequest(id.slice(VIRTUAL_IMAGE_PREFIX.length), options)
+        : null
+      if (!resolved) {
+        return null
+      }
+
+      const image = await readLocalImage(resolved.filePath)
+      const format = normalizeOutputFormat(image.format, resolved.format, options.formats ?? [])
+      const widths =
+        format === null ? [image.width] : resolveImageWidths(image.width, resolved.widths)
+      const variants = await buildVariantAssets(
+        image,
+        widths,
+        format,
+        options.quality ?? DEFAULT_QUALITY,
+      )
+
+      return config?.command === 'build'
+        ? createBuildModule(variants, resolved.filePath, this.emitFile.bind(this))
+        : createDevModule(variants, resolved.filePath)
+    },
+    name: 'vite-plugin-eclipsa-image',
+    async resolveId(source, importer) {
+      const requested = parseImageRequest(source, options)
+      if (!requested) {
+        return null
+      }
+
+      const resolved = await this.resolve(requested.filePath, importer, { skipSelf: true })
+      if (!resolved) {
+        return null
+      }
+
+      const params = new URLSearchParams(splitId(source).query)
+      return `${VIRTUAL_IMAGE_PREFIX}${resolved.id}?${params.toString()}`
+    },
+  }
+}