feat(arch): added aws icons

This commit is contained in:
NicolasNewman 2024-05-16 11:26:58 -05:00
parent b09dc5db67
commit 769d5660f5
15 changed files with 3101 additions and 27 deletions

View File

@ -226,6 +226,17 @@
</pre>
<hr />
<h2>AWS Icon Demo</h2>
<pre class="mermaid">
architecture
service s3(s3)[Cloud Store]
service ec2(ec2)[Server]
service wave(wavelength)[Wave]
s3 L--R ec2
s3 T--B wave
</pre>
<script type="module">
import mermaid from './mermaid.esm.mjs';
@ -284,6 +295,7 @@
iconSize: 80,
},
useMaxWidth: false,
iconLibraries: ['aws:full']
});
function callback() {
alert('It worked');

View File

@ -120,19 +120,19 @@ export interface MermaidConfig {
*
*/
legacyMathML?: boolean;
/**
* This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS
* fonts and browser's MathML implementation, this option is recommended if consistent rendering is important.
* If set to true, ignores legacyMathML.
*
*/
forceLegacyMathML?: boolean;
/**
* This option specifies an object contianing a mappig of SVG icon names to a resolver that returns the svg code.
* For supported diagrams (i.e., Architecture), their syntax allows refering to key names in this object to display the corresponding SVG icon in the rendered diagram.
*
*/
iconLibraries?: Array<import('./rendering-util/svgRegister.js').IconLibrary>;
iconLibraries?: Array<import('./rendering-util/svgRegister.js').IconLibrary | 'aws:full'>;
/**
* This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS
* fonts and browser's MathML implementation, this option is recommended if consistent rendering is important.
* If set to true, ignores legacyMathML.
*
*/
forceLegacyMathML?: boolean;
/**
* This option controls if the generated ids of nodes in the SVG are
* generated randomly or based on a seed.

View File

@ -533,8 +533,15 @@ function initialize(options: MermaidConfig = {}) {
registerIcons(defaultIconLibrary);
if (options?.iconLibraries) {
options.iconLibraries.forEach((library) => {
registerIcons(library);
options.iconLibraries.forEach(async (library) => {
if (typeof (library) === 'string') {
if (library === 'aws:full') {
const { default: awsFull } = await import('./rendering-util/svg/aws/aws_full.js');
registerIcons(awsFull);
}
} else {
registerIcons(library);
}
});
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,7 +1,7 @@
/**
* Designer: Nicolas Newman
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -2,7 +2,7 @@
* Designer: Nicolas Newman
* @see https://github.com/NicolasNewman/IconLibrary
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -2,7 +2,7 @@
* Designer: Nicolas Newman
* @see https://github.com/NicolasNewman/IconLibrary
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -2,7 +2,7 @@
* Designer: Nicolas Newman
* @see https://github.com/NicolasNewman/IconLibrary
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -2,7 +2,7 @@
* Designer: Nicolas Newman
* @see https://github.com/NicolasNewman/IconLibrary
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -2,7 +2,7 @@
* Designer: Nicolas Newman
* @see https://github.com/NicolasNewman/IconLibrary
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -1,8 +1,8 @@
/**
* @author Nicolas Newman
* Designer: Nicolas Newman
* @see https://github.com/NicolasNewman/IconLibrary
*/
import { createIcon } from '../svgRegister.js';
import { createIcon } from '../../svgRegister.js';
export default createIcon(
`<g>

View File

@ -1,11 +1,12 @@
import type { IconLibrary } from '../svgRegister.js';
import database from './database.js';
import server from './server.js';
import disk from './disk.js';
import internet from './internet.js';
import cloud from './cloud.js';
import unknown from './unknown.js';
import blank from './blank.js';
import database from './default/database.js';
import server from './default/server.js';
import disk from './default/disk.js';
import internet from './default/internet.js';
import cloud from './default/cloud.js';
import unknown from './default/unknown.js';
import blank from './default/blank.js';
import awsCommon from './aws/aws_common.js';
const defaultIconLibrary: IconLibrary = {
database: database,
@ -15,6 +16,7 @@ const defaultIconLibrary: IconLibrary = {
cloud: cloud,
unknown: unknown,
blank: blank,
...awsCommon,
};
export default defaultIconLibrary;

View File

@ -6,7 +6,7 @@ type IconResolver = (
) => Selection<SVGGElement, unknown, Element | null, unknown>;
type IconLibrary = Record<string, IconResolver>;
const createIcon = (icon: string, originalSize: number): IconResolver => {
const createIcon: (icon: string, originalSize: number) => IconResolver = (icon, originalSize) => {
return (
parent: Selection<SVGGElement, unknown, Element | null, unknown>,
size: number = originalSize

View File

@ -185,7 +185,7 @@ properties:
description: |
This option specifies an object contianing a mappig of SVG icon names to a resolver that returns the svg code.
For supported diagrams (i.e., Architecture), their syntax allows refering to key names in this object to display the corresponding SVG icon in the rendered diagram.
tsType: Array<import('./rendering-util/svgRegister.js').IconLibrary>
tsType: Array<import('./rendering-util/svgRegister.js').IconLibrary | 'aws:full'>
forceLegacyMathML:
description: |
This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS