@trackunit/shared-utils 0.0.88 → 0.0.89

package/index.cjs.js

@@ -531,6 +531,128 @@ const toID = (uuid) => Number(uuid.replace(/-/g, "").replace(/^0+/, ""));
  */
 const toIDs = (ids) => { var _a; return (_a = ids === null || ids === void 0 ? void 0 : ids.filter(id => !isNaN(toID(id))).map(id => toID(id))) !== null && _a !== void 0 ? _a : []; };
 
+/**
+ * Converts an HTMLImageElement to a PNG image.
+ *
+ * @param options - image options
+ * @param {HTMLImageElement} options.image - The image element to convert.
+ * @param {ImageDimensions} options.dimensions - The dimensions of the image.
+ * @param {number} options.maxHeight - The maximum height of the converted PNG image.
+ * @param {number} options.maxWidth - The maximum width of the converted PNG image.
+ * @param {number} options.idealArea - The ideal area of the converted PNG image.
+ * @returns The converted PNG image as a data URL.
+ * @throws Error if unable to get the canvas context.
+ */
+const toPNG = ({ image, dimensions, maxHeight, maxWidth, idealArea, }) => {
+    var _a, _b;
+    let width = (_a = dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) !== null && _a !== void 0 ? _a : image.width;
+    let height = (_b = dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) !== null && _b !== void 0 ? _b : image.height;
+    const scale = calculateImageScaleRatio(width, height, maxWidth, maxHeight, idealArea);
+    width = Math.round(width * scale);
+    height = Math.round(height * scale);
+    const canvas = document.createElement("canvas");
+    canvas.width = width;
+    canvas.height = height;
+    const canvasCtx = canvas.getContext("2d");
+    if (!canvasCtx) {
+        throw new Error("Unable to get canvas context");
+    }
+    canvasCtx.drawImage(image, 0, 0, width, height);
+    return canvas.toDataURL("image/png");
+};
+/**
+ * Calculates the scale ratio for an image to fit inside given bounds
+ * Result is based on the idealArea more info: https://nicksherman.com/size-by-area/
+ *
+ * @param {number} width The width of the image
+ * @param {number} height The height of the image
+ * @param {number} maxWidth The maxWidth of the image
+ * @param {number} maxHeight The maxHeight of the image
+ * @param {number} idealArea The ideal area for the image to cover (Read more above)
+ */
+const calculateImageScaleRatio = (width, height, maxWidth, maxHeight, idealArea) => {
+    // Get the max width based on idealArea
+    const maxImageWidth = Math.round(width * Math.sqrt(idealArea / (width * height)));
+    const ratio = maxImageWidth / width;
+    // If the area scaling is largen than the ares, scale to fix
+    if (width * ratio > maxWidth || height * ratio > maxHeight) {
+        const scaleX = maxWidth / width;
+        const scaleY = maxHeight / height;
+        const scale = scaleX < scaleY ? scaleX : scaleY; // Use the lowest scale to make it fit and scale uniformly
+        return scale;
+    }
+    return maxImageWidth / width;
+};
+/**
+ * Preloads a data url as an image.
+ *
+ * @param {string} dataUrl - The data url to preload.
+ * @returns {Promise<HTMLImageElement>} A promise that resolves to the preloaded image.
+ */
+const preload = (dataUrl) => {
+    return new Promise((resolve, reject) => {
+        const image = new Image();
+        image.src = dataUrl;
+        image.onload = () => resolve(image);
+        image.onerror = () => reject();
+    });
+};
+/**
+ * Extracts the type of an image from a data URL
+ *
+ * @param {string} dataURL the data URL to extract the type from.
+ * @returns {"jpg" | "png" | "svg"} the type of the encoded image.
+ * @throws
+ */
+const getMimeTypeFromDataURL = (dataURL) => {
+    const mimeToTypeMap = {
+        "image/svg+xml": "svg",
+        "image/jpeg": "jpeg",
+        "image/jpg": "jpeg",
+        "image/png": "png",
+    };
+    const matches = dataURL.match(/^data:(.*?);base64,/);
+    if (!matches || !matches[1]) {
+        throw new Error("Invalid file");
+    }
+    const type = mimeToTypeMap[matches[1]];
+    if (!type) {
+        throw new Error("File is not a supported image");
+    }
+    return type;
+};
+/**
+ * Fetches and image from a URL and converts it to a base64 encoded data url
+ *
+ * @param {string} url - url pointing to an image resource
+ * @returns {Promise<string>} base64 encoded data url.
+ * @throws
+ */
+const fetchImageAsBase64 = async (url) => {
+    // Fetch the image from the URL
+    const response = await fetch(url);
+    if (!response.ok) {
+        throw new Error(`Failed to fetch image. Status: ${response.status}`);
+    }
+    // Convert the response to a Blob
+    const blob = await response.blob();
+    // Convert the Blob to a Base64 string
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onloadend = () => {
+            if (typeof reader.result === "string") {
+                const base64String = reader.result;
+                resolve(base64String);
+            }
+            reject(new Error("Failed to convert Blob to Base64."));
+        };
+        reader.onerror = () => {
+            reject(new Error("Failed to convert Blob to Base64."));
+        };
+        reader.readAsDataURL(blob);
+    });
+};
+
 /**
  * Deletes all undefined keys from an object.
  *
@@ -982,6 +1104,137 @@ const stripHiddenCharacters = (input) => {
     return input.replace(hiddenRegex, "");
 };
 
+/**
+ * Convert the given value to HEX
+ * If the value is not rgb, returns back the same value
+ */
+const rgb2hex = (rgb) => {
+    var _a;
+    const hexColor = (_a = rgb
+        .match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)) === null || _a === void 0 ? void 0 : _a.slice(1).map(n => parseInt(n, 10).toString(16).padStart(2, "0")).join("");
+    return hexColor ? `#${hexColor}` : rgb;
+};
+/**
+ * Returns all svg related colors from a CSSStyleDeclaration
+ */
+const colorsFromStyleDeclaration = (styles) => {
+    return [styles.fill, styles.stroke, styles.stopColor].filter(color => color);
+};
+/**
+ * Loads the dimensions of an SVG string.
+ *
+ * @param base64EncodedSVG The SVG string to load dimensions from.
+ * @returns A promise that resolves to an object containing the width and height of the SVG.
+ * @throws {Error} If the SVG string is invalid or the dimensions cannot be determined.
+ */
+const loadSVGDimensions = (base64EncodedSVG) => {
+    return new Promise((resolve, reject) => {
+        // Create a temporary SVG element
+        const svgAsString = atob(base64EncodedSVG.replace("data:image/svg+xml;base64,", ""));
+        const parser = new DOMParser();
+        const svgDoc = parser.parseFromString(svgAsString, "image/svg+xml");
+        const svgElement = svgDoc.documentElement;
+        // Check if parsing was successful
+        if (svgElement.nodeName === "parsererror") {
+            reject(new Error("Invalid SVG string"));
+            return;
+        }
+        // Get dimensions
+        const width = svgElement.width.baseVal.value;
+        const height = svgElement.height.baseVal.value;
+        // If width and height are not set explicitly, try to get from viewBox
+        if (!width || !height) {
+            const viewBox = svgElement.viewBox.baseVal;
+            if (viewBox.width && viewBox.height) {
+                resolve({
+                    width: viewBox.width,
+                    height: viewBox.height,
+                });
+            }
+            else {
+                reject(new Error("Unable to determine SVG dimensions"));
+            }
+        }
+        else {
+            resolve({
+                width,
+                height,
+            });
+        }
+    });
+};
+/**
+ * Returns an array of all colors used in an svg
+ */
+const getAllColors = (base64EncodedSVG) => {
+    const svgAsString = atob(base64EncodedSVG.replace("data:image/svg+xml;base64,", ""));
+    const parser = new DOMParser();
+    const svgImage = parser.parseFromString(svgAsString, "image/svg+xml");
+    const colors = [];
+    svgImage.querySelectorAll("[style]").forEach(element => {
+        // Not all Elements have the style prop, this seems like a safe way to check and assert
+        if (element instanceof HTMLElement) {
+            const elementStyles = element.style;
+            colors.push(...colorsFromStyleDeclaration(elementStyles));
+        }
+    });
+    svgImage.querySelectorAll("style").forEach(element => {
+        var _a;
+        const cssRules = (_a = element.sheet) === null || _a === void 0 ? void 0 : _a.cssRules;
+        if (cssRules === null || cssRules === void 0 ? void 0 : cssRules.length) {
+            for (let i = 0; i < cssRules.length; i++) {
+                // Checking if the style attribute exists
+                const cssRule = cssRules[i]; // Replace type casting with type assertion
+                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                if (cssRule.style) {
+                    const cssRuleStyles = cssRule.style;
+                    colors.push(...colorsFromStyleDeclaration(cssRuleStyles));
+                }
+            }
+        }
+    });
+    // Get fills
+    svgImage.querySelectorAll("[fill]").forEach(element => {
+        var _a;
+        const color = (_a = element.attributes.getNamedItem("fill")) === null || _a === void 0 ? void 0 : _a.value;
+        if (color) {
+            colors.push(color);
+        }
+    });
+    // Get stokes
+    svgImage.querySelectorAll("[stroke]").forEach(element => {
+        var _a;
+        const color = (_a = element.attributes.getNamedItem("stroke")) === null || _a === void 0 ? void 0 : _a.value;
+        if (color) {
+            colors.push(color);
+        }
+    });
+    // Get stop-color (for gradients)
+    svgImage.querySelectorAll("[stop-color]").forEach(element => {
+        var _a;
+        const color = (_a = element.attributes.getNamedItem("stop-color")) === null || _a === void 0 ? void 0 : _a.value;
+        if (color) {
+            colors.push(color);
+        }
+    });
+    return [...new Set(colors.map(color => rgb2hex(color)))];
+};
+/**
+ * Converts a Base64 encoded SVG to a Scaled Base64 PNG.
+ *
+ * @param {string}  base64EncodedSVG    The Base64 encoded svg string to convert
+ * @param {number}  maxWidth            The max width(px) of the output PNG
+ * @param {number}  maxHeight           The max height(px) of the output PNG
+ * @returns {Promise<string>}    A Base64 encoded PNG, scaled to the given parameters
+ */
+const svgToPNG = async ({ base64EncodedSVG, maxWidth, maxHeight, idealArea, }) => {
+    const [image, dimensions] = await Promise.all([
+        preload(base64EncodedSVG),
+        loadSVGDimensions(base64EncodedSVG),
+    ]);
+    return toPNG({ image, dimensions, maxHeight, maxWidth, idealArea });
+};
+
 /* eslint-disable local-rules/prefer-custom-object-keys */
 /* eslint-disable local-rules/prefer-custom-object-from-entries */
 /**
@@ -1065,7 +1318,9 @@ exports.alphabeticallySort = alphabeticallySort;
 exports.arrayLengthCompare = arrayLengthCompare;
 exports.arrayNotEmpty = arrayNotEmpty;
 exports.booleanCompare = booleanCompare;
+exports.calculateImageScaleRatio = calculateImageScaleRatio;
 exports.capitalize = capitalize;
+exports.colorsFromStyleDeclaration = colorsFromStyleDeclaration;
 exports.convertBlobToBase64 = convertBlobToBase64;
 exports.convertMetersToYards = convertMetersToYards;
 exports.convertYardsToMeters = convertYardsToMeters;
@@ -1077,14 +1332,17 @@ exports.enumFromValue = enumFromValue;
 exports.enumFromValueTypesafe = enumFromValueTypesafe;
 exports.enumOrUndefinedFromValue = enumOrUndefinedFromValue;
 exports.exhaustiveCheck = exhaustiveCheck;
+exports.fetchImageAsBase64 = fetchImageAsBase64;
 exports.filterByMultiple = filterByMultiple;
 exports.formatAddress = formatAddress;
 exports.formatCoordinates = formatCoordinates;
 exports.fuzzySearch = fuzzySearch;
+exports.getAllColors = getAllColors;
 exports.getDifferenceBetweenDates = getDifferenceBetweenDates;
 exports.getEndOfDay = getEndOfDay;
 exports.getFirstLevelObjectPropertyDifferences = getFirstLevelObjectPropertyDifferences;
 exports.getISOStringFromDate = getISOStringFromDate;
+exports.getMimeTypeFromDataURL = getMimeTypeFromDataURL;
 exports.getResizedDimensions = getResizedDimensions;
 exports.getStartOfDay = getStartOfDay;
 exports.groupBy = groupBy;
@@ -1095,6 +1353,7 @@ exports.isArrayEqual = isArrayEqual;
 exports.isSorted = isSorted;
 exports.isUUID = isUUID;
 exports.isValidImage = isValidImage;
+exports.loadSVGDimensions = loadSVGDimensions;
 exports.nonNullable = nonNullable;
 exports.numberCompare = numberCompare;
 exports.numberCompareUnknownAfterHighest = numberCompareUnknownAfterHighest;
@@ -1104,17 +1363,21 @@ exports.objectFromEntries = objectFromEntries;
 exports.objectKeys = objectKeys;
 exports.objectValues = objectValues;
 exports.pick = pick;
+exports.preload = preload;
 exports.removeLeftPadding = removeLeftPadding;
 exports.resizeBlob = resizeBlob;
 exports.resizeImage = resizeImage;
+exports.rgb2hex = rgb2hex;
 exports.size = size;
 exports.stringCompare = stringCompare;
 exports.stringCompareFromKey = stringCompareFromKey;
 exports.stringNaturalCompare = stringNaturalCompare;
 exports.stripHiddenCharacters = stripHiddenCharacters;
+exports.svgToPNG = svgToPNG;
 exports.titleCase = titleCase;
 exports.toID = toID;
 exports.toIDs = toIDs;
+exports.toPNG = toPNG;
 exports.toUUID = toUUID;
 exports.trimIds = trimIds;
 exports.trimPath = trimPath;

package/index.esm.js

@@ -529,6 +529,128 @@ const toID = (uuid) => Number(uuid.replace(/-/g, "").replace(/^0+/, ""));
  */
 const toIDs = (ids) => { var _a; return (_a = ids === null || ids === void 0 ? void 0 : ids.filter(id => !isNaN(toID(id))).map(id => toID(id))) !== null && _a !== void 0 ? _a : []; };
 
