@mermaid-js/mermaid-cli 11.6.0 → 11.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/assets/{index-DQukWeul.js → index-Bv5aVo5X.js} +4 -4
  2. package/dist/index.html +1 -1
  3. package/dist-types/src/index.d.ts +10 -2
  4. package/dist-types/src/index.d.ts.map +1 -1
  5. package/dist-types/src/version.d.ts +1 -1
  6. package/dist-types/src/version.d.ts.map +1 -1
  7. package/package.json +2 -2
  8. package/src/index.js +28 -6
  9. package/src/index.js.bak +540 -0
  10. package/src/version.js +1 -1
package/dist/index.html CHANGED
@@ -1,6 +1,6 @@
1
1
  <!doctype html>
2
2
  <html>
3
- <script charset="utf-8" src="./assets/index-DQukWeul.js"></script>
3
+ <script charset="utf-8" src="./assets/index-Bv5aVo5X.js"></script>
4
4
 
5
5
  <body>
6
6
  <div id="container"></div>
package/dist-types/src/index.d.ts CHANGED
@@ -30,6 +30,13 @@ export type ParseMDDOptions = {
30
30
  * - Icon packages to use.
31
31
  */
32
32
  iconPacks?: string[] | undefined;
33
+ /**
34
+ * - IconPack Json file name and url to use.
35
+ *
36
+ * /**
37
+ * Render a mermaid diagram.
38
+ */
39
+ iconPacksNamesAndUrls?: string[] | undefined;
33
40
  };
34
41
  /**
35
42
  * Markdown image properties
@@ -81,7 +88,8 @@ export function run(input: `${string}.${"md" | "markdown"}` | string | undefined
81
88
  * @property {boolean} [pdfFit] - If set, scale PDF to fit chart.
82
89
  * @property {string} [svgId] - The id attribute for the SVG element to be rendered.
83
90
  * @property {string[]} [iconPacks] - Icon packages to use.
84
- */
91
+ * @property {string[]} [iconPacksNamesAndUrls] - IconPack Json file name and url to use.
92
+
85
93
  /**
86
94
  * Render a mermaid diagram.
87
95
  *
@@ -92,7 +100,7 @@ export function run(input: `${string}.${"md" | "markdown"}` | string | undefined
92
100
  * @returns {Promise<{title: string | null, desc: string | null, data: Uint8Array}>} The output file in bytes,
93
101
  * with optional metadata.
94
102
  */
