marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-15 14:29:25 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: Unknown icon size

Browse Source
This commit is contained in:
Sidharth Vinod
2024-08-29 13:55:20 +05:30
parent 0ea88df662
commit e0f7ea56e1
1 changed files with 48 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
packages/mermaid/src/rendering-util/icons.ts
View File

@@ -1,8 +1,14 @@
import { log } from '$root/logger.js'; import { log } from '$root/logger.js';
import type { IconifyJSON } from '@iconify/types'; import type { ExtendedIconifyIcon, IconifyIcon, IconifyJSON } from '@iconify/types';
import type { IconifyIconCustomisations } from '@iconify/utils'; import type { IconifyIconCustomisations } from '@iconify/utils';
import { getIconData, iconToHTML, iconToSVG, replaceIDs, stringToIcon } from '@iconify/utils'; import { getIconData, iconToHTML, iconToSVG, replaceIDs, stringToIcon } from '@iconify/utils';
export const unknownIcon: IconifyIcon = {
body: '<g><rect width="80" height="80" style="fill: #087ebf; stroke-width: 0px;"/><text transform="translate(21.16 64.67)" style="fill: #fff; font-family: ArialMT, Arial; font-size: 67.75px;"><tspan x="0" y="0">?</tspan></text></g>',
height: 80,
width: 80,
};
export const iconsStore = new Map<string, IconifyJSON>(); export const iconsStore = new Map<string, IconifyJSON>();
export const registerIconPacks = (...iconPacks: IconifyJSON[]) => { export const registerIconPacks = (...iconPacks: IconifyJSON[]) => {
@@ -11,26 +17,47 @@ export const registerIconPacks = (...iconPacks: IconifyJSON[]) => {
} }
}; };
export const getIconSVG = (iconName: string, customisations?: IconifyIconCustomisations) => { const getRegisteredIconData = (iconName: string, fallbackPrefix?: string) => {
const data = stringToIcon(iconName, true, fallbackPrefix !== undefined);
if (!data) {
throw new Error(`Invalid icon name: ${iconName}`);
}
const prefix = data.prefix || fallbackPrefix;
if (!prefix) {
throw new Error(`Icon name must contain a prefix: ${iconName}`);
}
const icons = iconsStore.get(prefix);
if (!icons) {
throw new Error(`Icon set not found: ${data.prefix}`);
}
const iconData = getIconData(icons, data.name);
if (!iconData) {
throw new Error(`Icon not found: ${iconName}`);
}
return iconData;
};
export const isIconAvailable = (iconName: string) => {
try { try {
const data = stringToIcon(iconName, true, true); getRegisteredIconData(iconName);
if (!data) { return true;
throw new Error(`Invalid icon name: ${iconName}`); } catch {
} return false;
const icons = iconsStore.get(data.prefix || 'default');
if (!icons) {
throw new Error(`Icon set not found: ${data.prefix}`);
}
const iconData = getIconData(icons, data.name);
if (!iconData) {
throw new Error(`Icon not found: ${iconName}`);
}
const renderData = iconToSVG(iconData, customisations);
const svg = iconToHTML(replaceIDs(renderData.body), renderData.attributes);
return svg;
} catch (e) {
log.error(e);
// Return unknown icon svg.
return '<g><rect width="80" height="80" style="fill: #087ebf; stroke-width: 0px;"/><text transform="translate(21.16 64.67)" style="fill: #fff; font-family: ArialMT, Arial; font-size: 67.75px;"><tspan x="0" y="0">?</tspan></text></g>';
} }
}; };
export const getIconSVG = (
iconName: string,
customisations?: IconifyIconCustomisations & { fallbackPrefix?: string }
) => {
let iconData: ExtendedIconifyIcon;
try {
iconData = getRegisteredIconData(iconName, customisations?.fallbackPrefix);
} catch (e) {
log.error(e);
iconData = unknownIcon;
}
const renderData = iconToSVG(iconData, customisations);
const svg = iconToHTML(replaceIDs(renderData.body), renderData.attributes);
return svg;
};