+/**
+ * Converts an HTMLImageElement to a PNG image.
+ *
+ * @param options - image options
+ * @param {HTMLImageElement} options.image - The image element to convert.
+ * @param {ImageDimensions} options.dimensions - The dimensions of the image.
+ * @param {number} options.maxHeight - The maximum height of the converted PNG image.
+ * @param {number} options.maxWidth - The maximum width of the converted PNG image.
+ * @param {number} options.idealArea - The ideal area of the converted PNG image.
+ * @returns The converted PNG image as a data URL.
+ * @throws Error if unable to get the canvas context.
+ */
+const toPNG = ({ image, dimensions, maxHeight, maxWidth, idealArea, }) => {
+    var _a, _b;
+    let width = (_a = dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) !== null && _a !== void 0 ? _a : image.width;
+    let height = (_b = dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) !== null && _b !== void 0 ? _b : image.height;
+    const scale = calculateImageScaleRatio(width, height, maxWidth, maxHeight, idealArea);
+    width = Math.round(width * scale);
+    height = Math.round(height * scale);
+    const canvas = document.createElement("canvas");
+    canvas.width = width;
+    canvas.height = height;
+    const canvasCtx = canvas.getContext("2d");
+    if (!canvasCtx) {
+        throw new Error("Unable to get canvas context");
+    }
+    canvasCtx.drawImage(image, 0, 0, width, height);
+    return canvas.toDataURL("image/png");
+};
+/**
+ * Calculates the scale ratio for an image to fit inside given bounds
+ * Result is based on the idealArea more info: https://nicksherman.com/size-by-area/
+ *
+ * @param {number} width The width of the image
+ * @param {number} height The height of the image
+ * @param {number} maxWidth The maxWidth of the image
+ * @param {number} maxHeight The maxHeight of the image
+ * @param {number} idealArea The ideal area for the image to cover (Read more above)
+ */
+const calculateImageScaleRatio = (width, height, maxWidth, maxHeight, idealArea) => {
+    // Get the max width based on idealArea
+    const maxImageWidth = Math.round(width * Math.sqrt(idealArea / (width * height)));
+    const ratio = maxImageWidth / width;
+    // If the area scaling is largen than the ares, scale to fix
+    if (width * ratio > maxWidth || height * ratio > maxHeight) {
+        const scaleX = maxWidth / width;
+        const scaleY = maxHeight / height;
+        const scale = scaleX < scaleY ? scaleX : scaleY; // Use the lowest scale to make it fit and scale uniformly
+        return scale;
+    }
+    return maxImageWidth / width;
+};
+/**
+ * Preloads a data url as an image.
+ *
+ * @param {string} dataUrl - The data url to preload.
+ * @returns {Promise<HTMLImageElement>} A promise that resolves to the preloaded image.
+ */
+const preload = (dataUrl) => {
+    return new Promise((resolve, reject) => {
+        const image = new Image();
+        image.src = dataUrl;
+        image.onload = () => resolve(image);
+        image.onerror = () => reject();
+    });
+};
+/**
+ * Extracts the type of an image from a data URL
+ *
+ * @param {string} dataURL the data URL to extract the type from.
+ * @returns {"jpg" | "png" | "svg"} the type of the encoded image.
+ * @throws
+ */
+const getMimeTypeFromDataURL = (dataURL) => {
+    const mimeToTypeMap = {
+        "image/svg+xml": "svg",
+        "image/jpeg": "jpeg",
+        "image/jpg": "jpeg",
+        "image/png": "png",
+    };
+    const matches = dataURL.match(/^data:(.*?);base64,/);
+    if (!matches || !matches[1]) {
+        throw new Error("Invalid file");
+    }
+    const type = mimeToTypeMap[matches[1]];
+    if (!type) {
+        throw new Error("File is not a supported image");
+    }
+    return type;
+};
+/**
+ * Fetches and image from a URL and converts it to a base64 encoded data url
+ *
+ * @param {string} url - url pointing to an image resource
+ * @returns {Promise<string>} base64 encoded data url.
+ * @throws
+ */
+const fetchImageAsBase64 = async (url) => {
+    // Fetch the image from the URL
+    const response = await fetch(url);
+    if (!response.ok) {
+        throw new Error(`Failed to fetch image. Status: ${response.status}`);
+    }
+    // Convert the response to a Blob
+    const blob = await response.blob();
+    // Convert the Blob to a Base64 string
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onloadend = () => {
+            if (typeof reader.result === "string") {
+                const base64String = reader.result;
+                resolve(base64String);
+            }
+            reject(new Error("Failed to convert Blob to Base64."));
+        };
+        reader.onerror = () => {
+            reject(new Error("Failed to convert Blob to Base64."));
+        };
+        reader.readAsDataURL(blob);
+    });
+};
+
 /**
  * Deletes all undefined keys from an object.
  *
@@ -980,6 +1102,137 @@ const stripHiddenCharacters = (input) => {
     return input.replace(hiddenRegex, "");
 };
 
+/**
+ * Convert the given value to HEX
+ * If the value is not rgb, returns back the same value
+ */
+const rgb2hex = (rgb) => {
+    var _a;
+    const hexColor = (_a = rgb
+        .match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)) === null || _a === void 0 ? void 0 : _a.slice(1).map(n => parseInt(n, 10).toString(16).padStart(2, "0")).join("");
+    return hexColor ? `#${hexColor}` : rgb;
+};
+/**
+ * Returns all svg related colors from a CSSStyleDeclaration
+ */
+const colorsFromStyleDeclaration = (styles) => {
+    return [styles.fill, styles.stroke, styles.stopColor].filter(color => color);
+};
+/**
+ * Loads the dimensions of an SVG string.
+ *
+ * @param base64EncodedSVG The SVG string to load dimensions from.
+ * @returns A promise that resolves to an object containing the width and height of the SVG.
+ * @throws {Error} If the SVG string is invalid or the dimensions cannot be determined.
+ */
+const loadSVGDimensions = (base64EncodedSVG) => {
+    return new Promise((resolve, reject) => {
+        // Create a temporary SVG element
+        const svgAsString = atob(base64EncodedSVG.replace("data:image/svg+xml;base64,", ""));
+        const parser = new DOMParser();
+        const svgDoc = parser.parseFromString(svgAsString, "image/svg+xml");
+        const svgElement = svgDoc.documentElement;
+        // Check if parsing was successful
+        if (svgElement.nodeName === "parsererror") {
+            reject(new Error("Invalid SVG string"));
+            return;
+        }
+        // Get dimensions
+        const width = svgElement.width.baseVal.value;
+        const height = svgElement.height.baseVal.value;
+        // If width and height are not set explicitly, try to get from viewBox
+        if (!width || !height) {
+            const viewBox = svgElement.viewBox.baseVal;
+            if (viewBox.width && viewBox.height) {
+                resolve({
+                    width: viewBox.width,
+                    height: viewBox.height,
+                });
+            }
+            else {
+                reject(new Error("Unable to determine SVG dimensions"));
+            }
+        }
+        else {
+            resolve({
+                width,
+                height,
+            });
+        }
+    });
+};
+/**
+ * Returns an array of all colors used in an svg
+ */
+const getAllColors = (base64EncodedSVG) => {
+    const svgAsString = atob(base64EncodedSVG.replace("data:image/svg+xml;base64,", ""));
+    const parser = new DOMParser();
+    const svgImage = parser.parseFromString(svgAsString, "image/svg+xml");
+    const colors = [];
+    svgImage.querySelectorAll("[style]").forEach(element => {
+        // Not all Elements have the style prop, this seems like a safe way to check and assert
+        if (element instanceof HTMLElement) {
+            const elementStyles = element.style;
+            colors.push(...colorsFromStyleDeclaration(elementStyles));
+        }
+    });
+    svgImage.querySelectorAll("style").forEach(element => {
+        var _a;
+        const cssRules = (_a = element.sheet) === null || _a === void 0 ? void 0 : _a.cssRules;
+        if (cssRules === null || cssRules === void 0 ? void 0 : cssRules.length) {
+            for (let i = 0; i < cssRules.length; i++) {
+                // Checking if the style attribute exists
+                const cssRule = cssRules[i]; // Replace type casting with type assertion
+                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                if (cssRule.style) {
+                    const cssRuleStyles = cssRule.style;
+                    colors.push(...colorsFromStyleDeclaration(cssRuleStyles));
+                }
+            }
+        }
+    });
+    // Get fills
+    svgImage.querySelectorAll("[fill]").forEach(element => {
+        var _a;
+        const color = (_a = element.attributes.getNamedItem("fill")) === null || _a === void 0 ? void 0 : _a.value;
+        if (color) {
+            colors.push(color);
+        }
+    });
+    // Get stokes
+    svgImage.querySelectorAll("[stroke]").forEach(element => {
+        var _a;
+        const color = (_a = element.attributes.getNamedItem("stroke")) === null || _a === void 0 ? void 0 : _a.value;
+        if (color) {
+            colors.push(color);
+        }
+    });
+    // Get stop-color (for gradients)
+    svgImage.querySelectorAll("[stop-color]").forEach(element => {
+        var _a;
+        const color = (_a = element.attributes.getNamedItem("stop-color")) === null || _a === void 0 ? void 0 : _a.value;
+        if (color) {
+            colors.push(color);
+        }
+    });
+    return [...new Set(colors.map(color => rgb2hex(color)))];
+};
+/**
+ * Converts a Base64 encoded SVG to a Scaled Base64 PNG.
+ *
+ * @param {string}  base64EncodedSVG    The Base64 encoded svg string to convert
+ * @param {number}  maxWidth            The max width(px) of the output PNG
+ * @param {number}  maxHeight           The max height(px) of the output PNG
+ * @returns {Promise<string>}    A Base64 encoded PNG, scaled to the given parameters
+ */
+const svgToPNG = async ({ base64EncodedSVG, maxWidth, maxHeight, idealArea, }) => {
+    const [image, dimensions] = await Promise.all([
+        preload(base64EncodedSVG),
+        loadSVGDimensions(base64EncodedSVG),
+    ]);
+    return toPNG({ image, dimensions, maxHeight, maxWidth, idealArea });
+};
+
 /* eslint-disable local-rules/prefer-custom-object-keys */
 /* eslint-disable local-rules/prefer-custom-object-from-entries */
 /**
@@ -1057,4 +1310,4 @@ const uuidv4 = () => {
  */
 const uuidv5 = (name, namespace) => v5(name, namespace);
 
