From 5b3e565b639e0ddb9b86036d4cdfebe27b084463 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 13:25:36 +0300 Subject: [PATCH 01/43] update pnpm-lock.yaml file --- pnpm-lock.yaml | 105 ++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 100 insertions(+), 5 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 95f99e5198..eb32033af8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -435,6 +435,58 @@ importers: specifier: ^6.5.4 version: 6.5.4 + packages/mermaid/src/vitepress: + dependencies: + '@vueuse/core': + specifier: ^10.1.0 + version: 10.1.0(vue@3.2.47) + jiti: + specifier: ^1.18.2 + version: 1.18.2 + vue: + specifier: ^3.2.47 + version: 3.2.47 + devDependencies: + '@iconify-json/carbon': + specifier: ^1.1.16 + version: 1.1.16 + '@unocss/reset': + specifier: ^0.52.0 + version: 0.52.0 + '@vite-pwa/vitepress': + specifier: ^0.0.5 + version: 0.0.5(vite-plugin-pwa@0.15.0) + '@vitejs/plugin-vue': + specifier: ^4.2.1 + version: 4.2.1(vite@4.3.3)(vue@3.2.47) + fast-glob: + specifier: ^3.2.12 + version: 3.2.12 + https-localhost: + specifier: ^4.7.1 + version: 4.7.1 + pathe: + specifier: ^1.1.0 + version: 1.1.0 + unocss: + specifier: ^0.52.0 + version: 0.52.0(postcss@8.4.23)(rollup@2.79.1)(vite@4.3.3) + unplugin-vue-components: + specifier: ^0.24.1 + version: 0.24.1(rollup@2.79.1)(vue@3.2.47) + vite: + specifier: ^4.3.3 + version: 4.3.3(@types/node@18.16.0) + vite-plugin-pwa: + specifier: ^0.15.0 + version: 0.15.0(vite@4.3.3)(workbox-build@6.5.4)(workbox-window@6.5.4) + vitepress: + specifier: 1.0.0-beta.1 + version: 1.0.0-beta.1(@algolia/client-search@4.14.2)(@types/node@18.16.0)(search-insights@2.6.0) + workbox-window: + specifier: ^6.5.4 + version: 6.5.4 + tests/webpack: dependencies: '@mermaid-js/mermaid-example-diagram': @@ -1253,7 +1305,7 @@ packages: gensync: 1.0.0-beta.2 json5: 2.2.1 lodash: 4.17.21 - resolve: 1.22.1 + resolve: 1.22.2 semver: 5.7.1 source-map: 0.5.7 transitivePeerDependencies: @@ -10066,7 +10118,7 @@ packages: jest-pnp-resolver: 1.2.2(jest-resolve@29.5.0) jest-util: 29.5.0 jest-validate: 29.5.0 - resolve: 1.22.1 + resolve: 1.22.2 resolve.exports: 2.0.2 slash: 3.0.0 dev: true @@ -11579,7 +11631,7 @@ packages: resolution: {integrity: sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==} dependencies: hosted-git-info: 2.8.9 - resolve: 1.22.1 + resolve: 1.22.2 semver: 5.7.1 validate-npm-package-license: 3.0.4 dev: true @@ -12755,7 +12807,7 @@ packages: /resolve@1.19.0: resolution: {integrity: sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==} dependencies: - is-core-module: 2.10.0 + is-core-module: 2.12.1 path-parse: 1.0.7 dev: true @@ -14738,6 +14790,49 @@ packages: - terser dev: true + /vitepress@1.0.0-beta.1(@algolia/client-search@4.14.2)(@types/node@18.16.0)(search-insights@2.6.0): + resolution: {integrity: sha512-V2yyCwQ+v9fh7rbnGDLp8M7vHa9sLElexXf/JHtBOsOwv7ed9wt1QI4WUagYgKR3TeoJT9v2s6f0UaQSne0EvQ==} + hasBin: true + dependencies: + '@docsearch/css': 3.5.0 + '@docsearch/js': 3.5.0(@algolia/client-search@4.14.2)(search-insights@2.6.0) + '@vitejs/plugin-vue': 4.2.3(vite@4.3.9)(vue@3.3.4) + '@vue/devtools-api': 6.5.0 + '@vueuse/core': 10.1.2(vue@3.3.4) + '@vueuse/integrations': 10.1.2(focus-trap@7.4.3)(vue@3.3.4) + body-scroll-lock: 4.0.0-beta.0 + focus-trap: 7.4.3 + mark.js: 8.11.1 + minisearch: 6.1.0 + shiki: 0.14.2 + vite: 4.3.9(@types/node@18.16.0) + vue: 3.3.4 + transitivePeerDependencies: + - '@algolia/client-search' + - '@types/node' + - '@types/react' + - '@vue/composition-api' + - async-validator + - axios + - change-case + - drauu + - fuse.js + - idb-keyval + - jwt-decode + - less + - nprogress + - qrcode + - react + - react-dom + - sass + - search-insights + - sortablejs + - stylus + - sugarss + - terser + - universal-cookie + dev: true + /vitepress@1.0.0-beta.2(@algolia/client-search@4.14.2)(@types/node@18.16.0)(search-insights@2.6.0): resolution: {integrity: sha512-DBXYjtYbm3W1IPPJ2TiCaK/XK+o/2XmL2+jslOGKm+txcbmG0kbeB+vadC5tCUZA9NdA+9Ywj3M4548c7t/SDg==} hasBin: true @@ -14836,7 +14931,7 @@ packages: strip-literal: 1.0.1 tinybench: 2.4.0 tinypool: 0.5.0 - vite: 4.3.8(@types/node@18.16.0) + vite: 4.3.9(@types/node@18.16.0) vite-node: 0.31.0(@types/node@18.16.0) why-is-node-running: 2.2.2 transitivePeerDependencies: From b11c511c5ce1e5194e13d648e7e8be8c4b2bf570 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 13:27:40 +0300 Subject: [PATCH 02/43] remove unnecessary `@ts-ignore` and `@ts-nocheck` --- .vite/jisonTransformer.ts | 2 -- __mocks__/d3.ts | 1 - .../interfaces/mermaidAPI.RenderResult.md | 4 ++-- docs/config/setup/modules/mermaidAPI.md | 22 +++++++++---------- packages/mermaid/src/accessibility.spec.ts | 2 -- .../mermaid/src/diagrams/class/classDb.ts | 1 - .../src/diagrams/class/classRenderer-v2.ts | 7 +----- packages/mermaid/src/diagrams/er/erDiagram.ts | 2 +- .../src/diagrams/timeline/timelineRenderer.ts | 4 +--- packages/mermaid/src/mermaidAPI.ts | 9 +------- 10 files changed, 17 insertions(+), 37 deletions(-) diff --git a/.vite/jisonTransformer.ts b/.vite/jisonTransformer.ts index a5734e1259..314df8a33f 100644 --- a/.vite/jisonTransformer.ts +++ b/.vite/jisonTransformer.ts @@ -1,8 +1,6 @@ -// @ts-ignore No typings for jison import jison from 'jison'; export const transformJison = (src: string): string => { - // @ts-ignore No typings for jison const parser = new jison.Generator(src, { moduleType: 'js', 'token-stack': true, diff --git a/__mocks__/d3.ts b/__mocks__/d3.ts index b472a31817..97bd01665f 100644 --- a/__mocks__/d3.ts +++ b/__mocks__/d3.ts @@ -1,4 +1,3 @@ -// @ts-nocheck TODO: Fix TS import { MockedD3 } from '../packages/mermaid/src/tests/MockedD3.js'; export const select = function () { diff --git a/docs/config/setup/interfaces/mermaidAPI.RenderResult.md b/docs/config/setup/interfaces/mermaidAPI.RenderResult.md index f84a51b87b..527b46d092 100644 --- a/docs/config/setup/interfaces/mermaidAPI.RenderResult.md +++ b/docs/config/setup/interfaces/mermaidAPI.RenderResult.md @@ -39,7 +39,7 @@ bindFunctions?.(div); // To call bindFunctions only if it's present. #### Defined in -[mermaidAPI.ts:98](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L98) +[mermaidAPI.ts:97](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L97) --- @@ -51,4 +51,4 @@ The svg code for the rendered graph. #### Defined in -[mermaidAPI.ts:88](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L88) +[mermaidAPI.ts:87](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L87) diff --git a/docs/config/setup/modules/mermaidAPI.md b/docs/config/setup/modules/mermaidAPI.md index b5e48b2290..591b6841a0 100644 --- a/docs/config/setup/modules/mermaidAPI.md +++ b/docs/config/setup/modules/mermaidAPI.md @@ -25,7 +25,7 @@ Renames and re-exports [mermaidAPI](mermaidAPI.md#mermaidapi) #### Defined in -[mermaidAPI.ts:82](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L82) +[mermaidAPI.ts:81](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L81) ## Variables @@ -96,7 +96,7 @@ mermaid.initialize(config); #### Defined in -[mermaidAPI.ts:670](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L670) +[mermaidAPI.ts:663](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L663) ## Functions @@ -127,7 +127,7 @@ Return the last node appended #### Defined in -[mermaidAPI.ts:309](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L309) +[mermaidAPI.ts:308](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L308) --- @@ -153,7 +153,7 @@ the cleaned up svgCode #### Defined in -[mermaidAPI.ts:257](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L257) +[mermaidAPI.ts:256](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L256) --- @@ -179,7 +179,7 @@ the string with all the user styles #### Defined in -[mermaidAPI.ts:186](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L186) +[mermaidAPI.ts:185](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L185) --- @@ -202,7 +202,7 @@ the string with all the user styles #### Defined in -[mermaidAPI.ts:234](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L234) +[mermaidAPI.ts:233](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L233) --- @@ -229,7 +229,7 @@ with an enclosing block that has each of the cssClasses followed by !important; #### Defined in -[mermaidAPI.ts:170](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L170) +[mermaidAPI.ts:169](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L169) --- @@ -249,7 +249,7 @@ with an enclosing block that has each of the cssClasses followed by !important; #### Defined in -[mermaidAPI.ts:156](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L156) +[mermaidAPI.ts:155](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L155) --- @@ -269,7 +269,7 @@ with an enclosing block that has each of the cssClasses followed by !important; #### Defined in -[mermaidAPI.ts:127](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L127) +[mermaidAPI.ts:126](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L126) --- @@ -295,7 +295,7 @@ Put the svgCode into an iFrame. Return the iFrame code #### Defined in -[mermaidAPI.ts:288](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L288) +[mermaidAPI.ts:287](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L287) --- @@ -320,4 +320,4 @@ Remove any existing elements from the given document #### Defined in -[mermaidAPI.ts:359](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L359) +[mermaidAPI.ts:358](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L358) diff --git a/packages/mermaid/src/accessibility.spec.ts b/packages/mermaid/src/accessibility.spec.ts index eac82ee340..7a3ab7f105 100644 --- a/packages/mermaid/src/accessibility.spec.ts +++ b/packages/mermaid/src/accessibility.spec.ts @@ -51,7 +51,6 @@ describe('accessibility', () => { desc: string | null | undefined, givenId: string ) { - // @ts-ignore Required to easily handle the d3 select types const svgAttrSpy = vi.spyOn(svgD3Node, 'attr').mockReturnValue(svgD3Node); addSVGa11yTitleDescription(svgD3Node, title, desc, givenId); expect(svgAttrSpy).toHaveBeenCalledWith('aria-labelledby', `chart-title-${givenId}`); @@ -63,7 +62,6 @@ describe('accessibility', () => { desc: string | null | undefined, givenId: string ) { - // @ts-ignore Required to easily handle the d3 select types const svgAttrSpy = vi.spyOn(svgD3Node, 'attr').mockReturnValue(svgD3Node); addSVGa11yTitleDescription(svgD3Node, title, desc, givenId); expect(svgAttrSpy).toHaveBeenCalledWith('aria-describedby', `chart-desc-${givenId}`); diff --git a/packages/mermaid/src/diagrams/class/classDb.ts b/packages/mermaid/src/diagrams/class/classDb.ts index d9e17db548..a0a7f05d97 100644 --- a/packages/mermaid/src/diagrams/class/classDb.ts +++ b/packages/mermaid/src/diagrams/class/classDb.ts @@ -367,7 +367,6 @@ export const relationType = { const setupToolTips = function (element: Element) { let tooltipElem: Selection = select('.mermaidTooltip'); - // @ts-ignore - _groups is a dynamic property if ((tooltipElem._groups || tooltipElem)[0][0] === null) { tooltipElem = select('body').append('div').attr('class', 'mermaidTooltip').style('opacity', 0); } diff --git a/packages/mermaid/src/diagrams/class/classRenderer-v2.ts b/packages/mermaid/src/diagrams/class/classRenderer-v2.ts index 3520022427..b0a8ce89c5 100644 --- a/packages/mermaid/src/diagrams/class/classRenderer-v2.ts +++ b/packages/mermaid/src/diagrams/class/classRenderer-v2.ts @@ -353,15 +353,11 @@ export const draw = async function (text: string, id: string, _version: string, } const root = securityLevel === 'sandbox' - ? // @ts-ignore Ignore type error for now - - select(sandboxElement.nodes()[0].contentDocument.body) + ? select(sandboxElement.nodes()[0].contentDocument.body) : select('body'); - // @ts-ignore Ignore type error for now const svg = root.select(`[id="${id}"]`); // Run the renderer. This is what draws the final graph. - // @ts-ignore Ignore type error for now const element = root.select('#' + id + ' g'); await render( element, @@ -377,7 +373,6 @@ export const draw = async function (text: string, id: string, _version: string, // Add label rects for non html labels if (!conf?.htmlLabels) { - // @ts-ignore Ignore type error for now const doc = securityLevel === 'sandbox' ? sandboxElement.nodes()[0].contentDocument : document; const labels = doc.querySelectorAll('[id="' + id + '"] .edgeLabel .label'); for (const label of labels) { diff --git a/packages/mermaid/src/diagrams/er/erDiagram.ts b/packages/mermaid/src/diagrams/er/erDiagram.ts index da3d777ad0..7cc9e37b27 100644 --- a/packages/mermaid/src/diagrams/er/erDiagram.ts +++ b/packages/mermaid/src/diagrams/er/erDiagram.ts @@ -1,4 +1,4 @@ -// @ts-ignore: TODO Fix ts errors +// @ts-ignore: TODs Fix ts errors import erParser from './parser/erDiagram.jison'; import erDb from './erDb.js'; import erRenderer from './erRenderer.js'; diff --git a/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts b/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts index 65abe8fd9c..0b82ffdce8 100644 --- a/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts +++ b/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts @@ -46,11 +46,9 @@ export const draw = function (text: string, id: string, version: string, diagObj } const root = securityLevel === 'sandbox' - ? // @ts-ignore d3 types are wrong - select(sandboxElement.nodes()[0].contentDocument.body) + ? select(sandboxElement.nodes()[0].contentDocument.body) : select('body'); - // @ts-ignore d3 types are wrong const svg = root.select('#' + id); svg.append('g'); diff --git a/packages/mermaid/src/mermaidAPI.ts b/packages/mermaid/src/mermaidAPI.ts index 755fa82583..753e4944ab 100644 --- a/packages/mermaid/src/mermaidAPI.ts +++ b/packages/mermaid/src/mermaidAPI.ts @@ -78,7 +78,6 @@ export interface ParseOptions { } // This makes it clear that we're working with a d3 selected element of some kind, even though it's hard to specify the exact type. -// @ts-ignore Could replicate the type definition in d3. This also makes it possible to use the untyped info from the js diagram files. export type D3Element = any; export interface RenderResult { @@ -491,13 +490,7 @@ const render = async function ( ? diag.renderer.getClasses(text, diag) : {}; - const rules = createUserStyles( - config, - graphType, - // @ts-ignore convert renderer to TS. - diagramClassDefs, - idSelector - ); + const rules = createUserStyles(config, graphType, diagramClassDefs, idSelector); const style1 = document.createElement('style'); style1.innerHTML = rules; From e688138167f84e576a954f0385e202a18bc28b45 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 14:45:08 +0300 Subject: [PATCH 03/43] pref: change detectors from `.match` into `.test` there is no need for matching, capturing results, and validating nullablity just using `.test` would be enough and significantly faster for more info, see https://stackoverflow.com/10940138/16476610 --- packages/mermaid-example-diagram/src/detector.ts | 2 +- packages/mermaid-zenuml/src/detector.ts | 3 +-- packages/mermaid/src/diagrams/c4/c4Detector.ts | 2 +- packages/mermaid/src/diagrams/class/classDetector-V2.ts | 7 ++----- packages/mermaid/src/diagrams/class/classDetector.ts | 2 +- packages/mermaid/src/diagrams/er/erDetector.ts | 2 +- packages/mermaid/src/diagrams/flowchart/elk/detector.ts | 4 ++-- .../mermaid/src/diagrams/flowchart/flowDetector-v2.ts | 4 ++-- packages/mermaid/src/diagrams/flowchart/flowDetector.ts | 2 +- packages/mermaid/src/diagrams/gantt/ganttDetector.ts | 2 +- packages/mermaid/src/diagrams/git/gitGraphDetector.ts | 2 +- packages/mermaid/src/diagrams/info/infoDetector.ts | 2 +- packages/mermaid/src/diagrams/mindmap/detector.ts | 2 +- packages/mermaid/src/diagrams/pie/pieDetector.ts | 2 +- .../src/diagrams/quadrant-chart/quadrantDetector.ts | 2 +- .../src/diagrams/requirement/requirementDetector.ts | 2 +- .../mermaid/src/diagrams/sequence/sequenceDetector.ts | 2 +- packages/mermaid/src/diagrams/state/stateDetector-V2.ts | 9 +++------ packages/mermaid/src/diagrams/state/stateDetector.ts | 2 +- packages/mermaid/src/diagrams/timeline/detector.ts | 2 +- .../mermaid/src/diagrams/user-journey/journeyDetector.ts | 2 +- 21 files changed, 26 insertions(+), 33 deletions(-) diff --git a/packages/mermaid-example-diagram/src/detector.ts b/packages/mermaid-example-diagram/src/detector.ts index 93fd427628..54b9d555bc 100644 --- a/packages/mermaid-example-diagram/src/detector.ts +++ b/packages/mermaid-example-diagram/src/detector.ts @@ -3,7 +3,7 @@ import type { ExternalDiagramDefinition } from 'mermaid'; const id = 'example-diagram'; const detector = (txt: string) => { - return txt.match(/^\s*example-diagram/) !== null; + return /^\s*example-diagram/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid-zenuml/src/detector.ts b/packages/mermaid-zenuml/src/detector.ts index b22af469f7..d782ffe334 100644 --- a/packages/mermaid-zenuml/src/detector.ts +++ b/packages/mermaid-zenuml/src/detector.ts @@ -1,10 +1,9 @@ import type { ExternalDiagramDefinition } from 'mermaid'; const id = 'zenuml'; -const regexp = /^\s*zenuml/; const detector = (txt: string) => { - return txt.match(regexp) !== null; + return /^\s*zenuml/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/c4/c4Detector.ts b/packages/mermaid/src/diagrams/c4/c4Detector.ts index e6e82c6bed..d8f6c6adcf 100644 --- a/packages/mermaid/src/diagrams/c4/c4Detector.ts +++ b/packages/mermaid/src/diagrams/c4/c4Detector.ts @@ -3,7 +3,7 @@ import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'c4'; const detector = (txt: string) => { - return txt.match(/^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/) !== null; + return /^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/class/classDetector-V2.ts b/packages/mermaid/src/diagrams/class/classDetector-V2.ts index 9eda53a4ba..4ec6fe158c 100644 --- a/packages/mermaid/src/diagrams/class/classDetector-V2.ts +++ b/packages/mermaid/src/diagrams/class/classDetector-V2.ts @@ -4,14 +4,11 @@ const id = 'classDiagram'; const detector: DiagramDetector = (txt, config) => { // If we have configured to use dagre-wrapper then we should return true in this function for classDiagram code thus making it use the new class diagram - if ( - txt.match(/^\s*classDiagram/) !== null && - config?.class?.defaultRenderer === 'dagre-wrapper' - ) { + if (/^\s*classDiagram/.test(txt) && config?.class?.defaultRenderer === 'dagre-wrapper') { return true; } // We have not opted to use the new renderer so we should return true if we detect a class diagram - return txt.match(/^\s*classDiagram-v2/) !== null; + return /^\s*classDiagram-v2/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/class/classDetector.ts b/packages/mermaid/src/diagrams/class/classDetector.ts index e2eee9bb3e..fec172b0a2 100644 --- a/packages/mermaid/src/diagrams/class/classDetector.ts +++ b/packages/mermaid/src/diagrams/class/classDetector.ts @@ -8,7 +8,7 @@ const detector: DiagramDetector = (txt, config) => { return false; } // We have not opted to use the new renderer so we should return true if we detect a class diagram - return txt.match(/^\s*classDiagram/) !== null; + return /^\s*classDiagram/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/er/erDetector.ts b/packages/mermaid/src/diagrams/er/erDetector.ts index b8a191af2d..a708be2570 100644 --- a/packages/mermaid/src/diagrams/er/erDetector.ts +++ b/packages/mermaid/src/diagrams/er/erDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'er'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*erDiagram/) !== null; + return /^\s*erDiagram/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/flowchart/elk/detector.ts b/packages/mermaid/src/diagrams/flowchart/elk/detector.ts index 482bc961ca..f2c707aa34 100644 --- a/packages/mermaid/src/diagrams/flowchart/elk/detector.ts +++ b/packages/mermaid/src/diagrams/flowchart/elk/detector.ts @@ -6,9 +6,9 @@ const id = 'flowchart-elk'; const detector: DiagramDetector = (txt: string, config?: MermaidConfig): boolean => { if ( // If diagram explicitly states flowchart-elk - txt.match(/^\s*flowchart-elk/) || + /^\s*flowchart-elk/.test(txt) || // If a flowchart/graph diagram has their default renderer set to elk - (txt.match(/^\s*flowchart|graph/) && config?.flowchart?.defaultRenderer === 'elk') + (/^\s*flowchart|graph/.test(txt) && config?.flowchart?.defaultRenderer === 'elk') ) { return true; } diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts index 9c00545bfe..36df8ddfce 100644 --- a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts +++ b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts @@ -12,10 +12,10 @@ const detector: DiagramDetector = (txt, config) => { } // If we have configured to use dagre-wrapper then we should return true in this function for graph code thus making it use the new flowchart diagram - if (txt.match(/^\s*graph/) !== null && config?.flowchart?.defaultRenderer === 'dagre-wrapper') { + if (/^\s*graph/.test(txt) && config?.flowchart?.defaultRenderer === 'dagre-wrapper') { return true; } - return txt.match(/^\s*flowchart/) !== null; + return /^\s*flowchart/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector.ts index 84aafa249a..d49c32389d 100644 --- a/packages/mermaid/src/diagrams/flowchart/flowDetector.ts +++ b/packages/mermaid/src/diagrams/flowchart/flowDetector.ts @@ -11,7 +11,7 @@ const detector: DiagramDetector = (txt, config) => { ) { return false; } - return txt.match(/^\s*graph/) !== null; + return /^\s*graph/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts index 4a736cb90d..211d41cc45 100644 --- a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts +++ b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'gantt'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*gantt/) !== null; + return /^\s*gantt/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts index aeb37e5bc0..83f72a4c73 100644 --- a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts +++ b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts @@ -4,7 +4,7 @@ import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'gitGraph'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*gitGraph/) !== null; + return /^\s*gitGraph/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index ad9b9163d6..433dc52963 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'info'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*info/) !== null; + return /^\s*info/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/mindmap/detector.ts b/packages/mermaid/src/diagrams/mindmap/detector.ts index 95e16dea94..0ab3187f7e 100644 --- a/packages/mermaid/src/diagrams/mindmap/detector.ts +++ b/packages/mermaid/src/diagrams/mindmap/detector.ts @@ -2,7 +2,7 @@ import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'mindmap'; const detector = (txt: string) => { - return txt.match(/^\s*mindmap/) !== null; + return /^\s*mindmap/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/pie/pieDetector.ts b/packages/mermaid/src/diagrams/pie/pieDetector.ts index 34d3c0cf6a..b0c0df6812 100644 --- a/packages/mermaid/src/diagrams/pie/pieDetector.ts +++ b/packages/mermaid/src/diagrams/pie/pieDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'pie'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*pie/) !== null; + return /^\s*pie/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts index 06d02356bc..ebb7195f63 100644 --- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts +++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'quadrantChart'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*quadrantChart/) !== null; + return /^\s*quadrantChart/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts index 87fcea790e..996c132cf1 100644 --- a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts +++ b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'requirement'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*requirement(Diagram)?/) !== null; + return /^\s*requirement(Diagram)?/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts index a808feea24..0aa7de994f 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts +++ b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'sequence'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*sequenceDiagram/) !== null; + return /^\s*sequenceDiagram/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts index 8a96e93a27..313c487b6a 100644 --- a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts +++ b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts @@ -2,14 +2,11 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'stateDiagram'; -const detector: DiagramDetector = (text, config) => { - if (text.match(/^\s*stateDiagram-v2/) !== null) { +const detector: DiagramDetector = (txt, config) => { + if (/^\s*stateDiagram-v2/.test(txt)) { return true; } - if (text.match(/^\s*stateDiagram/) && config?.state?.defaultRenderer === 'dagre-wrapper') { - return true; - } - if (text.match(/^\s*stateDiagram/) && config?.state?.defaultRenderer === 'dagre-wrapper') { + if (/^\s*stateDiagram/.test(txt) && config?.state?.defaultRenderer === 'dagre-wrapper') { return true; } return false; diff --git a/packages/mermaid/src/diagrams/state/stateDetector.ts b/packages/mermaid/src/diagrams/state/stateDetector.ts index eb252305cf..28e121a07e 100644 --- a/packages/mermaid/src/diagrams/state/stateDetector.ts +++ b/packages/mermaid/src/diagrams/state/stateDetector.ts @@ -8,7 +8,7 @@ const detector: DiagramDetector = (txt, config) => { if (config?.state?.defaultRenderer === 'dagre-wrapper') { return false; } - return txt.match(/^\s*stateDiagram/) !== null; + return /^\s*stateDiagram/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/timeline/detector.ts b/packages/mermaid/src/diagrams/timeline/detector.ts index 57d8f66ad5..60fecb8328 100644 --- a/packages/mermaid/src/diagrams/timeline/detector.ts +++ b/packages/mermaid/src/diagrams/timeline/detector.ts @@ -3,7 +3,7 @@ import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'timeline'; const detector = (txt: string) => { - return txt.match(/^\s*timeline/) !== null; + return /^\s*timeline/.test(txt); }; const loader = async () => { diff --git a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts index 0dd4887822..9d355ce9b3 100644 --- a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts +++ b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts @@ -3,7 +3,7 @@ import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-a const id = 'journey'; const detector: DiagramDetector = (txt) => { - return txt.match(/^\s*journey/) !== null; + return /^\s*journey/.test(txt); }; const loader = async () => { From 6ced1673b0f53ee528692176dea785e5580aecbf Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 15:19:54 +0300 Subject: [PATCH 04/43] standardize detector function definition with `DiagramDetector` type --- packages/mermaid/src/diagrams/c4/c4Detector.ts | 4 ++-- packages/mermaid/src/diagrams/flowchart/elk/detector.ts | 3 +-- packages/mermaid/src/diagrams/mindmap/detector.ts | 4 ++-- packages/mermaid/src/diagrams/timeline/detector.ts | 4 ++-- 4 files changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/mermaid/src/diagrams/c4/c4Detector.ts b/packages/mermaid/src/diagrams/c4/c4Detector.ts index d8f6c6adcf..2e32496b24 100644 --- a/packages/mermaid/src/diagrams/c4/c4Detector.ts +++ b/packages/mermaid/src/diagrams/c4/c4Detector.ts @@ -1,8 +1,8 @@ -import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'c4'; -const detector = (txt: string) => { +const detector: DiagramDetector = (txt) => { return /^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/.test(txt); }; diff --git a/packages/mermaid/src/diagrams/flowchart/elk/detector.ts b/packages/mermaid/src/diagrams/flowchart/elk/detector.ts index f2c707aa34..8d7f7c58c3 100644 --- a/packages/mermaid/src/diagrams/flowchart/elk/detector.ts +++ b/packages/mermaid/src/diagrams/flowchart/elk/detector.ts @@ -1,9 +1,8 @@ -import type { MermaidConfig } from '../../../config.type.js'; import type { ExternalDiagramDefinition, DiagramDetector } from '../../../diagram-api/types.js'; const id = 'flowchart-elk'; -const detector: DiagramDetector = (txt: string, config?: MermaidConfig): boolean => { +const detector: DiagramDetector = (txt, config): boolean => { if ( // If diagram explicitly states flowchart-elk /^\s*flowchart-elk/.test(txt) || diff --git a/packages/mermaid/src/diagrams/mindmap/detector.ts b/packages/mermaid/src/diagrams/mindmap/detector.ts index 0ab3187f7e..8627b41aec 100644 --- a/packages/mermaid/src/diagrams/mindmap/detector.ts +++ b/packages/mermaid/src/diagrams/mindmap/detector.ts @@ -1,7 +1,7 @@ -import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'mindmap'; -const detector = (txt: string) => { +const detector: DiagramDetector = (txt) => { return /^\s*mindmap/.test(txt); }; diff --git a/packages/mermaid/src/diagrams/timeline/detector.ts b/packages/mermaid/src/diagrams/timeline/detector.ts index 60fecb8328..57848b2a27 100644 --- a/packages/mermaid/src/diagrams/timeline/detector.ts +++ b/packages/mermaid/src/diagrams/timeline/detector.ts @@ -1,8 +1,8 @@ -import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'timeline'; -const detector = (txt: string) => { +const detector: DiagramDetector = (txt) => { return /^\s*timeline/.test(txt); }; From 9573f336c3f48a05125d2011588e18bce921f565 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 15:28:45 +0300 Subject: [PATCH 05/43] standardize detectors loeader function definition with `DiagramLoader` type --- packages/mermaid/src/diagrams/c4/c4Detector.ts | 8 ++++++-- packages/mermaid/src/diagrams/class/classDetector-V2.ts | 8 ++++++-- packages/mermaid/src/diagrams/class/classDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/er/erDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/flowchart/elk/detector.ts | 8 ++++++-- .../mermaid/src/diagrams/flowchart/flowDetector-v2.ts | 4 ++-- packages/mermaid/src/diagrams/flowchart/flowDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/gantt/ganttDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/git/gitGraphDetector.ts | 4 ++-- packages/mermaid/src/diagrams/info/infoDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/mindmap/detector.ts | 8 ++++++-- packages/mermaid/src/diagrams/pie/pieDetector.ts | 8 ++++++-- .../src/diagrams/quadrant-chart/quadrantDetector.ts | 8 ++++++-- .../src/diagrams/requirement/requirementDetector.ts | 8 ++++++-- .../mermaid/src/diagrams/sequence/sequenceDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/state/stateDetector-V2.ts | 8 ++++++-- packages/mermaid/src/diagrams/state/stateDetector.ts | 8 ++++++-- packages/mermaid/src/diagrams/timeline/detector.ts | 8 ++++++-- .../mermaid/src/diagrams/user-journey/journeyDetector.ts | 8 ++++++-- 19 files changed, 106 insertions(+), 38 deletions(-) diff --git a/packages/mermaid/src/diagrams/c4/c4Detector.ts b/packages/mermaid/src/diagrams/c4/c4Detector.ts index 2e32496b24..b06ab6cb1d 100644 --- a/packages/mermaid/src/diagrams/c4/c4Detector.ts +++ b/packages/mermaid/src/diagrams/c4/c4Detector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'c4'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./c4Diagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/class/classDetector-V2.ts b/packages/mermaid/src/diagrams/class/classDetector-V2.ts index 4ec6fe158c..1823ad002e 100644 --- a/packages/mermaid/src/diagrams/class/classDetector-V2.ts +++ b/packages/mermaid/src/diagrams/class/classDetector-V2.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'classDiagram'; @@ -11,7 +15,7 @@ const detector: DiagramDetector = (txt, config) => { return /^\s*classDiagram-v2/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./classDiagram-v2.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/class/classDetector.ts b/packages/mermaid/src/diagrams/class/classDetector.ts index fec172b0a2..d814003cb9 100644 --- a/packages/mermaid/src/diagrams/class/classDetector.ts +++ b/packages/mermaid/src/diagrams/class/classDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'class'; @@ -11,7 +15,7 @@ const detector: DiagramDetector = (txt, config) => { return /^\s*classDiagram/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./classDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/er/erDetector.ts b/packages/mermaid/src/diagrams/er/erDetector.ts index a708be2570..7da6804e0f 100644 --- a/packages/mermaid/src/diagrams/er/erDetector.ts +++ b/packages/mermaid/src/diagrams/er/erDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'er'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*erDiagram/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./erDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/flowchart/elk/detector.ts b/packages/mermaid/src/diagrams/flowchart/elk/detector.ts index 8d7f7c58c3..6cfcf26194 100644 --- a/packages/mermaid/src/diagrams/flowchart/elk/detector.ts +++ b/packages/mermaid/src/diagrams/flowchart/elk/detector.ts @@ -1,4 +1,8 @@ -import type { ExternalDiagramDefinition, DiagramDetector } from '../../../diagram-api/types.js'; +import type { + ExternalDiagramDefinition, + DiagramDetector, + DiagramLoader, +} from '../../../diagram-api/types.js'; const id = 'flowchart-elk'; @@ -14,7 +18,7 @@ const detector: DiagramDetector = (txt, config): boolean => { return false; }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./flowchart-elk-definition.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts index 36df8ddfce..dda5a67f0d 100644 --- a/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts +++ b/packages/mermaid/src/diagrams/flowchart/flowDetector-v2.ts @@ -1,4 +1,4 @@ -import type { DiagramDetector } from '../../diagram-api/types.js'; +import type { DiagramDetector, DiagramLoader } from '../../diagram-api/types.js'; import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'flowchart-v2'; @@ -18,7 +18,7 @@ const detector: DiagramDetector = (txt, config) => { return /^\s*flowchart/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./flowDiagram-v2.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/flowchart/flowDetector.ts b/packages/mermaid/src/diagrams/flowchart/flowDetector.ts index d49c32389d..8859ca8831 100644 --- a/packages/mermaid/src/diagrams/flowchart/flowDetector.ts +++ b/packages/mermaid/src/diagrams/flowchart/flowDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'flowchart'; @@ -14,7 +18,7 @@ const detector: DiagramDetector = (txt, config) => { return /^\s*graph/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./flowDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts index 211d41cc45..e2f2a97848 100644 --- a/packages/mermaid/src/diagrams/gantt/ganttDetector.ts +++ b/packages/mermaid/src/diagrams/gantt/ganttDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'gantt'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*gantt/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./ganttDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts index 83f72a4c73..ded434a651 100644 --- a/packages/mermaid/src/diagrams/git/gitGraphDetector.ts +++ b/packages/mermaid/src/diagrams/git/gitGraphDetector.ts @@ -1,4 +1,4 @@ -import type { DiagramDetector } from '../../diagram-api/types.js'; +import type { DiagramDetector, DiagramLoader } from '../../diagram-api/types.js'; import type { ExternalDiagramDefinition } from '../../diagram-api/types.js'; const id = 'gitGraph'; @@ -7,7 +7,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*gitGraph/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./gitGraphDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index 433dc52963..819400cd23 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'info'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*info/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./infoDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/mindmap/detector.ts b/packages/mermaid/src/diagrams/mindmap/detector.ts index 8627b41aec..2b31fc5e87 100644 --- a/packages/mermaid/src/diagrams/mindmap/detector.ts +++ b/packages/mermaid/src/diagrams/mindmap/detector.ts @@ -1,11 +1,15 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'mindmap'; const detector: DiagramDetector = (txt) => { return /^\s*mindmap/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./mindmap-definition.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/pie/pieDetector.ts b/packages/mermaid/src/diagrams/pie/pieDetector.ts index b0c0df6812..93eded52cd 100644 --- a/packages/mermaid/src/diagrams/pie/pieDetector.ts +++ b/packages/mermaid/src/diagrams/pie/pieDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'pie'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*pie/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./pieDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts index ebb7195f63..9a77ca43ae 100644 --- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts +++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'quadrantChart'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*quadrantChart/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./quadrantDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts index 996c132cf1..f8fd33640e 100644 --- a/packages/mermaid/src/diagrams/requirement/requirementDetector.ts +++ b/packages/mermaid/src/diagrams/requirement/requirementDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'requirement'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*requirement(Diagram)?/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./requirementDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts index 0aa7de994f..c1df221308 100644 --- a/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts +++ b/packages/mermaid/src/diagrams/sequence/sequenceDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'sequence'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*sequenceDiagram/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./sequenceDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts index 313c487b6a..5201f3fae2 100644 --- a/packages/mermaid/src/diagrams/state/stateDetector-V2.ts +++ b/packages/mermaid/src/diagrams/state/stateDetector-V2.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'stateDiagram'; @@ -12,7 +16,7 @@ const detector: DiagramDetector = (txt, config) => { return false; }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./stateDiagram-v2.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/state/stateDetector.ts b/packages/mermaid/src/diagrams/state/stateDetector.ts index 28e121a07e..5903d06cf3 100644 --- a/packages/mermaid/src/diagrams/state/stateDetector.ts +++ b/packages/mermaid/src/diagrams/state/stateDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'state'; @@ -11,7 +15,7 @@ const detector: DiagramDetector = (txt, config) => { return /^\s*stateDiagram/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./stateDiagram.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/timeline/detector.ts b/packages/mermaid/src/diagrams/timeline/detector.ts index 57848b2a27..a6394bd54a 100644 --- a/packages/mermaid/src/diagrams/timeline/detector.ts +++ b/packages/mermaid/src/diagrams/timeline/detector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'timeline'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*timeline/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./timeline-definition.js'); return { id, diagram }; }; diff --git a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts index 9d355ce9b3..cb1d1837f0 100644 --- a/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts +++ b/packages/mermaid/src/diagrams/user-journey/journeyDetector.ts @@ -1,4 +1,8 @@ -import type { DiagramDetector, ExternalDiagramDefinition } from '../../diagram-api/types.js'; +import type { + DiagramDetector, + DiagramLoader, + ExternalDiagramDefinition, +} from '../../diagram-api/types.js'; const id = 'journey'; @@ -6,7 +10,7 @@ const detector: DiagramDetector = (txt) => { return /^\s*journey/.test(txt); }; -const loader = async () => { +const loader: DiagramLoader = async () => { const { diagram } = await import('./journeyDiagram.js'); return { id, diagram }; }; From 372b57d54004f8aa2ca9943d2cf74f17af14940c Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 19:36:54 +0300 Subject: [PATCH 06/43] create `DrawDefinition` function type --- packages/mermaid/src/diagram-api/types.ts | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts index f95ca5ab5d..2e63a27c43 100644 --- a/packages/mermaid/src/diagram-api/types.ts +++ b/packages/mermaid/src/diagram-api/types.ts @@ -1,3 +1,4 @@ +import { Diagram } from '../Diagram.js'; import { MermaidConfig } from '../config.type.js'; export interface InjectUtils { @@ -52,3 +53,18 @@ export interface ExternalDiagramDefinition { export type DiagramDetector = (text: string, config?: MermaidConfig) => boolean; export type DiagramLoader = () => Promise<{ id: string; diagram: DiagramDefinition }>; + +/** + * Type for function draws diagram in the tag with id: id based on the graph definition in text. + * + * @param text - The text of the diagram. + * @param id - The id of the diagram which will be used as a DOM element id. + * @param version - MermaidJS version from package.json. + * @param diagramObject - A standard diagram containing the DB and the text and type etc of the diagram. + */ +export type DrawDefinition = ( + text: string, + id: string, + version: string, + diagramObject: Diagram +) => void; From e6a48f8bafcf20292995f1849e0adac2c0f024b3 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 19:38:36 +0300 Subject: [PATCH 07/43] standardize info diagram definition * create types * remove unnessery db attributes * convert js files to ts * remove empty styles.js --- .../mermaid/src/diagrams/info/info.spec.js | 16 --------- .../mermaid/src/diagrams/info/info.spec.ts | 24 +++++++++++++ packages/mermaid/src/diagrams/info/infoDb.js | 36 ------------------- packages/mermaid/src/diagrams/info/infoDb.ts | 19 ++++++++++ .../mermaid/src/diagrams/info/infoDiagram.ts | 9 +++-- .../info/{infoRenderer.js => infoRenderer.ts} | 27 +++++++------- .../mermaid/src/diagrams/info/infoTypes.ts | 10 ++++++ packages/mermaid/src/diagrams/info/styles.js | 3 -- packages/mermaid/src/styles.spec.ts | 2 -- 9 files changed, 69 insertions(+), 77 deletions(-) delete mode 100644 packages/mermaid/src/diagrams/info/info.spec.js create mode 100644 packages/mermaid/src/diagrams/info/info.spec.ts delete mode 100644 packages/mermaid/src/diagrams/info/infoDb.js create mode 100644 packages/mermaid/src/diagrams/info/infoDb.ts rename packages/mermaid/src/diagrams/info/{infoRenderer.js => infoRenderer.ts} (71%) create mode 100644 packages/mermaid/src/diagrams/info/infoTypes.ts delete mode 100644 packages/mermaid/src/diagrams/info/styles.js diff --git a/packages/mermaid/src/diagrams/info/info.spec.js b/packages/mermaid/src/diagrams/info/info.spec.js deleted file mode 100644 index 6f1a59d1cd..0000000000 --- a/packages/mermaid/src/diagrams/info/info.spec.js +++ /dev/null @@ -1,16 +0,0 @@ -import { parser } from './parser/info.jison'; -import infoDb from './infoDb.js'; -describe('when parsing an info graph it', function () { - let ex; - beforeEach(function () { - ex = parser; - ex.yy = infoDb; - }); - - it('should handle an info definition', function () { - let str = `info - showInfo`; - - ex.parse(str); - }); -}); diff --git a/packages/mermaid/src/diagrams/info/info.spec.ts b/packages/mermaid/src/diagrams/info/info.spec.ts new file mode 100644 index 0000000000..cccd74cc60 --- /dev/null +++ b/packages/mermaid/src/diagrams/info/info.spec.ts @@ -0,0 +1,24 @@ +// @ts-ignore Jison doesn't export types +import { parser } from './parser/info.jison'; +import infoDb from './infoDb.js'; + +describe('info graph', () => { + beforeEach(() => { + parser.yy = infoDb; + parser.yy.clear(); + }); + + it('should handle an info definition', () => { + const str = `info`; + parser.parse(str); + + expect(infoDb.getInfo()).toBeFalsy(); + }); + + it('should handle an info definition with showInfo', () => { + const str = `info showInfo`; + parser.parse(str); + + expect(infoDb.getInfo()).toBeTruthy(); + }); +}); diff --git a/packages/mermaid/src/diagrams/info/infoDb.js b/packages/mermaid/src/diagrams/info/infoDb.js deleted file mode 100644 index 81ba8057f5..0000000000 --- a/packages/mermaid/src/diagrams/info/infoDb.js +++ /dev/null @@ -1,36 +0,0 @@ -/** Created by knut on 15-01-14. */ -import { log } from '../../logger.js'; -import { clear } from '../../commonDb.js'; - -var message = ''; -var info = false; - -export const setMessage = (txt) => { - log.debug('Setting message to: ' + txt); - message = txt; -}; - -export const getMessage = () => { - return message; -}; - -export const setInfo = (inf) => { - info = inf; -}; - -export const getInfo = () => { - return info; -}; - -// export const parseError = (err, hash) => { -// global.mermaidAPI.parseError(err, hash) -// } - -export default { - setMessage, - getMessage, - setInfo, - getInfo, - clear, - // parseError -}; diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts new file mode 100644 index 0000000000..50c31de477 --- /dev/null +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -0,0 +1,19 @@ +/** Created by knut on 15-01-14. */ +import { clear } from '../../commonDb.js'; +import { InfoDb } from './infoTypes.js'; + +let info = false; + +export const setInfo = (inf: boolean): void => { + info = inf; +}; + +export const getInfo = (): boolean => info; + +const db: InfoDb = { + clear, + setInfo, + getInfo, +}; + +export default db; diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index a26e915e52..574a0d63f8 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -2,12 +2,11 @@ import { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore: TODO Fix ts errors import parser from './parser/info.jison'; import db from './infoDb.js'; -import styles from './styles.js'; import renderer from './infoRenderer.js'; export const diagram: DiagramDefinition = { - parser, - db, - renderer, - styles, + parser: parser, + db: db, + renderer: renderer, + styles: () => '', }; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.js b/packages/mermaid/src/diagrams/info/infoRenderer.ts similarity index 71% rename from packages/mermaid/src/diagrams/info/infoRenderer.js rename to packages/mermaid/src/diagrams/info/infoRenderer.ts index 9441a3226e..6aac69dbf0 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.js +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -1,19 +1,19 @@ /** Created by knut on 14-12-11. */ +// @ts-ignore - TODO: why import { select } from 'd3'; import { log } from '../../logger.js'; import { getConfig } from '../../config.js'; +import { DrawDefinition } from '../../diagram-api/types.js'; /** * Draws a an info picture in the tag with id: id based on the graph definition in text. * - * @param {any} text - * @param {any} id - * @param {any} version + * @param text - The text of the diagram. + * @param id - The id of the diagram which will be used as a DOM element id. + * @param version - MermaidJS version. */ -export const draw = (text, id, version) => { +export const draw: DrawDefinition = (text, id, version) => { try { - // const parser = infoParser.parser; - // parser.yy = db; log.debug('Rendering info diagram\n' + text); const securityLevel = getConfig().securityLevel; @@ -27,10 +27,6 @@ export const draw = (text, id, version) => { ? select(sandboxElement.nodes()[0].contentDocument.body) : select('body'); - // Parse the graph definition - // parser.parse(text); - // log.debug('Parsed info diagram'); - // Fetch the default direction, use TD if none was found const svg = root.select('#' + id); const g = svg.append('g'); @@ -45,13 +41,14 @@ export const draw = (text, id, version) => { svg.attr('height', 100); svg.attr('width', 400); - // svg.attr('viewBox', '0 0 300 150'); } catch (e) { log.error('Error while rendering info diagram'); - log.error(e.message); + if (e instanceof Error) { + log.error(e.message); + } else { + log.error('Unexpected error', e); + } } }; -export default { - draw, -}; +export default draw; diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts new file mode 100644 index 0000000000..93146b5105 --- /dev/null +++ b/packages/mermaid/src/diagrams/info/infoTypes.ts @@ -0,0 +1,10 @@ +import { DiagramDb } from '../../diagram-api/types.js'; + +/** + * Info diagram DB. + */ +export interface InfoDb extends DiagramDb { + clear: () => void; + setInfo: (info: boolean) => void; + getInfo: () => boolean; +} diff --git a/packages/mermaid/src/diagrams/info/styles.js b/packages/mermaid/src/diagrams/info/styles.js deleted file mode 100644 index 0b0729813d..0000000000 --- a/packages/mermaid/src/diagrams/info/styles.js +++ /dev/null @@ -1,3 +0,0 @@ -const getStyles = () => ``; - -export default getStyles; diff --git a/packages/mermaid/src/styles.spec.ts b/packages/mermaid/src/styles.spec.ts index f827c611b3..51951f190a 100644 --- a/packages/mermaid/src/styles.spec.ts +++ b/packages/mermaid/src/styles.spec.ts @@ -22,7 +22,6 @@ import er from './diagrams/er/styles.js'; import error from './diagrams/error/styles.js'; import git from './diagrams/git/styles.js'; import gantt from './diagrams/gantt/styles.js'; -import info from './diagrams/info/styles.js'; import pie from './diagrams/pie/styles.js'; import requirement from './diagrams/requirement/styles.js'; import sequence from './diagrams/sequence/styles.js'; @@ -92,7 +91,6 @@ describe('styles', () => { flowchartElk, gantt, git, - info, journey, mindmap, pie, From dfdfa63009eadd20f793c85e7a5ec40096b18376 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 19:44:36 +0300 Subject: [PATCH 08/43] add `type` keyword for import for info diagram files --- packages/mermaid/src/diagrams/info/infoDb.ts | 2 +- packages/mermaid/src/diagrams/info/infoDiagram.ts | 2 +- packages/mermaid/src/diagrams/info/infoRenderer.ts | 2 +- packages/mermaid/src/diagrams/info/infoTypes.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index 50c31de477..a757ad9c4e 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -1,6 +1,6 @@ /** Created by knut on 15-01-14. */ import { clear } from '../../commonDb.js'; -import { InfoDb } from './infoTypes.js'; +import type { InfoDb } from './infoTypes.js'; let info = false; diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index 574a0d63f8..73505a4bd0 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -1,4 +1,4 @@ -import { DiagramDefinition } from '../../diagram-api/types.js'; +import type { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore: TODO Fix ts errors import parser from './parser/info.jison'; import db from './infoDb.js'; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 6aac69dbf0..682bd133c0 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -3,7 +3,7 @@ import { select } from 'd3'; import { log } from '../../logger.js'; import { getConfig } from '../../config.js'; -import { DrawDefinition } from '../../diagram-api/types.js'; +import type { DrawDefinition } from '../../diagram-api/types.js'; /** * Draws a an info picture in the tag with id: id based on the graph definition in text. diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts index 93146b5105..7d240e3d49 100644 --- a/packages/mermaid/src/diagrams/info/infoTypes.ts +++ b/packages/mermaid/src/diagrams/info/infoTypes.ts @@ -1,4 +1,4 @@ -import { DiagramDb } from '../../diagram-api/types.js'; +import type { DiagramDb } from '../../diagram-api/types.js'; /** * Info diagram DB. From 98d9205e6f5d007d41c2d59863677e9a2923425e Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 19:49:37 +0300 Subject: [PATCH 09/43] update info @ts-ignore comments deception --- packages/mermaid/src/diagrams/info/infoDiagram.ts | 2 +- packages/mermaid/src/diagrams/info/infoRenderer.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index 73505a4bd0..b8b9a4859a 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -1,5 +1,5 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; -// @ts-ignore: TODO Fix ts errors +// @ts-ignore jison doesn't export types import parser from './parser/info.jison'; import db from './infoDb.js'; import renderer from './infoRenderer.js'; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 682bd133c0..932c7ba08b 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -1,5 +1,5 @@ /** Created by knut on 14-12-11. */ -// @ts-ignore - TODO: why +// @ts-ignore - TODO: fix ts error from d3 import { select } from 'd3'; import { log } from '../../logger.js'; import { getConfig } from '../../config.js'; From 5b4356bd43f04098556fa1dc99a11b540c7cca41 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 20:34:41 +0300 Subject: [PATCH 10/43] remove unnecessary typeof Error in info diagram renderer --- packages/mermaid/src/diagrams/info/infoRenderer.ts | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 932c7ba08b..be12111505 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -42,12 +42,7 @@ export const draw: DrawDefinition = (text, id, version) => { svg.attr('height', 100); svg.attr('width', 400); } catch (e) { - log.error('Error while rendering info diagram'); - if (e instanceof Error) { - log.error(e.message); - } else { - log.error('Unexpected error', e); - } + log.error('error while rendering info diagram', e); } }; From 4320fe78391f4a8bd5bc90ffc258696715f25e00 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 20:46:18 +0300 Subject: [PATCH 11/43] return draw function export in info renderer --- packages/mermaid/src/diagrams/info/infoRenderer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index be12111505..4c70e4e6fe 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -46,4 +46,4 @@ export const draw: DrawDefinition = (text, id, version) => { } }; -export default draw; +export default { draw }; From c78ad7dbace7481e8698f45148f1a3b3169f0e10 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 21:11:34 +0300 Subject: [PATCH 12/43] create `ParseDirectiveDefinition` type for parsing directives --- packages/mermaid/src/diagram-api/types.ts | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts index 2e63a27c43..7656acb6ce 100644 --- a/packages/mermaid/src/diagram-api/types.ts +++ b/packages/mermaid/src/diagram-api/types.ts @@ -68,3 +68,12 @@ export type DrawDefinition = ( version: string, diagramObject: Diagram ) => void; + +/** + * Type for function parse directive from diagram code. + * + * @param statement - + * @param context - + * @param type - + */ +export type ParseDirectiveDefinition = (statement: string, context: string, type: string) => void; From f35e0cafdfbbc9decb2709cffa8e945ebfbbdd9f Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 23:09:26 +0300 Subject: [PATCH 13/43] fix `TODs` type in erDiagram --- packages/mermaid/src/diagrams/er/erDiagram.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/er/erDiagram.ts b/packages/mermaid/src/diagrams/er/erDiagram.ts index 7cc9e37b27..adfa525fce 100644 --- a/packages/mermaid/src/diagrams/er/erDiagram.ts +++ b/packages/mermaid/src/diagrams/er/erDiagram.ts @@ -1,4 +1,4 @@ -// @ts-ignore: TODs Fix ts errors +// @ts-ignore: TODO: Fix ts errors import erParser from './parser/erDiagram.jison'; import erDb from './erDb.js'; import erRenderer from './erRenderer.js'; From e7b9b5a0a9e55b7179c027bef0aa02a18925f61d Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 23:10:20 +0300 Subject: [PATCH 14/43] set styles as optional in `DiagramDefinition` --- packages/mermaid/src/diagram-api/types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts index 7656acb6ce..1687e17910 100644 --- a/packages/mermaid/src/diagram-api/types.ts +++ b/packages/mermaid/src/diagram-api/types.ts @@ -27,7 +27,7 @@ export interface DiagramDefinition { db: DiagramDb; renderer: any; parser: any; - styles: any; + styles?: any; init?: (config: MermaidConfig) => void; injectUtils?: ( _log: InjectUtils['_log'], From d0e8074de797d58461c3a3301a76449576176381 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Mon, 12 Jun 2023 23:15:24 +0300 Subject: [PATCH 15/43] remove empty styles in info diagram --- packages/mermaid/src/diagrams/info/infoDiagram.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index b8b9a4859a..cb8d2af617 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -8,5 +8,4 @@ export const diagram: DiagramDefinition = { parser: parser, db: db, renderer: renderer, - styles: () => '', }; From 171d7a04f42e432aa77f65d742eeb26428fc9e8d Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 12:24:10 +0300 Subject: [PATCH 16/43] caps `DB` part in `DiagramDb` and `InfoDb` --- packages/mermaid/src/diagram-api/frontmatter.ts | 4 ++-- packages/mermaid/src/diagram-api/types.ts | 4 ++-- packages/mermaid/src/diagrams/info/infoDb.ts | 4 ++-- packages/mermaid/src/diagrams/info/infoTypes.ts | 7 ++----- 4 files changed, 8 insertions(+), 11 deletions(-) diff --git a/packages/mermaid/src/diagram-api/frontmatter.ts b/packages/mermaid/src/diagram-api/frontmatter.ts index 8c0e998f69..f8d2e9c415 100644 --- a/packages/mermaid/src/diagram-api/frontmatter.ts +++ b/packages/mermaid/src/diagram-api/frontmatter.ts @@ -1,4 +1,4 @@ -import { DiagramDb } from './types.js'; +import { DiagramDB } from './types.js'; // The "* as yaml" part is necessary for tree-shaking import * as yaml from 'js-yaml'; @@ -22,7 +22,7 @@ type FrontMatterMetadata = { * @param db - Diagram database, could be of any diagram. * @returns text with frontmatter stripped out */ -export function extractFrontMatter(text: string, db: DiagramDb): string { +export function extractFrontMatter(text: string, db: DiagramDB): string { const matches = text.match(frontMatterRegex); if (matches) { const parsed: FrontMatterMetadata = yaml.load(matches[1], { diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts index 1687e17910..26cf33fbec 100644 --- a/packages/mermaid/src/diagram-api/types.ts +++ b/packages/mermaid/src/diagram-api/types.ts @@ -14,7 +14,7 @@ export interface InjectUtils { /** * Generic Diagram DB that may apply to any diagram type. */ -export interface DiagramDb { +export interface DiagramDB { clear?: () => void; setDiagramTitle?: (title: string) => void; setDisplayMode?: (title: string) => void; @@ -24,7 +24,7 @@ export interface DiagramDb { } export interface DiagramDefinition { - db: DiagramDb; + db: DiagramDB; renderer: any; parser: any; styles?: any; diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index a757ad9c4e..71a1203e27 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -1,6 +1,6 @@ /** Created by knut on 15-01-14. */ import { clear } from '../../commonDb.js'; -import type { InfoDb } from './infoTypes.js'; +import type { InfoDB } from './infoTypes.js'; let info = false; @@ -10,7 +10,7 @@ export const setInfo = (inf: boolean): void => { export const getInfo = (): boolean => info; -const db: InfoDb = { +const db: InfoDB = { clear, setInfo, getInfo, diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts index 7d240e3d49..9878642b19 100644 --- a/packages/mermaid/src/diagrams/info/infoTypes.ts +++ b/packages/mermaid/src/diagrams/info/infoTypes.ts @@ -1,9 +1,6 @@ -import type { DiagramDb } from '../../diagram-api/types.js'; +import type { DiagramDB } from '../../diagram-api/types.js'; -/** - * Info diagram DB. - */ -export interface InfoDb extends DiagramDb { +export interface InfoDB extends DiagramDB { clear: () => void; setInfo: (info: boolean) => void; getInfo: () => boolean; From f0b1529727bec12fbb6ebe2febabd52273aeeb8d Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 13:27:15 +0300 Subject: [PATCH 17/43] rename `inf` into `toggle` for better readability in infoDb --- packages/mermaid/src/diagrams/info/infoDb.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index 71a1203e27..b8e2fd14dd 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -4,8 +4,8 @@ import type { InfoDB } from './infoTypes.js'; let info = false; -export const setInfo = (inf: boolean): void => { - info = inf; +export const setInfo = (toggle: boolean): void => { + info = toggle; }; export const getInfo = (): boolean => info; From 2a5b122d0c446ecf5f96a3a776d29f13163011b2 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 15:32:00 +0300 Subject: [PATCH 18/43] standardize ts-ignore for info graph --- packages/mermaid/src/diagrams/info/info.spec.ts | 2 +- packages/mermaid/src/diagrams/info/infoDb.ts | 1 - packages/mermaid/src/diagrams/info/infoDiagram.ts | 2 +- packages/mermaid/src/diagrams/info/infoRenderer.ts | 1 - 4 files changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/info.spec.ts b/packages/mermaid/src/diagrams/info/info.spec.ts index cccd74cc60..9caca6a2ae 100644 --- a/packages/mermaid/src/diagrams/info/info.spec.ts +++ b/packages/mermaid/src/diagrams/info/info.spec.ts @@ -1,4 +1,4 @@ -// @ts-ignore Jison doesn't export types +// @ts-ignore - jison doesn't export types import { parser } from './parser/info.jison'; import infoDb from './infoDb.js'; diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index b8e2fd14dd..9689820343 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -1,4 +1,3 @@ -/** Created by knut on 15-01-14. */ import { clear } from '../../commonDb.js'; import type { InfoDB } from './infoTypes.js'; diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index cb8d2af617..277a14317f 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -1,5 +1,5 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; -// @ts-ignore jison doesn't export types +// @ts-ignore - jison doesn't export types import parser from './parser/info.jison'; import db from './infoDb.js'; import renderer from './infoRenderer.js'; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 4c70e4e6fe..f75ace9c70 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -1,4 +1,3 @@ -/** Created by knut on 14-12-11. */ // @ts-ignore - TODO: fix ts error from d3 import { select } from 'd3'; import { log } from '../../logger.js'; From ab0eb6c9bf69b61c8924c8e4adef6cebd5616c72 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 17:58:25 +0300 Subject: [PATCH 19/43] add `@types/d3-selection` to mermaid dev deps --- packages/mermaid/package.json | 1 + pnpm-lock.yaml | 19 +++++++++++-------- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index 8064b15cf0..d0c67ee58a 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -73,6 +73,7 @@ "devDependencies": { "@types/cytoscape": "^3.19.9", "@types/d3": "^7.4.0", + "@types/d3-selection": "^3.0.5", "@types/dompurify": "^3.0.2", "@types/jsdom": "^21.1.1", "@types/lodash-es": "^4.17.7", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index eb32033af8..e0428101b9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -236,6 +236,9 @@ importers: '@types/d3': specifier: ^7.4.0 version: 7.4.0 + '@types/d3-selection': + specifier: ^3.0.5 + version: 3.0.5 '@types/dompurify': specifier: ^3.0.2 version: 3.0.2 @@ -3942,13 +3945,13 @@ packages: /@types/d3-axis@3.0.1: resolution: {integrity: sha512-zji/iIbdd49g9WN0aIsGcwcTBUkgLsCSwB+uH+LPVDAiKWENMtI3cJEWt+7/YYwelMoZmbBfzA3qCdrZ2XFNnw==} dependencies: - '@types/d3-selection': 3.0.3 + '@types/d3-selection': 3.0.5 dev: true /@types/d3-brush@3.0.1: resolution: {integrity: sha512-B532DozsiTuQMHu2YChdZU0qsFJSio3Q6jmBYGYNp3gMDzBmuFFgPt9qKA4VYuLZMp4qc6eX7IUFUEsvHiXZAw==} dependencies: - '@types/d3-selection': 3.0.3 + '@types/d3-selection': 3.0.5 dev: true /@types/d3-chord@3.0.1: @@ -3977,7 +3980,7 @@ packages: /@types/d3-drag@3.0.1: resolution: {integrity: sha512-o1Va7bLwwk6h03+nSM8dpaGEYnoIG19P0lKqlic8Un36ymh9NSkNFX1yiXMKNMx8rJ0Kfnn2eovuFaL6Jvj0zA==} dependencies: - '@types/d3-selection': 3.0.3 + '@types/d3-selection': 3.0.5 dev: true /@types/d3-dsv@3.0.0: @@ -4044,8 +4047,8 @@ packages: '@types/d3-time': 3.0.0 dev: true - /@types/d3-selection@3.0.3: - resolution: {integrity: sha512-Mw5cf6nlW1MlefpD9zrshZ+DAWL4IQ5LnWfRheW6xwsdaWOb6IRRu2H7XPAQcyXEx1D7XQWgdoKR83ui1/HlEA==} + /@types/d3-selection@3.0.5: + resolution: {integrity: sha512-xCB0z3Hi8eFIqyja3vW8iV01+OHGYR2di/+e+AiOcXIOrY82lcvWW8Ke1DYE/EUVMsBl4Db9RppSBS3X1U6J0w==} dev: true /@types/d3-shape@3.1.0: @@ -4069,14 +4072,14 @@ packages: /@types/d3-transition@3.0.2: resolution: {integrity: sha512-jo5o/Rf+/u6uerJ/963Dc39NI16FQzqwOc54bwvksGAdVfvDrqDpVeq95bEvPtBwLCVZutAEyAtmSyEMxN7vxQ==} dependencies: - '@types/d3-selection': 3.0.3 + '@types/d3-selection': 3.0.5 dev: true /@types/d3-zoom@3.0.1: resolution: {integrity: sha512-7s5L9TjfqIYQmQQEUcpMAcBOahem7TRoSO/+Gkz02GbMVuULiZzjF2BOdw291dbO2aNon4m2OdFsRGaCq2caLQ==} dependencies: '@types/d3-interpolate': 3.0.1 - '@types/d3-selection': 3.0.3 + '@types/d3-selection': 3.0.5 dev: true /@types/d3@7.4.0: @@ -4105,7 +4108,7 @@ packages: '@types/d3-random': 3.0.1 '@types/d3-scale': 4.0.2 '@types/d3-scale-chromatic': 3.0.0 - '@types/d3-selection': 3.0.3 + '@types/d3-selection': 3.0.5 '@types/d3-shape': 3.1.0 '@types/d3-time': 3.0.0 '@types/d3-time-format': 4.0.0 From daee545e785b8db7ecbd496cf4140e28757f96a4 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 17:59:41 +0300 Subject: [PATCH 20/43] ignore ts check for renders until handle them --- packages/mermaid/src/diagrams/class/classDb.ts | 2 +- packages/mermaid/src/diagrams/class/classRenderer-v2.ts | 2 +- .../mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts | 2 +- packages/mermaid/src/diagrams/timeline/timelineRenderer.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/mermaid/src/diagrams/class/classDb.ts b/packages/mermaid/src/diagrams/class/classDb.ts index a0a7f05d97..11a1eb37df 100644 --- a/packages/mermaid/src/diagrams/class/classDb.ts +++ b/packages/mermaid/src/diagrams/class/classDb.ts @@ -1,4 +1,4 @@ -// @ts-expect-error - d3 types issue +// @ts-nocheck - don't check until handle it import { select, Selection } from 'd3'; import { log } from '../../logger.js'; import * as configApi from '../../config.js'; diff --git a/packages/mermaid/src/diagrams/class/classRenderer-v2.ts b/packages/mermaid/src/diagrams/class/classRenderer-v2.ts index b0a8ce89c5..e0cfea641d 100644 --- a/packages/mermaid/src/diagrams/class/classRenderer-v2.ts +++ b/packages/mermaid/src/diagrams/class/classRenderer-v2.ts @@ -1,4 +1,4 @@ -// @ts-ignore d3 types are not available +// @ts-nocheck - don't check until handle it import { select, curveLinear } from 'd3'; import * as graphlib from 'dagre-d3-es/src/graphlib/index.js'; import { log } from '../../logger.js'; diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts index 46d3f773bb..92943337a0 100644 --- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts +++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts @@ -1,4 +1,4 @@ -// @ts-ignore: TODO Fix ts errors +// @ts-nocheck - don't check until handle it import { select } from 'd3'; import * as configApi from '../../config.js'; import { log } from '../../logger.js'; diff --git a/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts b/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts index 0b82ffdce8..17460bac2d 100644 --- a/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts +++ b/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts @@ -1,4 +1,4 @@ -// @ts-ignore - db not typed yet +// @ts-nocheck - don't check until handle it import { select, Selection } from 'd3'; import svgDraw from './svgDraw.js'; import { log } from '../../logger.js'; From ae14f6a947642bbe93fa4d2405adb4c539b9f8a9 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 18:50:08 +0300 Subject: [PATCH 21/43] add parial parts to info graph --- packages/mermaid/src/diagram-api/types.ts | 2 ++ .../mermaid/src/diagrams/info/infoRenderer.ts | 24 ++++++++++--------- 2 files changed, 15 insertions(+), 11 deletions(-) diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts index 26cf33fbec..0bb05dd5c6 100644 --- a/packages/mermaid/src/diagram-api/types.ts +++ b/packages/mermaid/src/diagram-api/types.ts @@ -77,3 +77,5 @@ export type DrawDefinition = ( * @param type - */ export type ParseDirectiveDefinition = (statement: string, context: string, type: string) => void; + +export type SVG = d3.Selection; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index f75ace9c70..72bf4a524f 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -2,7 +2,7 @@ import { select } from 'd3'; import { log } from '../../logger.js'; import { getConfig } from '../../config.js'; -import type { DrawDefinition } from '../../diagram-api/types.js'; +import type { DrawDefinition, SVG } from '../../diagram-api/types.js'; /** * Draws a an info picture in the tag with id: id based on the graph definition in text. @@ -13,20 +13,25 @@ import type { DrawDefinition } from '../../diagram-api/types.js'; */ export const draw: DrawDefinition = (text, id, version) => { try { - log.debug('Rendering info diagram\n' + text); + log.debug('rendering info diagram\n' + text); const securityLevel = getConfig().securityLevel; - // Handle root and Document for when rendering in sandbox mode - let sandboxElement; + // handle root and document for when rendering in sandbox mode + let sandboxElement: SVG | undefined; if (securityLevel === 'sandbox') { sandboxElement = select('#i' + id); } - const root = - securityLevel === 'sandbox' - ? select(sandboxElement.nodes()[0].contentDocument.body) - : select('body'); + let root; + if (securityLevel === 'sandbox' && sandboxElement !== undefined) { + root = select(sandboxElement.nodes()[0].contentDocument!.body); + } else { + root = select('body'); + } + // @ts-ignore - TODO: figure out how to resolve this const svg = root.select('#' + id); + svg.attr('height', 100); + svg.attr('width', 400); const g = svg.append('g'); @@ -37,9 +42,6 @@ export const draw: DrawDefinition = (text, id, version) => { .attr('font-size', '32px') .style('text-anchor', 'middle') .text('v ' + version); - - svg.attr('height', 100); - svg.attr('width', 400); } catch (e) { log.error('error while rendering info diagram', e); } From 750b1d222391688caeaa684068cd7913d2e1086c Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Tue, 13 Jun 2023 19:55:00 +0300 Subject: [PATCH 22/43] add HTML type and change svg type generic types --- packages/mermaid/src/diagram-api/types.ts | 5 ++++- .../mermaid/src/diagrams/info/infoRenderer.ts | 21 ++++++++++--------- 2 files changed, 15 insertions(+), 11 deletions(-) diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts index 0bb05dd5c6..265af65874 100644 --- a/packages/mermaid/src/diagram-api/types.ts +++ b/packages/mermaid/src/diagram-api/types.ts @@ -1,5 +1,6 @@ import { Diagram } from '../Diagram.js'; import { MermaidConfig } from '../config.type.js'; +import type * as d3 from 'd3'; export interface InjectUtils { _log: any; @@ -78,4 +79,6 @@ export type DrawDefinition = ( */ export type ParseDirectiveDefinition = (statement: string, context: string, type: string) => void; -export type SVG = d3.Selection; +export type HTML = d3.Selection; + +export type SVG = d3.Selection; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 72bf4a524f..f486ecac9e 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -2,7 +2,7 @@ import { select } from 'd3'; import { log } from '../../logger.js'; import { getConfig } from '../../config.js'; -import type { DrawDefinition, SVG } from '../../diagram-api/types.js'; +import type { DrawDefinition, HTML, SVG } from '../../diagram-api/types.js'; /** * Draws a an info picture in the tag with id: id based on the graph definition in text. @@ -17,19 +17,20 @@ export const draw: DrawDefinition = (text, id, version) => { const securityLevel = getConfig().securityLevel; // handle root and document for when rendering in sandbox mode - let sandboxElement: SVG | undefined; + let sandboxElement: HTML | undefined; + let document: Document | null | undefined; if (securityLevel === 'sandbox') { sandboxElement = select('#i' + id); + document = sandboxElement.nodes()[0].contentDocument; } - let root; - if (securityLevel === 'sandbox' && sandboxElement !== undefined) { - root = select(sandboxElement.nodes()[0].contentDocument!.body); - } else { - root = select('body'); - } - // @ts-ignore - TODO: figure out how to resolve this - const svg = root.select('#' + id); + // @ts-ignore - figure out how to assign HTML to document type + const root: HTML = + sandboxElement !== undefined && document !== undefined && document !== null + ? select(document) + : select('body'); + + const svg: SVG = root.select('#' + id); svg.attr('height', 100); svg.attr('width', 400); From 6af2438474cf8601110a6d6bd36f51a6a2b82d94 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 13:48:39 +0300 Subject: [PATCH 23/43] add default info db and recreate clear function for info --- packages/mermaid/src/diagrams/info/infoDb.ts | 9 ++++++--- packages/mermaid/src/diagrams/info/infoTypes.ts | 4 ++++ 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index 9689820343..4b6830675f 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -1,7 +1,6 @@ -import { clear } from '../../commonDb.js'; -import type { InfoDB } from './infoTypes.js'; +import { DEFAULT_INFO_DB, type InfoDB } from './infoTypes.js'; -let info = false; +let info: boolean = DEFAULT_INFO_DB.info; export const setInfo = (toggle: boolean): void => { info = toggle; @@ -9,6 +8,10 @@ export const setInfo = (toggle: boolean): void => { export const getInfo = (): boolean => info; +const clear = (): void => { + info = DEFAULT_INFO_DB.info; +}; + const db: InfoDB = { clear, setInfo, diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts index 9878642b19..2dff5322d0 100644 --- a/packages/mermaid/src/diagrams/info/infoTypes.ts +++ b/packages/mermaid/src/diagrams/info/infoTypes.ts @@ -1,5 +1,9 @@ import type { DiagramDB } from '../../diagram-api/types.js'; +export const DEFAULT_INFO_DB = { + info: false, +} as const; + export interface InfoDB extends DiagramDB { clear: () => void; setInfo: (info: boolean) => void; From 8d60ef6d0a18d20d0a0f5ddeb1fe9e95b795e00b Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 13:54:09 +0300 Subject: [PATCH 24/43] add info fields interface --- packages/mermaid/src/diagrams/info/infoTypes.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts index 2dff5322d0..ae422eea6c 100644 --- a/packages/mermaid/src/diagrams/info/infoTypes.ts +++ b/packages/mermaid/src/diagrams/info/infoTypes.ts @@ -1,6 +1,10 @@ import type { DiagramDB } from '../../diagram-api/types.js'; -export const DEFAULT_INFO_DB = { +export interface InfoFields { + info: boolean; +} + +export const DEFAULT_INFO_DB: InfoFields = { info: false, } as const; From 0c449bbd27db43ee217a20ee028b569b53cca975 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 17:27:04 +0300 Subject: [PATCH 25/43] handle optional `.styles` --- packages/mermaid/src/diagram-api/diagramAPI.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagram-api/diagramAPI.ts b/packages/mermaid/src/diagram-api/diagramAPI.ts index 7e89d9cd79..457dd673ba 100644 --- a/packages/mermaid/src/diagram-api/diagramAPI.ts +++ b/packages/mermaid/src/diagram-api/diagramAPI.ts @@ -7,6 +7,7 @@ import { addStylesForDiagram } from '../styles.js'; import { DiagramDefinition, DiagramDetector } from './types.js'; import * as _commonDb from '../commonDb.js'; import { parseDirective as _parseDirective } from '../directiveUtils.js'; +import isEmpty from 'lodash-es/isEmpty.js'; /* Packaging and exposing resources for external diagrams so that they can import @@ -50,7 +51,9 @@ export const registerDiagram = ( if (detector) { addDetector(id, detector); } - addStylesForDiagram(id, diagram.styles); + if (!isEmpty(diagram.styles)) { + addStylesForDiagram(id, diagram.styles); + } if (diagram.injectUtils) { diagram.injectUtils( From 4b7ed7845b69e784c439da24b96c40dff5de5c5f Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 17:28:37 +0300 Subject: [PATCH 26/43] remove handled `ts-ignore` in info diagram --- packages/mermaid/src/diagrams/info/infoRenderer.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index f486ecac9e..dccc33c8db 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -1,4 +1,3 @@ -// @ts-ignore - TODO: fix ts error from d3 import { select } from 'd3'; import { log } from '../../logger.js'; import { getConfig } from '../../config.js'; From 599fb3a72823beddcef6be1ad9d05b74a3bfec23 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 20:13:22 +0300 Subject: [PATCH 27/43] assign returned variables to their variables --- packages/mermaid/src/diagrams/info/infoDb.ts | 6 +++--- packages/mermaid/src/diagrams/info/infoDetector.ts | 8 ++++---- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index 4b6830675f..7b837b7b20 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -13,9 +13,9 @@ const clear = (): void => { }; const db: InfoDB = { - clear, - setInfo, - getInfo, + clear: clear, + setInfo: setInfo, + getInfo: getInfo, }; export default db; diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index 819400cd23..e27c4b0822 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -12,13 +12,13 @@ const detector: DiagramDetector = (txt) => { const loader: DiagramLoader = async () => { const { diagram } = await import('./infoDiagram.js'); - return { id, diagram }; + return { id: id, diagram: diagram }; }; const plugin: ExternalDiagramDefinition = { - id, - detector, - loader, + id: id, + detector: detector, + loader: loader, }; export default plugin; From 638c3691a831ce64922480ab91fabb0d5bdbcdfa Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 21:14:55 +0300 Subject: [PATCH 28/43] remove id and diagram assigning in info loader --- packages/mermaid/src/diagrams/info/infoDetector.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index e27c4b0822..08a780f395 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -12,7 +12,7 @@ const detector: DiagramDetector = (txt) => { const loader: DiagramLoader = async () => { const { diagram } = await import('./infoDiagram.js'); - return { id: id, diagram: diagram }; + return { id, diagram }; }; const plugin: ExternalDiagramDefinition = { From 6ff33149e0d4501ec32daeaf460a9916f0b910d0 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 22:01:27 +0300 Subject: [PATCH 29/43] move default_info_db into infoDbOF --- packages/mermaid/src/diagrams/info/infoDb.ts | 6 +++++- packages/mermaid/src/diagrams/info/infoTypes.ts | 4 ---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index 7b837b7b20..0f81dff42b 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -1,4 +1,8 @@ -import { DEFAULT_INFO_DB, type InfoDB } from './infoTypes.js'; +import type { InfoFields, InfoDB } from './infoTypes.js'; + +export const DEFAULT_INFO_DB: InfoFields = { + info: false, +} as const; let info: boolean = DEFAULT_INFO_DB.info; diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts index ae422eea6c..239f8fdda3 100644 --- a/packages/mermaid/src/diagrams/info/infoTypes.ts +++ b/packages/mermaid/src/diagrams/info/infoTypes.ts @@ -4,10 +4,6 @@ export interface InfoFields { info: boolean; } -export const DEFAULT_INFO_DB: InfoFields = { - info: false, -} as const; - export interface InfoDB extends DiagramDB { clear: () => void; setInfo: (info: boolean) => void; From 0cc93d38c62b27d36b1aacf25b8bd96f7f4da154 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 22:04:28 +0300 Subject: [PATCH 30/43] use object destructuring for getConfig in infoRenderer --- packages/mermaid/src/diagrams/info/infoRenderer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index dccc33c8db..0108780210 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -14,7 +14,7 @@ export const draw: DrawDefinition = (text, id, version) => { try { log.debug('rendering info diagram\n' + text); - const securityLevel = getConfig().securityLevel; + const { securityLevel } = getConfig(); // handle root and document for when rendering in sandbox mode let sandboxElement: HTML | undefined; let document: Document | null | undefined; From d6bd59c46e8869ea8d9b5c17764ed21424f82412 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 22:09:15 +0300 Subject: [PATCH 31/43] remove assigned variables to their variables and export db without default --- packages/mermaid/src/diagrams/info/infoDb.ts | 8 ++++---- packages/mermaid/src/diagrams/info/infoDetector.ts | 6 +++--- packages/mermaid/src/diagrams/info/infoDiagram.ts | 8 ++++---- 3 files changed, 11 insertions(+), 11 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index 0f81dff42b..e10790c32a 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -17,9 +17,9 @@ const clear = (): void => { }; const db: InfoDB = { - clear: clear, - setInfo: setInfo, - getInfo: getInfo, + clear, + setInfo, + getInfo, }; -export default db; +export { db }; diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index 08a780f395..819400cd23 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -16,9 +16,9 @@ const loader: DiagramLoader = async () => { }; const plugin: ExternalDiagramDefinition = { - id: id, - detector: detector, - loader: loader, + id, + detector, + loader, }; export default plugin; diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index 277a14317f..c136e15cb7 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -1,11 +1,11 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore - jison doesn't export types import parser from './parser/info.jison'; -import db from './infoDb.js'; +import { db } from './infoDb.js'; import renderer from './infoRenderer.js'; export const diagram: DiagramDefinition = { - parser: parser, - db: db, - renderer: renderer, + parser, + db, + renderer, }; From bf346ea15537c8daf0c2e71efe5d69c89de774c4 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 22:23:31 +0300 Subject: [PATCH 32/43] resolve db import in info.spec.ts --- packages/mermaid/src/diagrams/info/info.spec.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/info.spec.ts b/packages/mermaid/src/diagrams/info/info.spec.ts index 9caca6a2ae..763573b72a 100644 --- a/packages/mermaid/src/diagrams/info/info.spec.ts +++ b/packages/mermaid/src/diagrams/info/info.spec.ts @@ -1,10 +1,10 @@ // @ts-ignore - jison doesn't export types import { parser } from './parser/info.jison'; -import infoDb from './infoDb.js'; +import { db } from './infoDb.js'; describe('info graph', () => { beforeEach(() => { - parser.yy = infoDb; + parser.yy = db; parser.yy.clear(); }); @@ -12,13 +12,13 @@ describe('info graph', () => { const str = `info`; parser.parse(str); - expect(infoDb.getInfo()).toBeFalsy(); + expect(db.getInfo()).toBeFalsy(); }); it('should handle an info definition with showInfo', () => { const str = `info showInfo`; parser.parse(str); - expect(infoDb.getInfo()).toBeTruthy(); + expect(db.getInfo()).toBeTruthy(); }); }); From f630fba392041cddf7f2aa53891960e01102246c Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Wed, 14 Jun 2023 23:27:27 +0300 Subject: [PATCH 33/43] remove default export in info files --- packages/mermaid/src/diagram-api/diagram-orchestration.ts | 2 +- packages/mermaid/src/diagrams/info/infoDetector.ts | 2 +- packages/mermaid/src/diagrams/info/infoDiagram.ts | 2 +- packages/mermaid/src/diagrams/info/infoRenderer.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/mermaid/src/diagram-api/diagram-orchestration.ts b/packages/mermaid/src/diagram-api/diagram-orchestration.ts index 03c04ed094..0253be45d5 100644 --- a/packages/mermaid/src/diagram-api/diagram-orchestration.ts +++ b/packages/mermaid/src/diagram-api/diagram-orchestration.ts @@ -4,7 +4,7 @@ import flowchartV2 from '../diagrams/flowchart/flowDetector-v2.js'; import er from '../diagrams/er/erDetector.js'; import git from '../diagrams/git/gitGraphDetector.js'; import gantt from '../diagrams/gantt/ganttDetector.js'; -import info from '../diagrams/info/infoDetector.js'; +import { info } from '../diagrams/info/infoDetector.js'; import pie from '../diagrams/pie/pieDetector.js'; import quadrantChart from '../diagrams/quadrant-chart/quadrantDetector.js'; import requirement from '../diagrams/requirement/requirementDetector.js'; diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index 819400cd23..0a5a73c947 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -21,4 +21,4 @@ const plugin: ExternalDiagramDefinition = { loader, }; -export default plugin; +export const info = plugin; diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts index c136e15cb7..b21827b5fa 100644 --- a/packages/mermaid/src/diagrams/info/infoDiagram.ts +++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts @@ -2,7 +2,7 @@ import type { DiagramDefinition } from '../../diagram-api/types.js'; // @ts-ignore - jison doesn't export types import parser from './parser/info.jison'; import { db } from './infoDb.js'; -import renderer from './infoRenderer.js'; +import { renderer } from './infoRenderer.js'; export const diagram: DiagramDefinition = { parser, diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 0108780210..970fe7791a 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -47,4 +47,4 @@ export const draw: DrawDefinition = (text, id, version) => { } }; -export default { draw }; +export const renderer = { draw }; From 689ffbf5a54bc77b9b2cd9d75e9ec25d4e578547 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Thu, 15 Jun 2023 01:01:35 +0300 Subject: [PATCH 34/43] change infoDb db export --- packages/mermaid/src/diagrams/info/infoDb.ts | 4 +--- packages/mermaid/src/diagrams/info/infoRenderer.ts | 2 +- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts index e10790c32a..ff4bfcae05 100644 --- a/packages/mermaid/src/diagrams/info/infoDb.ts +++ b/packages/mermaid/src/diagrams/info/infoDb.ts @@ -16,10 +16,8 @@ const clear = (): void => { info = DEFAULT_INFO_DB.info; }; -const db: InfoDB = { +export const db: InfoDB = { clear, setInfo, getInfo, }; - -export { db }; diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts index 970fe7791a..79f3ec9920 100644 --- a/packages/mermaid/src/diagrams/info/infoRenderer.ts +++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts @@ -10,7 +10,7 @@ import type { DrawDefinition, HTML, SVG } from '../../diagram-api/types.js'; * @param id - The id of the diagram which will be used as a DOM element id. * @param version - MermaidJS version. */ -export const draw: DrawDefinition = (text, id, version) => { +const draw: DrawDefinition = (text, id, version) => { try { log.debug('rendering info diagram\n' + text); From 9deae27c823ff537cdf385c53c51547f9cb47145 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Thu, 15 Jun 2023 02:30:51 +0300 Subject: [PATCH 35/43] add messing timeline and info demoes links --- demos/index.html | 6 ++++++ demos/info.html | 36 ++++++++++++++++++++++++++++++++++++ 2 files changed, 42 insertions(+) create mode 100644 demos/info.html diff --git a/demos/index.html b/demos/index.html index 5299c22027..391042182c 100644 --- a/demos/index.html +++ b/demos/index.html @@ -45,6 +45,9 @@

Gantt

  • Git

    • +
  • +

    Info

    +

  • Journey

    • @@ -66,6 +69,9 @@

    Sequence

  • State

    • +
  • +

    Timeline

    +

  • ZenUML

    • diff --git a/demos/info.html b/demos/info.html new file mode 100644 index 0000000000..7ef8f40fce --- /dev/null +++ b/demos/info.html @@ -0,0 +1,36 @@ + + + + + + Mermaid Quick Test Page + + + + + +

    Info diagram demos

    + 
    +    info
+
    + +
    + 
    +    info showInfo
+
    + + + + From 7e639bec3ae72c6e1e1beb18a658047cf9480089 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Thu, 15 Jun 2023 02:31:51 +0300 Subject: [PATCH 36/43] convert the cypress info.spec.js into ts --- cypress/integration/rendering/info.spec.js | 13 ------------- cypress/integration/rendering/info.spec.ts | 11 +++++++++++ packages/mermaid/src/diagrams/info/info.spec.ts | 2 +- 3 files changed, 12 insertions(+), 14 deletions(-) delete mode 100644 cypress/integration/rendering/info.spec.js create mode 100644 cypress/integration/rendering/info.spec.ts diff --git a/cypress/integration/rendering/info.spec.js b/cypress/integration/rendering/info.spec.js deleted file mode 100644 index bcfce30e3f..0000000000 --- a/cypress/integration/rendering/info.spec.js +++ /dev/null @@ -1,13 +0,0 @@ -import { imgSnapshotTest } from '../../helpers/util.js'; - -describe('Sequencediagram', () => { - it('should render a simple info diagrams', () => { - imgSnapshotTest( - ` - info - showInfo - `, - {} - ); - }); -}); diff --git a/cypress/integration/rendering/info.spec.ts b/cypress/integration/rendering/info.spec.ts new file mode 100644 index 0000000000..ea689f027e --- /dev/null +++ b/cypress/integration/rendering/info.spec.ts @@ -0,0 +1,11 @@ +import { imgSnapshotTest } from '../../helpers/util.js'; + +describe('info diagram', () => { + it('should handle an info definition', () => { + imgSnapshotTest(`info`, {}); + }); + + it('should handle an info definition with showInfo', () => { + imgSnapshotTest(`info showInfo`, {}); + }); +}); diff --git a/packages/mermaid/src/diagrams/info/info.spec.ts b/packages/mermaid/src/diagrams/info/info.spec.ts index 763573b72a..076f04f69c 100644 --- a/packages/mermaid/src/diagrams/info/info.spec.ts +++ b/packages/mermaid/src/diagrams/info/info.spec.ts @@ -2,7 +2,7 @@ import { parser } from './parser/info.jison'; import { db } from './infoDb.js'; -describe('info graph', () => { +describe('info diagram', () => { beforeEach(() => { parser.yy = db; parser.yy.clear(); From 35e81f3fd4f40db73ec06d8b958f0a048c5c627a Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Thu, 15 Jun 2023 02:56:29 +0300 Subject: [PATCH 37/43] format and add theme to cypress info.html --- cypress/platform/info.html | 14 ++++++++------ demos/info.html | 11 +++++------ 2 files changed, 13 insertions(+), 12 deletions(-) diff --git a/cypress/platform/info.html b/cypress/platform/info.html index c354461537..1b32fe1d39 100644 --- a/cypress/platform/info.html +++ b/cypress/platform/info.html @@ -5,18 +5,20 @@

    info below

    -info
+        info
    + +
    + 
    +        info showInfo
+
    + diff --git a/demos/info.html b/demos/info.html index 7ef8f40fce..a6b53270de 100644 --- a/demos/info.html +++ b/demos/info.html @@ -15,19 +15,18 @@

    Info diagram demos

    -    info
-
    + info + 
    -    info showInfo
-
    + info showInfo + - - From 95bba56bd82fc4b28df5bcae495e1c2e7fcb65f3 Mon Sep 17 00:00:00 2001 From: Yokozuna59 Date: Fri, 16 Jun 2023 00:07:06 +0300 Subject: [PATCH 43/43] rename plugin variable into info in infoDetector.ts --- packages/mermaid/src/diagrams/info/infoDetector.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/mermaid/src/diagrams/info/infoDetector.ts b/packages/mermaid/src/diagrams/info/infoDetector.ts index 0a5a73c947..04d2677efb 100644 --- a/packages/mermaid/src/diagrams/info/infoDetector.ts +++ b/packages/mermaid/src/diagrams/info/infoDetector.ts @@ -15,10 +15,8 @@ const loader: DiagramLoader = async () => { return { id, diagram }; }; -const plugin: ExternalDiagramDefinition = { +export const info: ExternalDiagramDefinition = { id, detector, loader, }; - -export const info = plugin;