+6
@@ -0,0 +1,6 @@
|
||||
import { CustomIconLoader, IconifyLoaderOptions, InlineCollection } from "./types.js";
|
||||
/**
|
||||
* Get custom icon from inline collection or using loader
|
||||
*/
|
||||
declare function getCustomIcon(custom: CustomIconLoader | InlineCollection, collection: string, icon: string, options?: IconifyLoaderOptions): Promise<string | undefined>;
|
||||
export { getCustomIcon };
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
import { trimSVG } from "../svg/trim.js";
|
||||
import { mergeIconProps } from "./utils.js";
|
||||
/**
|
||||
* Get custom icon from inline collection or using loader
|
||||
*/
|
||||
async function getCustomIcon(custom, collection, icon, options) {
|
||||
let result;
|
||||
try {
|
||||
if (typeof custom === "function") result = await custom(icon);
|
||||
else {
|
||||
const inline = custom[icon];
|
||||
result = typeof inline === "function" ? await inline() : inline;
|
||||
}
|
||||
} catch (err) {
|
||||
console.warn(`Failed to load custom icon "${icon}" in "${collection}":`, err);
|
||||
return;
|
||||
}
|
||||
if (result) {
|
||||
const cleanupIdx = result.indexOf("<svg");
|
||||
if (cleanupIdx > 0) result = result.slice(cleanupIdx);
|
||||
const { transform } = options?.customizations ?? {};
|
||||
result = typeof transform === "function" ? await transform(result, collection, icon) : result;
|
||||
if (!result.startsWith("<svg")) {
|
||||
console.warn(`Custom icon "${icon}" in "${collection}" is not a valid SVG`);
|
||||
return result;
|
||||
}
|
||||
return await mergeIconProps(options?.customizations?.trimCustomSvg === true ? trimSVG(result) : result, collection, icon, options, void 0);
|
||||
}
|
||||
}
|
||||
export { getCustomIcon };
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
import { AutoInstall, CustomIconLoader, ExternalPkgName } from "./types.js";
|
||||
/**
|
||||
* Creates a CustomIconLoader collection from an external package collection.
|
||||
*
|
||||
* @param packageName The package name.
|
||||
* @param autoInstall {AutoInstall} [autoInstall=false] - whether to automatically install
|
||||
*/
|
||||
declare function createExternalPackageIconLoader(packageName: ExternalPkgName, autoInstall?: AutoInstall, cwd?: string): Record<string, CustomIconLoader>;
|
||||
export { createExternalPackageIconLoader };
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
import { getPossibleIconNames } from "./utils.js";
|
||||
import { searchForIcon } from "./modern.js";
|
||||
import { warnOnce } from "./warn.js";
|
||||
import { loadCollectionFromFS } from "./fs.js";
|
||||
/**
|
||||
* Creates a CustomIconLoader collection from an external package collection.
|
||||
*
|
||||
* @param packageName The package name.
|
||||
* @param autoInstall {AutoInstall} [autoInstall=false] - whether to automatically install
|
||||
*/
|
||||
function createExternalPackageIconLoader(packageName, autoInstall = false, cwd) {
|
||||
let scope;
|
||||
let collection;
|
||||
const collections = {};
|
||||
if (typeof packageName === "string") {
|
||||
if (packageName.length === 0) {
|
||||
warnOnce(`invalid package name, it is empty`);
|
||||
return collections;
|
||||
}
|
||||
if (packageName[0] === "@") {
|
||||
if (packageName.indexOf("/") === -1) {
|
||||
warnOnce(`invalid scoped package name "${packageName}"`);
|
||||
return collections;
|
||||
}
|
||||
[scope, collection] = packageName.split("/");
|
||||
} else {
|
||||
scope = "";
|
||||
collection = packageName;
|
||||
}
|
||||
} else [scope, collection] = packageName;
|
||||
collections[collection] = createCustomIconLoader(scope, collection, autoInstall, cwd);
|
||||
return collections;
|
||||
}
|
||||
function createCustomIconLoader(scope, collection, autoInstall, cwd) {
|
||||
const iconSetPromise = loadCollectionFromFS(collection, autoInstall, scope, cwd);
|
||||
return (async (icon) => {
|
||||
const iconSet = await iconSetPromise;
|
||||
let result;
|
||||
if (iconSet) result = await searchForIcon(iconSet, collection, getPossibleIconNames(icon));
|
||||
return result;
|
||||
});
|
||||
}
|
||||
export { createExternalPackageIconLoader };
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
import { AutoInstall } from "./types.js";
|
||||
import { IconifyJSON } from "@iconify/types";
|
||||
/**
|
||||
* Asynchronously loads a collection from the file system.
|
||||
*
|
||||
* @param name {string} the name of the collection, e.g. 'mdi'
|
||||
* @param autoInstall {AutoInstall} [autoInstall=false] - whether to automatically install
|
||||
* @param scope {string} [scope='@iconify-json'] - the scope of the collection, e.g. '@my-company-json'
|
||||
* @param cwd {string} [cwd=process.cwd()] - current working directory for caching
|
||||
* @return {Promise<IconifyJSON | undefined>} the loaded IconifyJSON or undefined
|
||||
*/
|
||||
declare function loadCollectionFromFS(name: string, autoInstall?: AutoInstall, scope?: string, cwd?: string): Promise<IconifyJSON | undefined>;
|
||||
export { loadCollectionFromFS };
|
||||
+53
@@ -0,0 +1,53 @@
|
||||
import { tryInstallPkg } from "./install-pkg.js";
|
||||
import { resolvePathAsync } from "./resolve.js";
|
||||
import { promises } from "fs";
|
||||
import { pathToFileURL } from "node:url";
|
||||
const _collections = Object.create(null);
|
||||
/** Check if full package exists, per cwd value */
|
||||
const isLegacyExists = Object.create(null);
|
||||
/**
|
||||
* Asynchronously loads a collection from the file system.
|
||||
*
|
||||
* @param name {string} the name of the collection, e.g. 'mdi'
|
||||
* @param autoInstall {AutoInstall} [autoInstall=false] - whether to automatically install
|
||||
* @param scope {string} [scope='@iconify-json'] - the scope of the collection, e.g. '@my-company-json'
|
||||
* @param cwd {string} [cwd=process.cwd()] - current working directory for caching
|
||||
* @return {Promise<IconifyJSON | undefined>} the loaded IconifyJSON or undefined
|
||||
*/
|
||||
async function loadCollectionFromFS(name, autoInstall = false, scope = "@iconify-json", cwd = process.cwd()) {
|
||||
const cache = _collections[cwd] || (_collections[cwd] = Object.create(null));
|
||||
if (!await cache[name]) cache[name] = task();
|
||||
return cache[name];
|
||||
async function task() {
|
||||
const packageName = scope.length === 0 ? name : `${scope}/${name}`;
|
||||
let jsonPath = await resolvePathAsync(`${packageName}/icons.json`, cwd);
|
||||
if (scope === "@iconify-json") {
|
||||
if (isLegacyExists[cwd] === void 0) isLegacyExists[cwd] = !!await resolvePathAsync(`@iconify/json/collections.json`, cwd);
|
||||
const checkLegacy = isLegacyExists[cwd];
|
||||
if (!jsonPath && checkLegacy) jsonPath = await resolvePathAsync(`@iconify/json/json/${name}.json`, cwd);
|
||||
if (!jsonPath && !checkLegacy && autoInstall) {
|
||||
await tryInstallPkg(packageName, autoInstall);
|
||||
jsonPath = await resolvePathAsync(`${packageName}/icons.json`, cwd);
|
||||
}
|
||||
} else if (!jsonPath && autoInstall) {
|
||||
await tryInstallPkg(packageName, autoInstall);
|
||||
jsonPath = await resolvePathAsync(`${packageName}/icons.json`, cwd);
|
||||
}
|
||||
if (!jsonPath) {
|
||||
const packagePath = await resolvePathAsync(packageName, cwd);
|
||||
if (packagePath) {
|
||||
const { icons } = await import(pathToFileURL(packagePath).href);
|
||||
if (icons) return icons;
|
||||
}
|
||||
}
|
||||
let stat;
|
||||
try {
|
||||
stat = jsonPath ? await promises.lstat(jsonPath) : void 0;
|
||||
} catch (err) {
|
||||
return;
|
||||
}
|
||||
if (stat?.isFile()) return JSON.parse(await promises.readFile(jsonPath, "utf8"));
|
||||
else return;
|
||||
}
|
||||
}
|
||||
export { loadCollectionFromFS };
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import { AutoInstall } from "./types.js";
|
||||
declare function tryInstallPkg(name: string, autoInstall: AutoInstall): Promise<void | undefined>;
|
||||
export { tryInstallPkg };
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
import { warnOnce } from "./warn.js";
|
||||
import { installPackage } from "@antfu/install-pkg";
|
||||
import { styleText } from "node:util";
|
||||
let pending;
|
||||
const tasks = {};
|
||||
const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
|
||||
async function tryInstallPkg(name, autoInstall) {
|
||||
if (pending) await pending;
|
||||
if (!tasks[name]) {
|
||||
console.log(styleText("cyan", `Installing ${name}...`));
|
||||
if (typeof autoInstall === "function") tasks[name] = pending = autoInstall(name).then(() => sleep(300)).finally(() => {
|
||||
pending = void 0;
|
||||
});
|
||||
else tasks[name] = pending = installPackage(name, {
|
||||
dev: true,
|
||||
preferOffline: true
|
||||
}).then(() => sleep(300)).catch((e) => {
|
||||
warnOnce(`Failed to install ${name}`);
|
||||
console.error(e);
|
||||
}).finally(() => {
|
||||
pending = void 0;
|
||||
});
|
||||
}
|
||||
return tasks[name];
|
||||
}
|
||||
export { tryInstallPkg };
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import { UniversalIconLoader } from "./types.js";
|
||||
declare const loadIcon: UniversalIconLoader;
|
||||
export { loadIcon };
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
import { getCustomIcon } from "./custom.js";
|
||||
import { searchForIcon } from "./modern.js";
|
||||
const loadIcon = async (collection, icon, options) => {
|
||||
const custom = options?.customCollections?.[collection];
|
||||
if (custom) if (typeof custom === "function") {
|
||||
let result;
|
||||
try {
|
||||
result = await custom(icon);
|
||||
} catch (err) {
|
||||
console.warn(`Failed to load custom icon "${icon}" in "${collection}":`, err);
|
||||
return;
|
||||
}
|
||||
if (result) {
|
||||
if (typeof result === "string") return await getCustomIcon(() => result, collection, icon, options);
|
||||
if ("icons" in result) {
|
||||
const ids = [
|
||||
icon,
|
||||
icon.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(),
|
||||
icon.replace(/([a-z])(\d+)/g, "$1-$2")
|
||||
];
|
||||
return await searchForIcon(result, collection, ids, options);
|
||||
}
|
||||
}
|
||||
} else return await getCustomIcon(custom, collection, icon, options);
|
||||
};
|
||||
export { loadIcon };
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import { IconifyLoaderOptions } from "./types.js";
|
||||
import { IconifyJSON } from "@iconify/types";
|
||||
declare function searchForIcon(iconSet: IconifyJSON, collection: string, ids: string[], options?: IconifyLoaderOptions): Promise<string | undefined>;
|
||||
export { searchForIcon };
|
||||
+27
@@ -0,0 +1,27 @@
|
||||
import { defaultIconCustomisations } from "../customisations/defaults.js";
|
||||
import { getIconData } from "../icon-set/get-icon.js";
|
||||
import { iconToSVG } from "../svg/build.js";
|
||||
import { loaderDefaultHeightProp, loaderDefaultWidthProp, mergeIconProps } from "./utils.js";
|
||||
async function searchForIcon(iconSet, collection, ids, options) {
|
||||
let iconData;
|
||||
const { customize } = options?.customizations ?? {};
|
||||
for (const id of ids) {
|
||||
iconData = getIconData(iconSet, id);
|
||||
if (iconData) {
|
||||
let defaultCustomizations = { ...defaultIconCustomisations };
|
||||
if (typeof customize === "function") {
|
||||
iconData = Object.assign({}, iconData);
|
||||
defaultCustomizations = customize(defaultCustomizations, iconData, `${collection}:${id}`) ?? defaultCustomizations;
|
||||
}
|
||||
const { attributes: { width, height, ...restAttributes }, body } = iconToSVG(iconData, defaultCustomizations);
|
||||
return await mergeIconProps(`<svg >${body}</svg>`, collection, id, options, () => {
|
||||
return {
|
||||
...restAttributes,
|
||||
...width ? { [loaderDefaultWidthProp]: width } : {},
|
||||
...height ? { [loaderDefaultHeightProp]: height } : {}
|
||||
};
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
export { searchForIcon };
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import { UniversalIconLoader } from "./types.js";
|
||||
declare const loadNodeIcon: UniversalIconLoader;
|
||||
export { loadNodeIcon };
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
import { getPossibleIconNames } from "./utils.js";
|
||||
import { searchForIcon } from "./modern.js";
|
||||
import { loadIcon } from "./loader.js";
|
||||
import { warnOnce } from "./warn.js";
|
||||
import { loadCollectionFromFS } from "./fs.js";
|
||||
const loadNodeIcon = async (collection, icon, options) => {
|
||||
let result = await loadIcon(collection, icon, options);
|
||||
if (result) return result;
|
||||
const cwds = Array.isArray(options?.cwd) ? options.cwd : [options?.cwd];
|
||||
for (let i = 0; i < cwds.length; i++) {
|
||||
const iconSet = await loadCollectionFromFS(collection, i === cwds.length - 1 ? options?.autoInstall : false, void 0, cwds[i]);
|
||||
if (iconSet) {
|
||||
result = await searchForIcon(iconSet, collection, getPossibleIconNames(icon), options);
|
||||
if (result) return result;
|
||||
}
|
||||
}
|
||||
if (options?.warn) warnOnce(`failed to load ${options.warn} icon`);
|
||||
};
|
||||
export { loadNodeIcon };
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
import { Awaitable, CustomIconLoader } from "./types.js";
|
||||
/**
|
||||
* @returns A {@link CustomIconLoader} for loading icons from a directory
|
||||
*/
|
||||
declare function FileSystemIconLoader(dir: string, transform?: (svg: string) => Awaitable<string>): CustomIconLoader;
|
||||
export { FileSystemIconLoader };
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
import { camelize, pascalize, snakelize } from "../misc/strings.js";
|
||||
import { promises } from "fs";
|
||||
/**
|
||||
* @returns A {@link CustomIconLoader} for loading icons from a directory
|
||||
*/
|
||||
function FileSystemIconLoader(dir, transform) {
|
||||
return async (name) => {
|
||||
const paths = [
|
||||
`${dir}/${name}.svg`,
|
||||
`${dir}/${camelize(name)}.svg`,
|
||||
`${dir}/${pascalize(name)}.svg`,
|
||||
`${dir}/${snakelize(name)}.svg`
|
||||
];
|
||||
let stat;
|
||||
for (const path of paths) {
|
||||
try {
|
||||
stat = await promises.lstat(path);
|
||||
} catch (err) {
|
||||
continue;
|
||||
}
|
||||
if (stat.isFile()) {
|
||||
let svg = await promises.readFile(path, "utf-8");
|
||||
const cleanupIdx = svg.indexOf("<svg");
|
||||
if (cleanupIdx > 0) svg = svg.slice(cleanupIdx);
|
||||
return typeof transform === "function" ? await transform(svg) : svg;
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
export { FileSystemIconLoader };
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
/**
|
||||
* Resolve path to package
|
||||
*/
|
||||
declare function resolvePathAsync(packageName: string, cwd: string): Promise<string | undefined>;
|
||||
export { resolvePathAsync };
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
import { fileURLToPath, pathToFileURL } from "node:url";
|
||||
import fs from "node:fs/promises";
|
||||
import path from "node:path";
|
||||
import { resolve } from "import-meta-resolve";
|
||||
/**
|
||||
* Resolve path to package
|
||||
*/
|
||||
async function resolvePathAsync(packageName, cwd) {
|
||||
if (!await pathExists(cwd)) return;
|
||||
if (!path.isAbsolute(cwd)) return;
|
||||
const parent = pathToFileURL(path.join(cwd, "_parent.mjs")).href;
|
||||
try {
|
||||
const resolvedPath = fileURLToPath(resolve(packageName, parent));
|
||||
if (await pathExists(resolvedPath)) return resolvedPath;
|
||||
} catch {}
|
||||
}
|
||||
async function pathExists(path) {
|
||||
try {
|
||||
await fs.access(path);
|
||||
return true;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
export { resolvePathAsync };
|
||||
+152
@@ -0,0 +1,152 @@
|
||||
import { FullIconCustomisations } from "../customisations/defaults.js";
|
||||
import { IconifyIcon, IconifyJSON } from "@iconify/types";
|
||||
type Awaitable<T> = T | Promise<T>;
|
||||
/**
|
||||
* External package name.
|
||||
*
|
||||
* You can use scoped packages, for example, `@my-collections/collection-a` or normal packages `my-awesome-collection`.
|
||||
*/
|
||||
type ExternalPkgName = string | [scope: string, collection: string];
|
||||
/**
|
||||
* Type for universal icon loader.
|
||||
*/
|
||||
type UniversalIconLoader = (collection: string, icon: string, options?: IconifyLoaderOptions) => Promise<string | undefined>;
|
||||
/**
|
||||
* Custom icon loader, used by `getCustomIcon`.
|
||||
*/
|
||||
type CustomIconLoader = (name: string) => Awaitable<string | undefined>;
|
||||
/**
|
||||
* Auto-install options
|
||||
*/
|
||||
type AutoInstall = boolean | ((name: string) => Promise<void | undefined>);
|
||||
/**
|
||||
* Custom icon customizer, it will allow to customize all icons on a collection or individual icons.
|
||||
*/
|
||||
type IconCustomizer = (collection: string, icon: string, props: Record<string, string>) => Awaitable<void>;
|
||||
/**
|
||||
* Icon customizations: will be applied to all resolved icons.
|
||||
*
|
||||
* For each loaded icon, the customizations will be applied in this order:
|
||||
* - apply `transform` to raw `svg`, if provided and using custom icon collection
|
||||
* - apply `customize` with default customizations, if provided
|
||||
* - apply `iconCustomizer` with `customize` customizations, if provided
|
||||
* - apply `additionalProps` with `iconCustomizer` customizations, if provided
|
||||
* - apply `trimSVG` to the final `SVG` only when using custom icon collection and `trimCustomSvg` enabled
|
||||
*/
|
||||
type IconCustomizations = {
|
||||
/**
|
||||
* Transform raw `svg`.
|
||||
*
|
||||
* **WARNING**: `transform` will be only applied when using `custom` icon collection: it will be applied only when using `getCustomIcon` and excluded when using `searchForIcon`.
|
||||
*
|
||||
* @param svg The loaded `svg`
|
||||
* @param collection The name of the collection
|
||||
* @param icon The name of the icon
|
||||
* @return The transformed `svg`.
|
||||
*/
|
||||
transform?: (svg: string, collection: string, icon: string) => Awaitable<string>;
|
||||
/**
|
||||
* Change default icon customizations values.
|
||||
*
|
||||
* @param defaultCustomizations Default icon's customizations values.
|
||||
* @param data The icon data. Mutable, you can change the icon data.
|
||||
* @param name The icon name, can be used to check if icon needs to be customised.
|
||||
* @return The modified icon's customizations values.
|
||||
*/
|
||||
customize?: (defaultCustomizations: FullIconCustomisations, data: IconifyIcon, name: string) => FullIconCustomisations | undefined;
|
||||
/**
|
||||
* Custom icon customizer.
|
||||
*/
|
||||
iconCustomizer?: IconCustomizer;
|
||||
/**
|
||||
* Additional icon properties.
|
||||
*
|
||||
* All properties without value will not be applied.
|
||||
*/
|
||||
additionalProps?: Record<string, string | undefined>;
|
||||
/**
|
||||
* Should optimize the custom `svg` icon?.
|
||||
*
|
||||
* Enable this flag when using custom `SVG` on `CSS`.
|
||||
*
|
||||
* @default `false`.
|
||||
*/
|
||||
trimCustomSvg?: boolean;
|
||||
};
|
||||
/**
|
||||
* List of icons as object. Key is the icon name, the value is the icon data or callback (can be async) to get icon data
|
||||
*/
|
||||
type InlineCollection = Record<string, string | (() => Awaitable<string | undefined>)>;
|
||||
/**
|
||||
* Collection of custom icons. Key is the collection name, the value is the loader or InlineCollection object
|
||||
*/
|
||||
type CustomCollections = Record<string, CustomIconLoader | InlineCollection>;
|
||||
/**
|
||||
* Options to use with the modern loader.
|
||||
*/
|
||||
type IconifyLoaderOptions = {
|
||||
/**
|
||||
* Emit warning when missing icons are matched
|
||||
*/
|
||||
warn?: string;
|
||||
/**
|
||||
* Add svg and xlink xml namespace when necessary.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
addXmlNs?: boolean;
|
||||
/**
|
||||
* Scale of icons against 1em
|
||||
*/
|
||||
scale?: number;
|
||||
/**
|
||||
* Style to apply to icons by default
|
||||
*
|
||||
* @default ''
|
||||
*/
|
||||
defaultStyle?: string;
|
||||
/**
|
||||
* Class names to apply to icons by default
|
||||
*
|
||||
* @default ''
|
||||
*/
|
||||
defaultClass?: string;
|
||||
/**
|
||||
* Loader for custom loaders
|
||||
*/
|
||||
customCollections?: Record<string, (() => Awaitable<IconifyJSON>) | undefined | CustomIconLoader | InlineCollection>;
|
||||
/**
|
||||
* Icon customizer
|
||||
*/
|
||||
customizations?: IconCustomizations;
|
||||
/**
|
||||
* Auto install icon sources package when the usages is detected
|
||||
*
|
||||
* **WARNING**: only on `node` environment, on `browser` this option will be ignored
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
autoInstall?: AutoInstall;
|
||||
/**
|
||||
* The additional icon properties applied to the svg.
|
||||
*
|
||||
* The `width` and `height` will not be set to the `svg` if already present on it, and so, the `width` and `height` will be those you configure on the customizations.
|
||||
* If you omit the `width/height/scale` options and the `svg` contains the `width` and/or `height`, then, both will be extracted from the `svg`.
|
||||
*
|
||||
* If you need that properties just add an empty object here, useful for example when using the `svg` on `CSS`.
|
||||
*/
|
||||
usedProps?: Record<string, string>;
|
||||
/**
|
||||
* Current working directory, used to resolve the @iconify-json package.
|
||||
*
|
||||
* Can be a string or an array of strings, the first existing path will be used.
|
||||
*
|
||||
* Only used on `node` environment.
|
||||
*
|
||||
* If value is an array and `autoInstall` is enabled, `autoInstall` will be used only for last entry.
|
||||
*
|
||||
* @default process.cwd()
|
||||
*/
|
||||
cwd?: string | string[];
|
||||
};
|
||||
export { AutoInstall, Awaitable, CustomCollections, CustomIconLoader, ExternalPkgName, IconCustomizations, IconCustomizer, IconifyLoaderOptions, InlineCollection, UniversalIconLoader };
|
||||
+1
@@ -0,0 +1 @@
|
||||
export {};
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
import { Awaitable, IconifyLoaderOptions } from "./types.js";
|
||||
declare const loaderDefaultWidthProp = "__iconify_loader_width";
|
||||
declare const loaderDefaultHeightProp = "__iconify_loader_height";
|
||||
declare function mergeIconProps(svg: string, collection: string, icon: string, options?: IconifyLoaderOptions, propsProvider?: () => Awaitable<Record<string, string>>, afterCustomizations?: (props: Record<string, string>) => void): Promise<string>;
|
||||
declare function getPossibleIconNames(icon: string): string[];
|
||||
export { getPossibleIconNames, loaderDefaultHeightProp, loaderDefaultWidthProp, mergeIconProps };
|
||||
+105
@@ -0,0 +1,105 @@
|
||||
import { calculateSize } from "../svg/size.js";
|
||||
import { isUnsetKeyword } from "../svg/build.js";
|
||||
const svgWidthRegex = /\swidth\s*=\s*["']([^"']+)["']/;
|
||||
const svgHeightRegex = /\sheight\s*=\s*["']([^"']+)["']/;
|
||||
const svgViewBoxRegex = /\sviewBox\s*=\s*["']([^"']+)["']/;
|
||||
const svgTagRegex = /<svg\s+/;
|
||||
const loaderDefaultWidthProp = "__iconify_loader_width";
|
||||
const loaderDefaultHeightProp = "__iconify_loader_height";
|
||||
function stringifySize(value) {
|
||||
return value === void 0 ? value : value.toString();
|
||||
}
|
||||
function getConfiguredSize(source, scale) {
|
||||
if (typeof scale === "number") return scale > 0 ? stringifySize(calculateSize(source ?? "1em", scale)) : void 0;
|
||||
return source;
|
||||
}
|
||||
function getSvgAspectRatio(svgNode, props) {
|
||||
const viewBox = props.viewBox ?? svgViewBoxRegex.exec(svgNode)?.[1];
|
||||
if (!viewBox) return;
|
||||
const values = viewBox.trim().split(/[\s,]+/).map((value) => parseFloat(value));
|
||||
if (values.length !== 4 || values.some((value) => !Number.isFinite(value))) return;
|
||||
const width = values[2];
|
||||
const height = values[3];
|
||||
if (width <= 0 || height <= 0) return;
|
||||
return width / height;
|
||||
}
|
||||
function configureSvgSize(svg, props, scale) {
|
||||
const svgNode = svg.slice(0, svg.indexOf(">"));
|
||||
const widthOnSvg = svgWidthRegex.test(svgNode);
|
||||
const heightOnSvg = svgHeightRegex.test(svgNode);
|
||||
const defaultWidth = props["__iconify_loader_width"] ?? svgWidthRegex.exec(svgNode)?.[1];
|
||||
const defaultHeight = props["__iconify_loader_height"] ?? svgHeightRegex.exec(svgNode)?.[1];
|
||||
const aspectRatio = getSvgAspectRatio(svgNode, props);
|
||||
delete props[loaderDefaultWidthProp];
|
||||
delete props[loaderDefaultHeightProp];
|
||||
const customWidth = props.width;
|
||||
const customHeight = props.height;
|
||||
const hasCustomWidth = !!customWidth || isUnsetKeyword(customWidth);
|
||||
const hasCustomHeight = !!customHeight || isUnsetKeyword(customHeight);
|
||||
if (hasCustomWidth || hasCustomHeight) {
|
||||
if (!hasCustomWidth) if (isUnsetKeyword(customHeight)) {
|
||||
delete props.width;
|
||||
delete props.height;
|
||||
} else if (aspectRatio) {
|
||||
props.width = stringifySize(calculateSize(customHeight, aspectRatio));
|
||||
props.height = customHeight;
|
||||
} else delete props.width;
|
||||
else if (isUnsetKeyword(customWidth)) {
|
||||
delete props.width;
|
||||
if (!hasCustomHeight || isUnsetKeyword(customHeight)) delete props.height;
|
||||
}
|
||||
if (!hasCustomHeight) if (isUnsetKeyword(customWidth)) delete props.height;
|
||||
else if (aspectRatio) {
|
||||
props.height = stringifySize(calculateSize(customWidth, 1 / aspectRatio));
|
||||
props.width = customWidth;
|
||||
} else delete props.height;
|
||||
else if (isUnsetKeyword(customHeight)) delete props.height;
|
||||
} else {
|
||||
const width = getConfiguredSize(defaultWidth, scale);
|
||||
const height = getConfiguredSize(defaultHeight, scale);
|
||||
if (width) props.width = width;
|
||||
if (height) props.height = height;
|
||||
}
|
||||
return [widthOnSvg, heightOnSvg];
|
||||
}
|
||||
async function mergeIconProps(svg, collection, icon, options, propsProvider, afterCustomizations) {
|
||||
const { scale, addXmlNs = false } = options ?? {};
|
||||
const { additionalProps = {}, iconCustomizer } = options?.customizations ?? {};
|
||||
const props = await propsProvider?.() ?? {};
|
||||
await iconCustomizer?.(collection, icon, props);
|
||||
Object.keys(additionalProps).forEach((p) => {
|
||||
const v = additionalProps[p];
|
||||
if (v !== void 0 && v !== null) props[p] = v;
|
||||
});
|
||||
afterCustomizations?.(props);
|
||||
const [widthOnSvg, heightOnSvg] = configureSvgSize(svg, props, scale);
|
||||
if (addXmlNs) {
|
||||
if (!svg.includes("xmlns=") && !props["xmlns"]) props["xmlns"] = "http://www.w3.org/2000/svg";
|
||||
if (!svg.includes("xmlns:xlink=") && svg.includes("xlink:") && !props["xmlns:xlink"]) props["xmlns:xlink"] = "http://www.w3.org/1999/xlink";
|
||||
}
|
||||
const propsToAdd = Object.keys(props).map((p) => p === "width" && widthOnSvg || p === "height" && heightOnSvg ? null : `${p}="${props[p]}"`).filter((p) => p != null);
|
||||
if (propsToAdd.length) svg = svg.replace(svgTagRegex, `<svg ${propsToAdd.join(" ")} `);
|
||||
if (options) {
|
||||
const { defaultStyle, defaultClass } = options;
|
||||
if (defaultClass && !svg.includes("class=")) svg = svg.replace(svgTagRegex, `<svg class="${defaultClass}" `);
|
||||
if (defaultStyle && !svg.includes("style=")) svg = svg.replace(svgTagRegex, `<svg style="${defaultStyle}" `);
|
||||
}
|
||||
const usedProps = options?.usedProps;
|
||||
if (usedProps) {
|
||||
Object.keys(additionalProps).forEach((p) => {
|
||||
const v = props[p];
|
||||
if (v !== void 0 && v !== null) usedProps[p] = v;
|
||||
});
|
||||
if (typeof props.width !== "undefined" && props.width !== null) usedProps.width = props.width;
|
||||
if (typeof props.height !== "undefined" && props.height !== null) usedProps.height = props.height;
|
||||
}
|
||||
return svg;
|
||||
}
|
||||
function getPossibleIconNames(icon) {
|
||||
return [
|
||||
icon,
|
||||
icon.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(),
|
||||
icon.replace(/([a-z])(\d+)/g, "$1-$2")
|
||||
];
|
||||
}
|
||||
export { getPossibleIconNames, loaderDefaultHeightProp, loaderDefaultWidthProp, mergeIconProps };
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
declare function warnOnce(msg: string): void;
|
||||
export { warnOnce };
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
import { styleText } from "node:util";
|
||||
const warned = /* @__PURE__ */ new Set();
|
||||
function warnOnce(msg) {
|
||||
if (!warned.has(msg)) {
|
||||
warned.add(msg);
|
||||
console.warn(styleText("yellow", `[@iconify-loader] ${msg}`));
|
||||
}
|
||||
}
|
||||
export { warnOnce };
|
||||
Reference in New Issue
Block a user