@mapsight/traffic-style 5.0.0 → 5.0.1

package/meta.json

@@ -1,6 +1,6 @@
 {
     "name": "@mapsight/traffic-style",
-    "version": "5.0.0",
+    "version": "5.0.1",
     "copyright": "Open Mapsight",
     "defaultIcon": "ort",
     "icons": [

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mapsight/traffic-style",
   "description": "Mapsight Traffic Style",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "type": "module",
   "bin": {
     "traffic-icon-sprite": "scripts/traffic-icon-sprite.ts",
@@ -47,7 +47,7 @@
     "build:styles": "vector-style-compiler src/scss/default.scss --output tmp/mapsight-vector-styles --name default && cp tmp/mapsight-vector-styles/default.css dist",
     "clean": "rimraf tmp/* dist/*",
     "clean-build": "run-s clean build",
-    "copy": "run-p copy:src copy:misc",
+    "copy": "run-p copy:src copy:misc copy:scripts",
     "copy:misc": "cp package.json README.md *.scss dist/",
     "copy:scripts": "mkdirp dist; cp -r scripts dist/",
     "copy:src": "mkdirp dist/src; cp -r src/scss dist/src/",

package/scripts/create-meta-json.ts

@@ -0,0 +1,141 @@
+import {readFile, readdir} from "node:fs/promises";
+import path from "node:path";
+
+const colors = {
+	red: (str: string) => `\x1b[31m${str}\x1b[0m`,
+	yellow: (str: string) => `\x1b[33m${str}\x1b[0m`,
+};
+
+interface Icon {
+	fileName: string;
+	name: string;
+	variant: string;
+	suffix: string;
+}
+
+interface MetaIcon {
+	label?: {
+		de: string;
+		en: string;
+	};
+	aliases?: string[];
+	groups?: string[];
+}
+
+interface MetaData {
+	icons?: Record<string, MetaIcon>;
+	copyright?: string;
+	defaultIcon?: string;
+}
+
+interface PackageJson {
+	name: string;
+	version: string;
+}
+
+interface ResultIcon extends MetaIcon {
+	id: string;
+	variants: string[];
+}
+
+interface Result {
+	name: string;
+	version: string;
+	copyright: string;
+	defaultIcon?: string;
+	icons: ResultIcon[];
+}
+
+function parseIconName(fileName: string): Icon {
+	const parts = fileName.split(".");
+	if (parts.length < 2) {
+		throw new Error("Invalid file name: no extension");
+	}
+	const main = parts[0]!;
+	const suffix = parts[1]!;
+	const nameParts = main.split("-");
+	if (nameParts.length < 1) {
+		throw new Error("Invalid file name: no parts");
+	}
+	const variant = nameParts.pop()!;
+	const name = nameParts.join("-");
+
+	return {
+		fileName,
+		name,
+		variant,
+		suffix,
+	};
+}
+
+async function main() {
+	const argv = process.argv;
+	const [, , metaPath, srcPath] = argv;
+
+	if (!metaPath) {
+		throw new Error("argument metaPath missing");
+	}
+	if (!srcPath) {
+		throw new Error("argument srcPath missing");
+	}
+
+	const metaDataContent = await readFile(path.resolve(metaPath), "utf8");
+	// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+	const metaData: MetaData = JSON.parse(metaDataContent);
+
+	const packageJsonContent = await readFile("package.json", "utf8");
+	// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+	const packageJson: PackageJson = JSON.parse(packageJsonContent);
+
+	if (!metaData.icons) {
+		console.error(
+			colors.red("ERROR: No Icons field found in src/meta.json!"),
+		);
+	}
+
+	const result: Result = {
+		name: packageJson.name,
+		version: packageJson.version,
+		copyright: metaData.copyright || "Open Mapsight",
+		defaultIcon: metaData.defaultIcon,
+		icons: [],
+	};
+
+	const files = await readdir(srcPath);
+	const icons = files
+		.filter((fileName) => /(\.webp|\.png|\.svg)$/.test(fileName))
+		.map((iconFile) => parseIconName(iconFile));
+	const variants = [...new Set(icons.map(({variant}) => variant))];
+	const iconGroups = icons.reduce(
+		(groups, icon) => ({
+			...groups,
+			[icon.name]: {
+				...(groups[icon.name] || {}),
+				[icon.variant]: icon,
+			},
+		}),
+		{} as Record<string, Record<string, Icon>>,
+	);
+
+	Object.keys(iconGroups).forEach((name) => {
+		if (metaData.icons && !metaData.icons[name]) {
+			console.warn(
+				colors.yellow(
+					'WARNING: Icon "' +
+						name +
+						'" is not specified in src/meta.json!',
+				),
+			);
+		}
+
+		result.icons.push({
+			...((metaData.icons && metaData.icons[name]) || {}),
+			id: name,
+			variants: variants,
+		});
+	});
+
+	console.log(JSON.stringify(result, null, 4));
+}
+
+main().catch(console.error);

package/scripts/create-overview-md.ts

@@ -0,0 +1,110 @@
+import {readFile, readdir} from "fs/promises";
+
+import table from "markdown-table";
+
+interface Icon {
+	fileName: string;
+	name: string;
+	variant: string;
+	suffix: string;
+}
+
+interface MetaIcon {
+	label: {
+		de: string;
+		en: string;
+	};
+	aliases?: string[];
+	groups?: string[];
+}
+
+interface MetaData {
+	icons: Record<string, MetaIcon>;
+}
+
+function parseIconName(fileName: string): Icon {
+	const parts = fileName.split(".");
+	if (parts.length < 2) {
+		throw new Error("Invalid file name: no extension");
+	}
+	const [main = "", suffix = ""] = parts;
+	const nameParts = main.split("-");
+	if (nameParts.length < 1) {
+		throw new Error("Invalid file name: no variant");
+	}
+	const variant = nameParts.pop()!;
+	const name = nameParts.join("-");
+
+	return {
+		fileName,
+		name,
+		variant,
+		suffix,
+	};
+}
+
+function iconGroupsToRows(
+	variants: string[],
+	iconGroups: Record<string, Record<string, Icon>>,
+	imgPath: string,
+	metaData: MetaData,
+): string[][] {
+	return Object.keys(iconGroups).map((name) => [
+		name,
+		metaData.icons[name]?.label.de || "",
+		metaData.icons[name]?.label.en || "",
+		...variants.map((variant) => {
+			const icon = iconGroups[name]?.[variant];
+
+			return icon
+				? `![${icon.fileName}](${imgPath + icon.fileName})`
+				: "-/-";
+		}),
+		metaData.icons[name]?.aliases
+			? JSON.stringify(metaData.icons[name].aliases)
+			: "",
+		metaData.icons[name]?.groups
+			? JSON.stringify(metaData.icons[name].groups)
+			: "",
+	]);
+}
+
+async function main() {
+	const argv = process.argv;
+	const [, , srcPath, imgPath] = argv;
+	if (!srcPath) {
+		throw new Error("argument srcPath missing");
+	}
+	if (!imgPath) {
+		throw new Error("argument imgPath missing");
+	}
+
+	const metaDataContent = await readFile("src/meta.json", "utf8");
+	// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+	const metaData: MetaData = JSON.parse(metaDataContent);
+
+	const files = await readdir(srcPath);
+	const icons = files
+		.filter((fileName) => /(\.webp|\.png|\.svg)$/.test(fileName))
+		.map((iconFile) => parseIconName(iconFile));
+	const variants = [...new Set(icons.map(({variant}) => variant))];
+	const iconGroups = icons.reduce(
+		(groups, icon) => ({
+			...groups,
+			[icon.name]: {
+				...(groups[icon.name] || {}),
+				[icon.variant]: icon,
+			},
+		}),
+		{} as Record<string, Record<string, Icon>>,
+	);
+
+	const iconTable = [
+		["Name", "Label (de)", "Label (en)", ...variants, "Aliases", "Groups"],
+		...iconGroupsToRows(variants, iconGroups, imgPath, metaData),
+	];
+
+	console.log(table(iconTable));
+}
+
+main().catch(console.error);

package/scripts/lib/meta.ts

@@ -0,0 +1,40 @@
+import {z} from "zod/v4";
+
+export type IconVariant = z.infer<typeof IconVariantSchema>;
+export const IconVariantSchema = z.stringFormat(
+	"mapsight-icon-variant",
+	/[a-z]+/,
+);
+
+export type IconId = z.infer<typeof IconIdSchema>;
+export const IconIdSchema = z.stringFormat("mapsight-icon-id", /[0-9a-z-]+/);
+
+export type LangCode = z.infer<typeof LangCodeSchema>;
+export const LangCodeSchema = z.stringFormat("mapsight-lang-code", /[a-z]{2}/);
+
+export type IconGroupName = z.infer<typeof IconGroupNameSchema>;
+export const IconGroupNameSchema = z.stringFormat(
+	"mapsight-icon-group",
+	/[0-9a-z-]+/,
+);
+
+export type IconMeta = z.infer<typeof IconMetaSchema>;
+export const IconMetaSchema = z.object({
+	// The label object has dynamic keys for languages (e.g., "de", "en", "en_US")
+	// and string values for the text.
+	id: IconIdSchema,
+	label: z.record(LangCodeSchema, z.string()).optional(),
+	aliases: z.array(IconIdSchema).optional(),
+	groups: z.array(IconGroupNameSchema).optional(),
+	// The fallback field is optional.
+	fallback: IconIdSchema.optional(),
+});
+
+export type MetaData = z.infer<typeof DistMetaDataSchema>;
+export const DistMetaDataSchema = z.object({
+	name: z.string(),
+	version: z.string(),
+	copyright: z.string(),
+	defaultIcon: IconIdSchema,
+	icons: z.array(IconMetaSchema),
+});

package/scripts/optimize-icons.test.ts

@@ -0,0 +1,234 @@
+import {createHash} from "node:crypto";
+import {mkdir, readFile, rm, stat, unlink, writeFile} from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import {fileURLToPath} from "node:url";
+
+import {afterEach, beforeEach, describe, expect, it, vi} from "vitest";
+
+import {main} from "./optimize-icons";
+
+describe("optimize-icons.ts", () => {
+	let tmpDir: string;
+	let srcDir: string;
+	let destDir: string;
+
+	beforeEach(async () => {
+		tmpDir = path.join(
+			os.tmpdir(),
+			`optimize-icons-test-${Math.random().toString(36).slice(2)}`,
+		);
+		srcDir = path.join(tmpDir, "src");
+		destDir = path.join(tmpDir, "dest");
+		await mkdir(srcDir, {recursive: true});
+		await mkdir(destDir, {recursive: true});
+
+		// Mock process.exitCode to avoid affecting the test runner
+		vi.stubGlobal("process", {
+			...process,
+			exitCode: 0,
+		});
+	});
+
+	afterEach(async () => {
+		if (srcDir && destDir) {
+			try {
+				const manifestPath = getManifestPath(srcDir, destDir);
+				await unlink(manifestPath);
+			} catch {
+				// ignore if manifest doesn't exist
+			}
+		}
+		if (tmpDir) {
+			await rm(tmpDir, {recursive: true, force: true});
+		}
+		vi.unstubAllGlobals();
+	});
+
+	async function runScript(args: Record<string, string | boolean>) {
+		const argv = ["node", "optimize-icons.ts"];
+		for (const [key, value] of Object.entries(args)) {
+			if (typeof value === "boolean") {
+				if (value) argv.push(`--${key}`);
+			} else {
+				argv.push(`--${key}`, String(value));
+			}
+		}
+
+		vi.stubGlobal("process", {
+			...process,
+			argv,
+		});
+
+		await main();
+	}
+
+	function getManifestPath(src: string, dest: string) {
+		const scriptPath = fileURLToPath(import.meta.url);
+		const packageRoot = path.resolve(path.dirname(scriptPath), "..");
+		const hash = createHash("sha256")
+			.update(`${path.resolve(src)}:${path.resolve(dest)}`)
+			.digest("hex")
+			.slice(0, 16);
+		return path.join(
+			packageRoot,
+			"tmp",
+			`.optimize-icons-manifest-${hash}.json`,
+		);
+	}
+
+	it("should process an SVG file and produce SVG, PNG, and WebP outputs", async () => {
+		const svgContent = `<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><rect width="100" height="100" fill="red"/></svg>`;
+		await writeFile(path.join(srcDir, "test.svg"), svgContent);
+
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+		});
+
+		expect(await stat(path.join(destDir, "test.svg"))).toBeDefined();
+		expect(await stat(path.join(destDir, "test.png"))).toBeDefined();
+		expect(await stat(path.join(destDir, "test.webp"))).toBeDefined();
+
+		const manifestPath = getManifestPath(srcDir, destDir);
+		const manifestRaw = await readFile(manifestPath, "utf8");
+		// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+		const outputs = JSON.parse(manifestRaw).files["test.svg"].outputs as
+			| string[]
+			| undefined;
+		expect(outputs).toBeDefined();
+		expect(outputs).toContain("test.svg");
+		expect(outputs).toContain("test.png");
+		expect(outputs).toContain("test.webp");
+	});
+
+	it("should process a PNG file and produce PNG and WebP outputs", async () => {
+		// Create a tiny valid PNG using sharp if possible, or just a placeholder if we skip actual image check
+		// Since we have sharp available in the environment, let's use it if we can, but simpler is to use a minimal PNG buffer.
+		const sharp = (await import("sharp")).default;
+		const pngBuffer = await sharp({
+			create: {
+				width: 10,
+				height: 10,
+				channels: 4,
+				background: {r: 255, g: 0, b: 0, alpha: 0.5},
+			},
+		})
+			.png()
+			.toBuffer();
+
+		await writeFile(path.join(srcDir, "test.png"), pngBuffer);
+
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+		});
+
+		expect(await stat(path.join(destDir, "test.png"))).toBeDefined();
+		expect(await stat(path.join(destDir, "test.webp"))).toBeDefined();
+		await expect(
+			async () => await stat(path.join(destDir, "test.svg")),
+		).rejects.toThrow();
+	});
+
+	it("should scale images when --scale is provided", async () => {
+		const svgContent = `<svg width="10" height="10" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><rect width="100" height="100" fill="red"/></svg>`;
+		await writeFile(path.join(srcDir, "scale-test.svg"), svgContent);
+
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+			scale: "2",
+		});
+
+		const sharp = (await import("sharp")).default;
+		const metadata = await sharp(
+			path.join(destDir, "scale-test.png"),
+		).metadata();
+		expect(metadata.width).toBe(20);
+		expect(metadata.height).toBe(20);
+	});
+
+	it("should skip processing if files haven't changed", async () => {
+		const svgContent = `<svg width="10" height="10" xmlns="http://www.w3.org/2000/svg"><rect width="10" height="10" fill="red"/></svg>`;
+		const testFile = path.join(srcDir, "skip-test.svg");
+		await writeFile(testFile, svgContent);
+
+		// First run
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+			verbose: true,
+		});
+
+		const destFile = path.join(destDir, "skip-test.png");
+		const firstStat = await stat(destFile);
+
+		// Second run
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+			verbose: true,
+		});
+
+		const secondStat = await stat(destFile);
+		expect(secondStat.mtimeMs).toBe(firstStat.mtimeMs);
+	});
+
+	it("should only produce specified targets when --target is provided", async () => {
+		const svgContent = `<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><rect width="100" height="100" fill="red"/></svg>`;
+		await writeFile(path.join(srcDir, "target-test.svg"), svgContent);
+
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+			target: "png",
+		});
+
+		expect(await stat(path.join(destDir, "target-test.png"))).toBeDefined();
+		await expect(
+			async () => await stat(path.join(destDir, "target-test.svg")),
+		).rejects.toThrow();
+		await expect(
+			async () => await stat(path.join(destDir, "target-test.webp")),
+		).rejects.toThrow();
+
+		const manifestPath = getManifestPath(srcDir, destDir);
+		const manifestRaw = await readFile(manifestPath, "utf8");
+		// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+		const outputs = JSON.parse(manifestRaw).files["target-test.svg"]
+			.outputs as string[];
+		expect(outputs).toEqual(["target-test.png"]);
+	});
+
+	it("should produce multiple specified targets", async () => {
+		const svgContent = `<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><rect width="100" height="100" fill="red"/></svg>`;
+		await writeFile(path.join(srcDir, "multi-target.svg"), svgContent);
+
+		await runScript({
+			src: srcDir,
+			dest: destDir,
+			target: "svg,webp",
+		});
+
+		expect(
+			await stat(path.join(destDir, "multi-target.svg")),
+		).toBeDefined();
+		expect(
+			await stat(path.join(destDir, "multi-target.webp")),
+		).toBeDefined();
+		await expect(
+			async () => await stat(path.join(destDir, "multi-target.png")),
+		).rejects.toThrow();
+	});
+
+	it("should fail if an invalid target is provided", async () => {
+		await expect(
+			runScript({
+				src: srcDir,
+				dest: destDir,
+				target: "invalid",
+			}),
+		).rejects.toThrow("Invalid target format: invalid");
+	});
+});