-export { DateTimeFormat, HoursAndMinutesFormat, align, alphabeticallySort, arrayLengthCompare, arrayNotEmpty, booleanCompare, capitalize, convertBlobToBase64, convertMetersToYards, convertYardsToMeters, dateCompare, deleteUndefinedKeys, difference, doNothing, enumFromValue, enumFromValueTypesafe, enumOrUndefinedFromValue, exhaustiveCheck, filterByMultiple, formatAddress, formatCoordinates, fuzzySearch, getDifferenceBetweenDates, getEndOfDay, getFirstLevelObjectPropertyDifferences, getISOStringFromDate, getResizedDimensions, getStartOfDay, groupBy, groupTinyDataToOthers, hourIntervals, intersection, isArrayEqual, isSorted, isUUID, isValidImage, nonNullable, numberCompare, numberCompareUnknownAfterHighest, objNotEmpty, objectEntries, objectFromEntries, objectKeys, objectValues, pick, removeLeftPadding, resizeBlob, resizeImage, size, stringCompare, stringCompareFromKey, stringNaturalCompare, stripHiddenCharacters, titleCase, toID, toIDs, toUUID, trimIds, trimPath, truthy, unionArraysByKey, uuidv3, uuidv4, uuidv5 };
+export { DateTimeFormat, HoursAndMinutesFormat, align, alphabeticallySort, arrayLengthCompare, arrayNotEmpty, booleanCompare, calculateImageScaleRatio, capitalize, colorsFromStyleDeclaration, convertBlobToBase64, convertMetersToYards, convertYardsToMeters, dateCompare, deleteUndefinedKeys, difference, doNothing, enumFromValue, enumFromValueTypesafe, enumOrUndefinedFromValue, exhaustiveCheck, fetchImageAsBase64, filterByMultiple, formatAddress, formatCoordinates, fuzzySearch, getAllColors, getDifferenceBetweenDates, getEndOfDay, getFirstLevelObjectPropertyDifferences, getISOStringFromDate, getMimeTypeFromDataURL, getResizedDimensions, getStartOfDay, groupBy, groupTinyDataToOthers, hourIntervals, intersection, isArrayEqual, isSorted, isUUID, isValidImage, loadSVGDimensions, nonNullable, numberCompare, numberCompareUnknownAfterHighest, objNotEmpty, objectEntries, objectFromEntries, objectKeys, objectValues, pick, preload, removeLeftPadding, resizeBlob, resizeImage, rgb2hex, size, stringCompare, stringCompareFromKey, stringNaturalCompare, stripHiddenCharacters, svgToPNG, titleCase, toID, toIDs, toPNG, toUUID, trimIds, trimPath, truthy, unionArraysByKey, uuidv3, uuidv4, uuidv5 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/shared-utils",
-  "version": "0.0.88",
+  "version": "0.0.89",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/imageTools.d.ts

@@ -0,0 +1,59 @@
+export interface ImageDimensions {
+    width: number;
+    height: number;
+}
+/**
+ * Converts an HTMLImageElement to a PNG image.
+ *
+ * @param options - image options
+ * @param {HTMLImageElement} options.image - The image element to convert.
+ * @param {ImageDimensions} options.dimensions - The dimensions of the image.
+ * @param {number} options.maxHeight - The maximum height of the converted PNG image.
+ * @param {number} options.maxWidth - The maximum width of the converted PNG image.
+ * @param {number} options.idealArea - The ideal area of the converted PNG image.
+ * @returns The converted PNG image as a data URL.
+ * @throws Error if unable to get the canvas context.
+ */
+export declare const toPNG: ({ image, dimensions, maxHeight, maxWidth, idealArea, }: {
+    image: HTMLImageElement;
+    dimensions?: ImageDimensions;
+    maxHeight: number;
+    maxWidth: number;
+    idealArea: number;
+}) => string;
+/**
+ * Calculates the scale ratio for an image to fit inside given bounds
+ * Result is based on the idealArea more info: https://nicksherman.com/size-by-area/
+ *
+ * @param {number} width The width of the image
+ * @param {number} height The height of the image
+ * @param {number} maxWidth The maxWidth of the image
+ * @param {number} maxHeight The maxHeight of the image
+ * @param {number} idealArea The ideal area for the image to cover (Read more above)
+ */
+export declare const calculateImageScaleRatio: (width: number, height: number, maxWidth: number, maxHeight: number, idealArea: number) => number;
+/**
+ * Preloads a data url as an image.
+ *
+ * @param {string} dataUrl - The data url to preload.
+ * @returns {Promise<HTMLImageElement>} A promise that resolves to the preloaded image.
+ */
+export declare const preload: (dataUrl: string) => Promise<HTMLImageElement>;
+type ImageType = "jpeg" | "png" | "svg";
+/**
+ * Extracts the type of an image from a data URL
+ *
+ * @param {string} dataURL the data URL to extract the type from.
+ * @returns {"jpg" | "png" | "svg"} the type of the encoded image.
+ * @throws
+ */
+export declare const getMimeTypeFromDataURL: (dataURL: string) => ImageType;
+/**
+ * Fetches and image from a URL and converts it to a base64 encoded data url
+ *
+ * @param {string} url - url pointing to an image resource
+ * @returns {Promise<string>} base64 encoded data url.
+ * @throws
+ */
+export declare const fetchImageAsBase64: (url: string) => Promise<string>;
+export {};

package/src/index.d.ts

@@ -12,12 +12,14 @@ export * from "./filter";
 export * from "./groupBy/groupBy";
 export * from "./GroupingUtility";
 export * from "./idUtils";
+export * from "./imageTools";
 export * from "./Maybe";
 export * from "./objectUtils";
 export * from "./pathUtils";
 export * from "./pictureUtils/pictureUtils";
 export * from "./sorting/sorting";
 export * from "./stringUtils";
+export * from "./svgTools";
 export * from "./translationUtils";
 export * from "./typeUtils";
 export * from "./UnitOfMeasurementConverter";

package/src/svgTools.d.ts

@@ -0,0 +1,36 @@
+import { type ImageDimensions } from "./imageTools";
+/**
+ * Convert the given value to HEX
+ * If the value is not rgb, returns back the same value
+ */
+export declare const rgb2hex: (rgb: string) => string;
+/**
+ * Returns all svg related colors from a CSSStyleDeclaration
+ */
+export declare const colorsFromStyleDeclaration: (styles: CSSStyleDeclaration) => string[];
+/**
+ * Loads the dimensions of an SVG string.
+ *
+ * @param base64EncodedSVG The SVG string to load dimensions from.
+ * @returns A promise that resolves to an object containing the width and height of the SVG.
+ * @throws {Error} If the SVG string is invalid or the dimensions cannot be determined.
+ */
+export declare const loadSVGDimensions: (base64EncodedSVG: string) => Promise<ImageDimensions>;
+/**
+ * Returns an array of all colors used in an svg
+ */
+export declare const getAllColors: (base64EncodedSVG: string) => string[];
+/**
+ * Converts a Base64 encoded SVG to a Scaled Base64 PNG.
+ *
+ * @param {string}  base64EncodedSVG    The Base64 encoded svg string to convert
+ * @param {number}  maxWidth            The max width(px) of the output PNG
+ * @param {number}  maxHeight           The max height(px) of the output PNG
+ * @returns {Promise<string>}    A Base64 encoded PNG, scaled to the given parameters
+ */
+export declare const svgToPNG: ({ base64EncodedSVG, maxWidth, maxHeight, idealArea, }: {
+    base64EncodedSVG: string;
+    maxWidth: number;
+    maxHeight: number;
+    idealArea: number;
+}) => Promise<string>;