95
- export function renderMermaid(browser: import("puppeteer").Browser | import("puppeteer").BrowserContext, definition: string, outputFormat: "svg" | "png" | "pdf", { viewport, backgroundColor, mermaidConfig, myCSS, pdfFit, svgId, iconPacks }?: ParseMDDOptions): Promise<{
103
+ export function renderMermaid(browser: import("puppeteer").Browser | import("puppeteer").BrowserContext, definition: string, outputFormat: "svg" | "png" | "pdf", { viewport, backgroundColor, mermaidConfig, myCSS, pdfFit, svgId, iconPacks, iconPacksNamesAndUrls }?: ParseMDDOptions): Promise<{
96
104
  title: string | null;
97
105
  desc: string | null;
98
106
  data: Uint8Array;
package/dist-types/src/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAgYc,MAAM;;;;SACN,MAAM;;;;;;AAqBpB;;;;;;;;;;;;;;;GAeG;AACH,2BAbW,GAAG,MAAM,IAAI,IAAI,GAAG,UAAU,EAAE,GAAG,MAAM,GAAG,SAAS,UAIrD,GAAG,MAAM,IAAI,IAAI,GAAG,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,EAAE,GAAG,aAAa,yEAEhF;IAAiD,eAAe;IACzC,KAAK;IACS,YAAY;IAC3B,SAAS;IAEA,eAAe;CAChD,iBAoHA;AAxTD;;;;;;;;;GASG;AAEH;;;;;;;;;GASG;AACH,uCAPW,OAAO,WAAW,EAAE,OAAO,GAAG,OAAO,WAAW,EAAE,cAAc,cAChE,MAAM,gBACN,KAAK,GAAG,KAAK,GAAG,KAAK,kFACrB,eAAe,GACb,OAAO,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,EAAE,UAAU,CAAA;CAAC,CAAC,CAwIlF;AAnRD,qCAuHC;AA3MD;;;;;GAKG;AACH,+BAHW,MAAM,GACJ,KAAK,CAKjB;sBAxBqB,WAAW"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAsZc,MAAM;;;;SACN,MAAM;;;;;;AAqBpB;;;;;;;;;;;;;;;GAeG;AACH,2BAbW,GAAG,MAAM,IAAI,IAAI,GAAG,UAAU,EAAE,GAAG,MAAM,GAAG,SAAS,UAIrD,GAAG,MAAM,IAAI,IAAI,GAAG,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,EAAE,GAAG,aAAa,yEAEhF;IAAiD,eAAe;IACzC,KAAK;IACS,YAAY;IAC3B,SAAS;IAEA,eAAe;CAChD,iBAoHA;AA7UD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,uCAPW,OAAO,WAAW,EAAE,OAAO,GAAG,OAAO,WAAW,EAAE,cAAc,cAChE,MAAM,gBACN,KAAK,GAAG,KAAK,GAAG,KAAK,yGACrB,eAAe,GACb,OAAO,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,EAAE,UAAU,CAAA;CAAC,CAAC,CA6JlF;AAzSD,qCAwHC;AA5MD;;;;;GAKG;AACH,+BAHW,MAAM,GACJ,KAAK,CAKjB;sBAxBqB,WAAW"}
package/dist-types/src/version.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- export const version: "11.6.0";
1
+ export const version: "11.10.1";
2
2
  //# sourceMappingURL=version.d.ts.map
package/dist-types/src/version.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/version.js"],"names":[],"mappings":"AAAA,sBAAuB,QAAQ,CAAA"}
1
+ {"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/version.js"],"names":[],"mappings":"AAAA,sBAAuB,SAAS,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mermaid-js/mermaid-cli",
3
- "version": "11.6.0",
3
+ "version": "11.10.1",
4
4
  "description": "Command-line interface for mermaid",
5
5
  "license": "MIT",
6
6
  "repository": "git@github.com:mermaid-js/mermaid-cli.git",
@@ -45,7 +45,7 @@
45
45
  "@mermaid-js/layout-elk": "^0.1.2",
46
46
  "@tsconfig/node18": "^18.2.4",
47
47
  "@types/node": "~18.19.31",
48
- "jest": "^29.0.1",
48
+ "jest": "^30.0.5",
49
49
  "puppeteer": "^23.1.1",
50
50
  "standard": "^17.0.0",
51
51
  "typescript": "^5.0.1-rc",
package/src/index.js CHANGED
@@ -122,11 +122,12 @@ async function cli () {
122
122
  .option('-q, --quiet', 'Suppress log output')
123
123
  .option('-p --puppeteerConfigFile [puppeteerConfigFile]', 'JSON configuration file for puppeteer.')
124
124
  .option('--iconPacks <icons...>', 'Icon packs to use, e.g. @iconify-json/logos. These should be Iconify NPM packages that expose a icons.json file, see https://iconify.design/docs/icons/json.html. These will be downloaded from https://unkpg.com when needed.', [])
125
+ .option('--iconPacksNamesAndUrls <prefix#iconsurl...>', 'Icon packs to use, e.g. azure#https://raw.githubusercontent.com/NakayamaKento/AzureIcons/refs/heads/main/icons.json where the name (prefix) of the icon pack is defined before the "#" and the url of the json definition after the "#". These should be Iconify json file formatted as IconifyJson, see https://iconify.design/docs/icons/json.html. These will be downloaded when needed.', [])
125
126
  .parse(process.argv)
126
127
 
127
128
  const options = commander.opts()
128
129
 
129
- let { theme, width, height, input, output, outputFormat, backgroundColor, configFile, cssFile, svgId, puppeteerConfigFile, scale, pdfFit, quiet, iconPacks, artefacts } = options
130
+ let { theme, width, height, input, output, outputFormat, backgroundColor, configFile, cssFile, svgId, puppeteerConfigFile, scale, pdfFit, quiet, iconPacks, iconPacksNamesAndUrls, artefacts } = options
130
131
 
131
132
  // check input file
132
133
  if (!input) {
@@ -216,7 +217,7 @@ async function cli () {
216
217
  quiet,
217
218
  outputFormat,
218
219
  parseMMDOptions: {
219
- mermaidConfig, backgroundColor, myCSS, pdfFit, viewport: { width, height, deviceScaleFactor: scale }, svgId, iconPacks
220
+ mermaidConfig, backgroundColor, myCSS, pdfFit, viewport: { width, height, deviceScaleFactor: scale }, svgId, iconPacks, iconPacksNamesAndUrls
220
221
  },
221
222
  artefacts
222
223
  }
@@ -232,7 +233,7 @@ async function cli () {
232
233
  * @property {boolean} [pdfFit] - If set, scale PDF to fit chart.
233
234
  * @property {string} [svgId] - The id attribute for the SVG element to be rendered.
234
235
  * @property {string[]} [iconPacks] - Icon packages to use.
235
- */
236
+ * @property {string[]} [iconPacksNamesAndUrls] - IconPack Json file name and url to use.
236
237
 
237
238
  /**
238
239
  * Render a mermaid diagram.
@@ -244,7 +245,7 @@ async function cli () {
244
245
  * @returns {Promise<{title: string | null, desc: string | null, data: Uint8Array}>} The output file in bytes,
245
246
  * with optional metadata.
246
247
  */
247
- async function renderMermaid (browser, definition, outputFormat, { viewport, backgroundColor = 'white', mermaidConfig = {}, myCSS, pdfFit, svgId, iconPacks = [] } = {}) {
248
+ async function renderMermaid (browser, definition, outputFormat, { viewport, backgroundColor = 'white', mermaidConfig = {}, myCSS, pdfFit, svgId, iconPacks = [], iconPacksNamesAndUrls = [] } = {}) {
248
249
  const page = await browser.newPage()
249
250
  page.on('console', (msg) => {
250
251
  console.warn(msg.text())
@@ -262,7 +263,7 @@ async function renderMermaid (browser, definition, outputFormat, { viewport, bac
262
263
  page.addScriptTag({ path: mermaidIIFEPath }),
263
264
  page.addScriptTag({ path: zenumlIIFEPath })
264
265
  ])
265
- const metadata = await page.$eval('#container', async (container, definition, mermaidConfig, myCSS, backgroundColor, svgId, iconPacks) => {
266
+ const metadata = await page.$eval('#container', async (container, definition, mermaidConfig, myCSS, backgroundColor, svgId, iconPacks, iconPacksNamesAndUrls) => {
266
267
  await Promise.all(Array.from(document.fonts, (font) => font.load()))
267
268
 
268
269
  /**
@@ -278,6 +279,7 @@ async function renderMermaid (browser, definition, outputFormat, { viewport, bac
278
279
  await mermaid.registerExternalDiagrams([zenuml])
279
280
  mermaid.registerLayoutLoaders(elkLayouts)
280
281
  // lazy load icon packs
282
+
281
283
  mermaid.registerIconPacks(
282
284
  iconPacks.map((icon) => ({
283
285
  name: icon.split('/')[1],
@@ -287,6 +289,26 @@ async function renderMermaid (browser, definition, outputFormat, { viewport, bac
287
289
  .catch(() => error(`Failed to fetch icon: ${icon}`))
288
290
  }))
289
291
  )
292
+
293
+ mermaid.registerIconPacks(
294
+ iconPacksNamesAndUrls.map((iconPackInfo) =>
295
+ {
296
+ var packName = iconPackInfo.split('#')[0];
297
+ var packUrl = iconPackInfo.split('#')[1];
298
+
299
+ return ({
300
+ name: packName,
301
+ loader: () =>
302
+ fetch(packUrl)
303
+ .then((res) => res.json())
304
+ .catch(() => {
305
+ error(`Failed to fetch icon: ${iconPackInfo}`);
306
+ })
307
+ }
308
+ )
309
+ }
310
+ )
311
+ )
290
312
  mermaid.initialize({ startOnLoad: false, ...mermaidConfig })
291
313
  // should throw an error if mmd diagram is invalid
292
314
  const { svg: svgText } = await mermaid.render(svgId || 'my-svg', definition, container)
@@ -325,7 +347,7 @@ async function renderMermaid (browser, definition, outputFormat, { viewport, bac
325
347
  return {
326
348
  title, desc
327
349
  }
328
- }, definition, mermaidConfig, myCSS, backgroundColor, svgId, iconPacks)
350
+ }, definition, mermaidConfig, myCSS, backgroundColor, svgId, iconPacks, iconPacksNamesAndUrls)
329
351
 
330
352
  if (outputFormat === 'svg') {
331
353
  const svgXML = await page.$eval('svg', (svg) => {