@cyberalien/svg-utils 0.0.12 → 0.0.14

package/lib/helpers/hash/stringify.d.ts

@@ -1,5 +1,5 @@
 /**
  * Convert hash to a string, usable in CSS for class names and keyframes
  */
-declare function hashToString(value: number[], hasPrefix?: boolean, limit?: number, caseSensitive?: boolean): string;
+declare function hashToString(value: number[], css: boolean, hasPrefix?: boolean, limit?: number): string;
 export { hashToString };

package/lib/helpers/hash/stringify.js

@@ -1,11 +1,14 @@
-const baseChars = "abcdefghijklmnopqrstuvwxyz";
-const extraChars = "0123456789_-";
+const firstCSSChars = "abcdefghijklmnopqrstuvwxyz";
+const firstIDChars = firstCSSChars + firstCSSChars.toUpperCase();
+const numChars = "0123456789";
+const allCSSChars = firstCSSChars + numChars + "-_";
+const allIDChars = firstIDChars + numChars;
 /**
 * Convert hash to a string, usable in CSS for class names and keyframes
 */
-function hashToString(value, hasPrefix = true, limit = 8, caseSensitive = true) {
-	const firstChars = caseSensitive ? baseChars : `${baseChars}${baseChars.toUpperCase()}`;
-	const chars = firstChars + extraChars;
+function hashToString(value, css, hasPrefix = true, limit = 8) {
+	const firstChars = css ? firstCSSChars : firstIDChars;
+	const chars = css ? allCSSChars : allIDChars;
 	const firstLetterRadix = firstChars.length;
 	const letterRadix = chars.length;
 	const result = [];

package/lib/helpers/hash/unique.d.ts

@@ -1,17 +1,22 @@
 interface Options {
   prefix?: string;
   length: number;
-  caseSensitive?: boolean;
+  css: boolean;
   lengths?: Record<string, number>;
 }
 /**
  * Hash an object, make sure hash is unique
  *
- * Number of unique hashes per length, with prefix:
+ * Number of unique hashes per length, with prefix for CSS:
  * 6 chars = 2b unique hashes
  * 7 chars = 78b unique hashes <-- got collision here
  * 8 chars = 2.9t unique hashes
  * 9 chars = 113t unique hashes
+ *
+ * Numer of unique hashes per length, with prefix for ID:
+ * 6 chars = 47b unique hashes
+ * 7 chars = 2.9t unique hashes
+ * 8 chars = 183t unique hashes
  */
 declare function getUniqueHash(data: unknown, options: Options): string;
 export { getUniqueHash };

package/lib/helpers/hash/unique.js

@@ -7,19 +7,24 @@ const uniqueWithPrefixHashes = Object.create(null);
 /**
 * Hash an object, make sure hash is unique
 *
-* Number of unique hashes per length, with prefix:
+* Number of unique hashes per length, with prefix for CSS:
 * 6 chars = 2b unique hashes
 * 7 chars = 78b unique hashes <-- got collision here
 * 8 chars = 2.9t unique hashes
 * 9 chars = 113t unique hashes
+*
+* Numer of unique hashes per length, with prefix for ID:
+* 6 chars = 47b unique hashes
+* 7 chars = 2.9t unique hashes
+* 8 chars = 183t unique hashes
 */
 function getUniqueHash(data, options) {
-	const { prefix, length, lengths, caseSensitive } = options;
+	const { prefix, length, lengths, css } = options;
 	const str = typeof data === "string" ? data : JSON.stringify(sortObject(data));
 	const hasPrefix = !!prefix;
 	const values = hashString(str);
-	let hash = hashToString(values, hasPrefix, length, caseSensitive);
-	if (lengths?.[hash]) hash = hashToString(values, hasPrefix, lengths[hash], caseSensitive);
+	let hash = hashToString(values, css, hasPrefix, length);
+	if (lengths?.[hash]) hash = hashToString(values, css, hasPrefix, lengths[hash]);
 	const cache = hasPrefix ? uniqueWithPrefixHashes : uniqueHashes;
 	if (!cache[hash]) cache[hash] = str;
 	else if (cache[hash] !== str) {

package/lib/index.d.ts

@@ -6,4 +6,9 @@ import { ParsedXMLNode, ParsedXMLTagElement, ParsedXMLTextElement } from "./xml/
 import { iterateXMLContent } from "./xml/iterate.js";
 import { parseXMLContent } from "./xml/parse.js";
 import { stringifyXMLContent } from "./xml/stringify.js";
-export { ParsedXMLNode, ParsedXMLTagElement, ParsedXMLTextElement, cloneObject, compareSets, compareValues, hashString, iterateXMLContent, parseXMLContent, sortObject, stringifyXMLContent };
+import { ChangeIDResult } from "./svg/ids/types.js";
+import { changeIDInString } from "./svg/ids/change.js";
+import { removeDuplicateIDs } from "./svg/ids/duplicate.js";
+import { removeUnusedIDs } from "./svg/ids/unused.js";
+import { changeSVGIDs } from "./svg/ids.js";
+export { ChangeIDResult, ParsedXMLNode, ParsedXMLTagElement, ParsedXMLTextElement, changeIDInString, changeSVGIDs, cloneObject, compareSets, compareValues, hashString, iterateXMLContent, parseXMLContent, removeDuplicateIDs, removeUnusedIDs, sortObject, stringifyXMLContent };

package/lib/index.js

@@ -5,5 +5,9 @@ import { hashString } from "./helpers/hash/hash.js";
 import { iterateXMLContent } from "./xml/iterate.js";
 import { parseXMLContent } from "./xml/parse.js";
 import { stringifyXMLContent } from "./xml/stringify.js";
+import { changeIDInString } from "./svg/ids/change.js";
+import { removeDuplicateIDs } from "./svg/ids/duplicate.js";
+import { removeUnusedIDs } from "./svg/ids/unused.js";
+import { changeSVGIDs } from "./svg/ids.js";
 
-export { cloneObject, compareSets, compareValues, hashString, iterateXMLContent, parseXMLContent, sortObject, stringifyXMLContent };
+export { changeIDInString, changeSVGIDs, cloneObject, compareSets, compareValues, hashString, iterateXMLContent, parseXMLContent, removeDuplicateIDs, removeUnusedIDs, sortObject, stringifyXMLContent };

package/lib/svg/ids/change.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Change ID in a string
+ */
+declare function changeIDInString(value: string, oldID: string, newID: string): string;
+export { changeIDInString };

package/lib/svg/ids/change.js

@@ -0,0 +1,9 @@
+/**
+* Change ID in a string
+*/
+function changeIDInString(value, oldID, newID) {
+	const escapedID = oldID.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+	return value.replace(new RegExp("([#;\"])(" + escapedID + ")([\")]|\\.[a-z])", "g"), "$1" + newID + "$3");
+}
+
+export { changeIDInString };

package/lib/svg/ids/duplicate.d.ts

@@ -0,0 +1,7 @@
+import { ParsedXMLTagElement } from "../../xml/types.js";
+import { ChangeIDResult } from "./types.js";
+/**
+ * Remove duplicate IDs from SVG
+ */
+declare function removeDuplicateIDs(root: ParsedXMLTagElement[], data: ChangeIDResult): ParsedXMLTagElement[];
+export { removeDuplicateIDs };

package/lib/svg/ids/duplicate.js

@@ -0,0 +1,25 @@
+import { iterateXMLContent } from "../../xml/iterate.js";
+
+/**
+* Remove duplicate IDs from SVG
+*/
+function removeDuplicateIDs(root, data) {
+	const remove = /* @__PURE__ */ new Set();
+	for (const id in data.map) {
+		const nodes = data.map[id];
+		if (nodes.length > 1) remove.add(id);
+	}
+	if (remove.size) {
+		const removing = /* @__PURE__ */ new Set();
+		return iterateXMLContent(root, (node) => {
+			if (node.type !== "tag") return;
+			const id = node.attribs.id;
+			if (typeof id !== "string" || !remove.has(id)) return;
+			if (removing.has(id)) return "remove";
+			removing.add(id);
+		});
+	}
+	return root;
+}
+
+export { removeDuplicateIDs };

package/lib/svg/ids/types.d.ts

@@ -0,0 +1,6 @@
+import { ParsedXMLTagElement } from "../../xml/types.js";
+interface ChangeIDResult {
+  map: Record<string, ParsedXMLTagElement[]>;
+  usage: Record<string, ParsedXMLTagElement[]>;
+}
+export { ChangeIDResult };

package/lib/svg/ids/unused.d.ts

@@ -0,0 +1,7 @@
+import { ParsedXMLTagElement } from "../../xml/types.js";
+import { ChangeIDResult } from "./types.js";
+/**
+ * Remove duplicate IDs from SVG
+ */
+declare function removeUnusedIDs(root: ParsedXMLTagElement[], data: ChangeIDResult): ParsedXMLTagElement[];
+export { removeUnusedIDs };

package/lib/svg/ids/unused.js

@@ -0,0 +1,25 @@
+import { iterateXMLContent } from "../../xml/iterate.js";
+
+/**
+* Remove duplicate IDs from SVG
+*/
+function removeUnusedIDs(root, data) {
+	const remove = /* @__PURE__ */ new Set();
+	for (const id in data.usage) if (!data.usage[id].length) remove.add(id);
+	if (remove.size) return iterateXMLContent(root, (node, stack) => {
+		if (node.type !== "tag") return;
+		const id = node.attribs.id;
+		if (typeof id !== "string" || !remove.has(id)) return;
+		switch (node.tag) {
+			case "mask":
+			case "clipPath":
+			case "symbol": return "remove";
+		}
+		const parentNode = stack[stack.length - 1];
+		if (parentNode?.tag === "defs") return "remove";
+		delete node.attribs.id;
+	});
+	return root;
+}
+
+export { removeUnusedIDs };

package/lib/svg/ids.d.ts

@@ -1,12 +1,8 @@
 import { ParsedXMLTagElement } from "../xml/types.js";
+import { ChangeIDResult } from "./ids/types.js";
 type HashCallback = (id: string, content: string, tagName: string) => string;
-type Result = Record<string, ParsedXMLTagElement[]>;
 /**
  * Change IDs in SVG using a callback function
  */
-declare function changeSVGIDs(root: ParsedXMLTagElement[], callback: HashCallback): Result;
-/**
- * Remove duplicate IDs from SVG
- */
-declare function removeDuplicateIDs(root: ParsedXMLTagElement[], data: Result): ParsedXMLTagElement[];
-export { changeSVGIDs, removeDuplicateIDs };
+declare function changeSVGIDs(root: ParsedXMLTagElement[], callback: HashCallback): ChangeIDResult;
+export { changeSVGIDs };

package/lib/svg/ids.js

@@ -1,6 +1,6 @@
-import { cloneObject } from "../helpers/misc/clone.js";
 import { iterateXMLContent } from "../xml/iterate.js";
 import { stringifyXMLContent } from "../xml/stringify.js";
+import { changeIDInString } from "./ids/change.js";
 
 /**
 * Change IDs in SVG using a callback function
@@ -9,7 +9,10 @@ function changeSVGIDs(root, callback) {
 	const idMap = /* @__PURE__ */ new Map();
 	const idNodes = /* @__PURE__ */ new Map();
 	const nestedIDs = /* @__PURE__ */ new Map();
-	const results = Object.create(null);
+	const results = {
+		map: Object.create(null),
+		usage: Object.create(null)
+	};
 	const usage = [];
 	const parse = (replacement) => {
 		iterateXMLContent(root, (node, stack) => {
@@ -24,8 +27,8 @@ function changeSVGIDs(root, callback) {
 				} else if (nodeID === replacement[0]) {
 					const newID = replacement[1];
 					attribs.id = newID;
-					if (!results[newID]) results[newID] = [node];
-					else results[newID].push(node);
+					if (!results.map[newID]) results.map[newID] = [node];
+					else results.map[newID].push(node);
 				}
 			}
 			for (const attrib in attribs) {
@@ -92,39 +95,15 @@ function changeSVGIDs(root, callback) {
 			const nested = nestedIDs.get(id)?.filter((nestedID) => nestedID !== id && allIDs.has(nestedID)) ?? [];
 			if (parseAll || !nested.length) {
 				const node = idNodes.get(id);
-				const newNode = cloneObject(node);
-				delete newNode.attribs.id;
-				for (const usageItem of usage) if (usageItem.node === node && usageItem.id === id) {
-					const attr = usageItem.attrib;
-					const value = newNode.attribs[attr];
-					if (value === id) newNode.attribs[attr] = "";
-					else {
-						const parts = value.split(id);
-						const newValue = [];
-						const total = parts.length;
-						for (let i = 0; i < total; i++) {
-							if (i > 0) {
-								newValue.push(parts[i - 1]);
-								if (parts[i - i].slice(-1) !== ";") {
-									newValue.push(id);
-									continue;
-								}
-							}
-							if (i < total - 1) {
-								if (parts[i].slice(0, 1) !== ".") {
-									newValue.push(parts[i]);
-									continue;
-								}
-							}
-						}
-						newNode.attribs[attr] = newValue.join("");
-					}
-				}
-				const content = stringifyXMLContent([newNode]);
+				const content = stringifyXMLContent([node]);
 				if (!content) throw new Error(`Failed to stringify node with ID: ${id}`);
-				const newID = callback(id, content, node.tag);
+				const cleanedContent = changeIDInString(content, id, "{id}");
+				const newID = callback(id, cleanedContent, node.tag);
 				if (newID !== id) parse([id, newID]);
 				allIDs.delete(id);
+				const idUsage = [];
+				for (const item of usage) if (item.id === id) idUsage.push(item.node);
+				results.usage[newID] = idUsage;
 			}
 		}
 		return allIDs.size !== oldSize;
@@ -135,26 +114,5 @@ function changeSVGIDs(root, callback) {
 	}
 	return results;
 }
-/**
-* Remove duplicate IDs from SVG
-*/
-function removeDuplicateIDs(root, data) {
-	const remove = /* @__PURE__ */ new Set();
-	for (const id in data) {
-		const nodes = data[id];
-		if (nodes.length > 1) remove.add(id);
-	}
-	if (remove.size) {
-		const removing = /* @__PURE__ */ new Set();
-		return iterateXMLContent(root, (node) => {
-			if (node.type !== "tag") return;
-			const id = node.attribs.id;
-			if (typeof id !== "string" || !remove.has(id)) return;
-			if (removing.has(id)) return "remove";
-			removing.add(id);
-		});
-	}
-	return root;
-}
 
-export { changeSVGIDs, removeDuplicateIDs };
+export { changeSVGIDs };

package/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "description": "Common functions for working with SVG used by various packages.",
   "author": "Vjacheslav Trushkin",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "license": "MIT",
   "bugs": "https://github.com/cyberalien/svg-utils/issues",
   "homepage": "https://cyberalien.dev/",