From 87cdc03e84abf05bbfac64d3c411f8229346ae0e Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Sun, 16 Oct 2022 10:05:11 +0530 Subject: [PATCH] fix: getElementById type issue. Converts mindmapDB to TS --- packages/mermaid-mindmap/package.json | 1 + packages/mermaid-mindmap/src/mermaidUtils.ts | 4 +- .../src/{mindmapDb.js => mindmapDb.ts} | 60 +++++++++++-------- pnpm-lock.yaml | 2 + 4 files changed, 41 insertions(+), 26 deletions(-) rename packages/mermaid-mindmap/src/{mindmapDb.js => mindmapDb.ts} (64%) diff --git a/packages/mermaid-mindmap/package.json b/packages/mermaid-mindmap/package.json index 847eeffef..dfbe5b88e 100644 --- a/packages/mermaid-mindmap/package.json +++ b/packages/mermaid-mindmap/package.json @@ -58,6 +58,7 @@ }, "devDependencies": { "concurrently": "^7.4.0", + "mermaid": "workspace:*", "rimraf": "^3.0.2" }, "resolutions": { diff --git a/packages/mermaid-mindmap/src/mermaidUtils.ts b/packages/mermaid-mindmap/src/mermaidUtils.ts index 7d8ac38bf..c3d70be13 100644 --- a/packages/mermaid-mindmap/src/mermaidUtils.ts +++ b/packages/mermaid-mindmap/src/mermaidUtils.ts @@ -1,3 +1,5 @@ +import type { MermaidConfig } from 'mermaid/dist/config.type'; + const warning = (s: string) => { // Todo remove debug code console.error('Log function was called before initialization', s); // eslint-disable-line @@ -24,7 +26,7 @@ export const log: Record = { }; export let setLogLevel: (level: keyof typeof LEVELS | number | string) => void; -export let getConfig: () => object; +export let getConfig: () => MermaidConfig; export let sanitizeText: (str: string) => string; // eslint-disable @typescript-eslint/no-explicit-any export let setupGraphViewbox: ( diff --git a/packages/mermaid-mindmap/src/mindmapDb.js b/packages/mermaid-mindmap/src/mindmapDb.ts similarity index 64% rename from packages/mermaid-mindmap/src/mindmapDb.js rename to packages/mermaid-mindmap/src/mindmapDb.ts index 2ae98c223..3f35d9209 100644 --- a/packages/mermaid-mindmap/src/mindmapDb.js +++ b/packages/mermaid-mindmap/src/mindmapDb.ts @@ -1,16 +1,30 @@ /** Created by knut on 15-01-14. */ import { sanitizeText, getConfig, log } from './mermaidUtils'; +import type { DetailedError } from 'mermaid/dist/utils'; -let nodes = []; +interface Node { + id: number; + nodeId: string; + level: number; + descr: string; + type: number; + children: Node[]; + width: number; + padding: number; + icon?: string; + class?: string; +} + +let nodes: Node[] = []; let cnt = 0; -let elements = {}; +let elements: Record = {}; export const clear = () => { nodes = []; cnt = 0; elements = {}; }; -const getParent = function (level) { +const getParent = function (level: number) { for (let i = nodes.length - 1; i >= 0; i--) { if (nodes[i].level < level) { return nodes[i]; @@ -23,28 +37,21 @@ const getParent = function (level) { export const getMindmap = () => { return nodes.length > 0 ? nodes[0] : null; }; -export const addNode = (level, id, descr, type) => { + +export const addNode = (level: number, id: string, descr: string, type: number) => { log.info('addNode', level, id, descr, type); const conf = getConfig(); - const node = { + const padding = conf.mindmap?.padding ?? 15; + const node: Node = { id: cnt++, nodeId: sanitizeText(id), level, descr: sanitizeText(descr), type, children: [], - width: getConfig().mindmap.maxNodeWidth, + width: getConfig().mindmap?.maxNodeWidth ?? 200, + padding: type === nodeType.ROUNDED_RECT || type === nodeType.RECT ? 2 * padding : padding, }; - switch (node.type) { - case nodeType.ROUNDED_RECT: - node.padding = 2 * conf.mindmap.padding; - break; - case nodeType.RECT: - node.padding = 2 * conf.mindmap.padding; - break; - default: - node.padding = conf.mindmap.padding; - } const parent = getParent(level); if (parent) { parent.children.push(node); @@ -56,9 +63,10 @@ export const addNode = (level, id, descr, type) => { nodes.push(node); } else { // Syntax error ... there can only bee one root - let error = new Error( + const error = new Error( 'There can be only one root. No parent could be found for ("' + node.descr + '")' ); + // @ts-ignore TODO: Add mermaid error error.hash = { text: 'branch ' + name, token: 'branch ' + name, @@ -81,7 +89,7 @@ export const nodeType = { BANG: 5, }; -export const getType = (startStr, endStr) => { +export const getType = (startStr: string, endStr: string): number => { log.debug('In get type', startStr, endStr); switch (startStr) { case '[': @@ -99,11 +107,11 @@ export const getType = (startStr, endStr) => { } }; -export const setElementForId = (id, element) => { +export const setElementForId = (id: number, element: HTMLElement) => { elements[id] = element; }; -export const decorateNode = (decoration) => { +export const decorateNode = (decoration: { icon: string; class: string }) => { const node = nodes[nodes.length - 1]; if (decoration && decoration.icon) { node.icon = sanitizeText(decoration.icon); @@ -113,7 +121,7 @@ export const decorateNode = (decoration) => { } }; -export const type2Str = (type) => { +export const type2Str = (type: number) => { switch (type) { case nodeType.DEFAULT: return 'no-border'; @@ -132,13 +140,15 @@ export const type2Str = (type) => { } }; -export let parseError; -export const setErrorHandler = (handler) => { +export type ParseErrorFunction = (err: string | DetailedError, hash?: any) => void; +export let parseError: ParseErrorFunction; +export const setErrorHandler = (handler: ParseErrorFunction) => { parseError = handler; }; // Expose logger to grammar export const getLogger = () => log; -export const getNodeById = (id) => nodes[id]; -export const getElementById = (id) => elements[id]; +export const getNodeById = (id: number): Node => nodes[id]; +export const getElementById = (id: number | string): HTMLElement => + elements[typeof id === 'string' ? parseInt(id) : id]; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6e8a66ae1..f83721ed2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -289,6 +289,7 @@ importers: cytoscape-cose-bilkent: ^4.1.0 cytoscape-fcose: ^2.1.0 d3: ^7.0.0 + mermaid: workspace:* non-layered-tidy-tree-layout: ^2.0.2 rimraf: ^3.0.2 dependencies: @@ -300,6 +301,7 @@ importers: non-layered-tidy-tree-layout: 2.0.2 devDependencies: concurrently: 7.4.0 + mermaid: link:../mermaid rimraf: 3.0.2 packages: