From 1b5bd999e2911345ca7f02e1de3a8a6b37ddc0dc Mon Sep 17 00:00:00 2001 From: Per Brolin Date: Wed, 12 Jun 2024 12:10:20 +0200 Subject: [PATCH 1/3] 5237 Replaced useRough by look --- .../mermaid/src/diagrams/flowchart/flowDb.ts | 9 ++++----- .../mermaid/src/diagrams/state/dataFetcher.js | 18 +++++------------- packages/mermaid/src/diagrams/state/stateDb.js | 3 +-- .../rendering-elements/clusters.js | 7 +++---- .../rendering-util/rendering-elements/edges.js | 3 +-- .../rendering-elements/shapes/choice.ts | 2 +- .../rendering-elements/shapes/circle.ts | 4 ++-- .../rendering-elements/shapes/cylinder.ts | 4 ++-- .../rendering-elements/shapes/doubleCircle.ts | 4 ++-- .../rendering-elements/shapes/drawRect.ts | 4 ++-- .../rendering-elements/shapes/forkJoin.ts | 2 +- .../rendering-elements/shapes/hexagon.ts | 4 ++-- .../shapes/invertedTrapezoid.ts | 4 ++-- .../rendering-elements/shapes/leanLeft.ts | 4 ++-- .../rendering-elements/shapes/leanRight.ts | 4 ++-- .../rendering-elements/shapes/note.ts | 4 ++-- .../rendering-elements/shapes/question.ts | 4 ++-- .../shapes/rectLeftInvArrow.ts | 4 ++-- .../rendering-elements/shapes/stadium.ts | 4 ++-- .../rendering-elements/shapes/stateEnd.ts | 2 +- .../rendering-elements/shapes/stateStart.ts | 2 +- .../rendering-elements/shapes/subroutine.ts | 4 ++-- .../rendering-elements/shapes/trapezoid.ts | 4 ++-- packages/mermaid/src/rendering-util/types.d.ts | 5 +++-- 24 files changed, 49 insertions(+), 60 deletions(-) diff --git a/packages/mermaid/src/diagrams/flowchart/flowDb.ts b/packages/mermaid/src/diagrams/flowchart/flowDb.ts index 01a33120c..0faa5c048 100644 --- a/packages/mermaid/src/diagrams/flowchart/flowDb.ts +++ b/packages/mermaid/src/diagrams/flowchart/flowDb.ts @@ -793,7 +793,7 @@ const addNodeFromVertex = ( parentDB: Map, subGraphDB: Map, config: any, - useRough: boolean + look: string ) => { let parentId = parentDB.get(vertex.id); let isGroup = subGraphDB.get(vertex.id) || false; @@ -812,7 +812,7 @@ const addNodeFromVertex = ( dir: vertex.dir, domId: vertex.domId, isGroup, - useRough, + look, }); } }; @@ -822,7 +822,6 @@ export const getData = () => { const nodes: Node[] = []; const edges: Edge[] = []; - const useRough = config.look === 'handdrawn'; const subGraphs = getSubGraphs(); log.info('Subgraphs - APA12', subGraphs); const parentDB = new Map(); @@ -847,7 +846,7 @@ export const getData = () => { shape: 'rect', dir: subGraph.dir, isGroup: true, - useRough, + look: config.look, }); } @@ -873,7 +872,7 @@ export const getData = () => { arrowTypeEnd, arrowheadStyle: 'fill: #333', pattern: rawEdge.stroke, - useRough, + look: config.look, }; console.log('rawEdge SPLIT', rawEdge, index); edges.push(edge); diff --git a/packages/mermaid/src/diagrams/state/dataFetcher.js b/packages/mermaid/src/diagrams/state/dataFetcher.js index 3bdf1abe0..2f0edb7a7 100644 --- a/packages/mermaid/src/diagrams/state/dataFetcher.js +++ b/packages/mermaid/src/diagrams/state/dataFetcher.js @@ -54,16 +54,16 @@ export function stateDomId(itemId = '', counter = 0, type = '', typeSpacer = DOM return `${DOMID_STATE}-${itemId}${typeStr}-${counter}`; } -const setupDoc = (parentParsedItem, doc, diagramStates, nodes, edges, altFlag, useRough, look) => { +const setupDoc = (parentParsedItem, doc, diagramStates, nodes, edges, altFlag, look) => { // graphItemCount = 0; log.trace('items', doc); doc.forEach((item) => { switch (item.stmt) { case STMT_STATE: - dataFetcher(parentParsedItem, item, diagramStates, nodes, edges, altFlag, useRough, look); + dataFetcher(parentParsedItem, item, diagramStates, nodes, edges, altFlag, look); break; case DEFAULT_STATE_TYPE: - dataFetcher(parentParsedItem, item, diagramStates, nodes, edges, altFlag, useRough, look); + dataFetcher(parentParsedItem, item, diagramStates, nodes, edges, altFlag, look); break; case STMT_RELATION: { @@ -73,8 +73,7 @@ const setupDoc = (parentParsedItem, doc, diagramStates, nodes, edges, altFlag, u diagramStates, nodes, edges, - altFlag, - useRough, + altFlag,, look ); dataFetcher( @@ -84,7 +83,6 @@ const setupDoc = (parentParsedItem, doc, diagramStates, nodes, edges, altFlag, u nodes, edges, altFlag, - useRough, look ); const edgeData = { @@ -101,7 +99,6 @@ const setupDoc = (parentParsedItem, doc, diagramStates, nodes, edges, altFlag, u labelType: G_EDGE_LABELTYPE, thickness: G_EDGE_THICKNESS, classes: CSS_EDGE, - useRough, look, }; edges.push(edgeData); @@ -232,7 +229,6 @@ export const dataFetcher = ( nodes, edges, altFlag, - useRough, look ) => { const itemId = parsedItem.id; @@ -324,7 +320,6 @@ export const dataFetcher = ( padding: 8, rx: 10, ry: 10, - useRough, look, }; @@ -354,7 +349,6 @@ export const dataFetcher = ( type: newNode.type, isGroup: newNode.type === 'group', padding: 0, //getConfig().flowchart.padding - useRough, look, position: parsedItem.note.position, }; @@ -369,7 +363,6 @@ export const dataFetcher = ( type: 'group', isGroup: true, padding: 16, //getConfig().flowchart.padding - useRough, look, position: parsedItem.note.position, }; @@ -410,7 +403,6 @@ export const dataFetcher = ( labelpos: G_EDGE_LABELPOS, labelType: G_EDGE_LABELTYPE, thickness: G_EDGE_THICKNESS, - useRough, look, }); } else { @@ -419,7 +411,7 @@ export const dataFetcher = ( } if (parsedItem.doc) { log.trace('Adding nodes children '); - setupDoc(parsedItem, parsedItem.doc, diagramStates, nodes, edges, !altFlag, useRough, look); + setupDoc(parsedItem, parsedItem.doc, diagramStates, nodes, edges, !altFlag, look); } }; diff --git a/packages/mermaid/src/diagrams/state/stateDb.js b/packages/mermaid/src/diagrams/state/stateDb.js index e2f643af3..d4de32889 100644 --- a/packages/mermaid/src/diagrams/state/stateDb.js +++ b/packages/mermaid/src/diagrams/state/stateDb.js @@ -228,10 +228,9 @@ const extract = (_doc) => { const diagramStates = getStates(); const config = getConfig(); - const useRough = config.look === 'handdrawn'; const look = config.look; resetDataFetching(); - dataFetcher(undefined, getRootDocV2(), diagramStates, nodes, edges, true, useRough, look); + dataFetcher(undefined, getRootDocV2(), diagramStates, nodes, edges, true, look); }; /** diff --git a/packages/mermaid/src/rendering-util/rendering-elements/clusters.js b/packages/mermaid/src/rendering-util/rendering-elements/clusters.js index b66d44987..2bbb13c62 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/clusters.js +++ b/packages/mermaid/src/rendering-util/rendering-elements/clusters.js @@ -15,7 +15,6 @@ const rect = (parent, node) => { const siteConfig = getConfig(); const { themeVariables, handdrawnSeed } = siteConfig; const { clusterBkg, clusterBorder } = themeVariables; - let { useRough } = node; // Add outer g element const shapeSvg = parent.insert('g').attr('class', 'cluster').attr('id', node.id); @@ -60,7 +59,7 @@ const rect = (parent, node) => { log.trace('Data ', node, JSON.stringify(node)); let rect; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore TODO: Fix rough typings const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, { @@ -223,7 +222,7 @@ const roundedWithTitle = (parent, node) => { // add the rect let rect; - if (node.useRough) { + if (node.look === 'handdrawn') { const isAlt = node.cssClasses.includes('statediagram-cluster-alt'); const rc = rough.svg(shapeSvg); const roughOuterNode = @@ -305,7 +304,7 @@ const divider = (parent, node) => { const y = node.y - node.height / 2; const width = node.width + padding; const height = node.height + padding; - if (node.useRough) { + if (node.look === 'handdrawn') { const rc = rough.svg(shapeSvg); const roughNode = rc.rectangle(x, y, width, height, { fill: 'lightgrey', diff --git a/packages/mermaid/src/rendering-util/rendering-elements/edges.js b/packages/mermaid/src/rendering-util/rendering-elements/edges.js index bdf20a966..b802c2ca8 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/edges.js +++ b/packages/mermaid/src/rendering-util/rendering-elements/edges.js @@ -592,11 +592,10 @@ export const insertEdge = function (elem, edge, clusterDb, diagramType, startNod default: strokeClasses += ' edge-pattern-solid'; } - let useRough = edge.useRough; let svgPath; let path = ''; let linePath = lineFunction(lineData); - if (useRough) { + if (edge.look === 'handdrawn') { const rc = rough.svg(elem); const ld = Object.assign([], lineData); // const svgPathNode = rc.path(lineFunction(ld.splice(0, ld.length-1)), { diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/choice.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/choice.ts index 8248f3ddd..809b543ed 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/choice.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/choice.ts @@ -22,7 +22,7 @@ export const choice = (parent: SVG, node: Node) => { ]; let choice; - if (node.useRough) { + if (node.look === 'handdrawn') { // @ts-ignore TODO: Fix rough typings const rc = rough.svg(shapeSvg); const pointArr = points.map(function (d) { diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/circle.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/circle.ts index a77525b65..17b555bbe 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/circle.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/circle.ts @@ -15,9 +15,9 @@ export const circle = async (parent: SVGAElement, node: Node): Promise { const h = bbox.height + ry + node.padding; let cylinder: d3.Selection; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const outerPathData = createOuterCylinderPathD(0, 0, w, h, rx, ry); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/doubleCircle.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/doubleCircle.ts index 096b3ded1..fa6182c32 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/doubleCircle.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/doubleCircle.ts @@ -18,9 +18,9 @@ export const doublecircle = async (parent: SVGAElement, node: Node): Promise { const y = (-1 * height) / 2; let shape; - if (node.useRough) { + if (node.look === 'handdrawn') { // @ts-ignore TODO: Fix rough typings const rc = rough.svg(shapeSvg); const roughNode = rc.rectangle(x, y, width, height, solidStateFill(lineColor)); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/hexagon.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/hexagon.ts index 00737a49e..07f5e9c6a 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/hexagon.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/hexagon.ts @@ -47,9 +47,9 @@ export const hexagon = async (parent: SVGAElement, node: Node): Promise; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/invertedTrapezoid.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/invertedTrapezoid.ts index f7753ba07..f53fbf92c 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/invertedTrapezoid.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/invertedTrapezoid.ts @@ -35,9 +35,9 @@ export const inv_trapezoid = async (parent: SVGAElement, node: Node): Promise; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanLeft.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanLeft.ts index 6c8a0451f..06a408a93 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanLeft.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanLeft.ts @@ -34,9 +34,9 @@ export const lean_left = async (parent: SVGAElement, node: Node): Promise; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanRight.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanRight.ts index 61f14dc4a..c2a5aac70 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanRight.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/leanRight.ts @@ -34,9 +34,9 @@ export const lean_right = async (parent: SVGAElement, node: Node): Promise; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/note.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/note.ts index 5843f558b..79c7129a1 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/note.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/note.ts @@ -21,14 +21,14 @@ export const note = async (parent: SVGAElement, node: Node) => { ); log.info('Classes = ', node.cssClasses); - const { cssStyles, useRough } = node; + const { cssStyles } = node; let rect; const totalWidth = bbox.width + node.padding; const totalHeight = bbox.height + node.padding; const x = -bbox.width / 2 - halfPadding; const y = -bbox.height / 2 - halfPadding; - if (useRough) { + if (node.look === 'handdrawn') { // add the rect // @ts-ignore TODO: Fix rough typings const rc = rough.svg(shapeSvg); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/question.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/question.ts index 4c971a651..df87648c5 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/question.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/question.ts @@ -31,9 +31,9 @@ export const question = async (parent: SVGAElement, node: Node): Promise; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectLeftInvArrow.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectLeftInvArrow.ts index 9b743d89d..a5d0b733c 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectLeftInvArrow.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/rectLeftInvArrow.ts @@ -34,9 +34,9 @@ export const rect_left_inv_arrow = async ( ]; let polygon; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/stadium.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/stadium.ts index 67531da5e..4adf9d474 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/stadium.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/stadium.ts @@ -58,8 +58,8 @@ export const stadium = async (parent: SVGAElement, node: Node) => { const w = bbox.width + h / 4 + node.padding; let rect; - const { cssStyles, useRough } = node; - if (useRough) { + const { cssStyles } = node; + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateEnd.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateEnd.ts index 5f93d7a41..4d4d21d86 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateEnd.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateEnd.ts @@ -17,7 +17,7 @@ export const stateEnd = (parent: SVG, node: Node) => { let circle; let innerCircle; - if (node.useRough) { + if (node.look === 'handdrawn') { // @ts-ignore TODO: Fix rough typings const rc = rough.svg(shapeSvg); const roughNode = rc.circle(0, 0, 14, { ...solidStateFill(lineColor), roughness: 0.5 }); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateStart.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateStart.ts index c045266fd..575e7d2b0 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateStart.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/stateStart.ts @@ -17,7 +17,7 @@ export const stateStart = (parent: SVG, node: Node) => { .attr('id', node.domId || node.id); let circle; - if (node.useRough) { + if (node.look === 'handdrawn') { // @ts-ignore TODO: Fix rough typings const rc = rough.svg(shapeSvg); const roughNode = rc.circle(0, 0, 14, solidStateFill(lineColor)); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/subroutine.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/subroutine.ts index b2fbdebb2..cecd0d8b6 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/subroutine.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/subroutine.ts @@ -40,7 +40,7 @@ export const subroutine = async (parent: SVGAElement, node: Node) => { const x = -bbox.width / 2 - halfPadding; const y = -bbox.height / 2 - halfPadding; let rect; - const { cssStyles, useRough } = node; + const { cssStyles } = node; const points = [ { x: 0, y: 0 }, { x: w, y: 0 }, @@ -54,7 +54,7 @@ export const subroutine = async (parent: SVGAElement, node: Node) => { { x: -8, y: 0 }, ]; - if (useRough) { + if (node.look === 'handdrawn') { // @ts-ignore - rough is not typed const rc = rough.svg(shapeSvg); const options = userNodeOverrides(node, {}); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts index 22a68de3c..1677ef8cf 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts @@ -34,9 +34,9 @@ export const trapezoid = async (parent: SVGAElement, node: Node): Promise; - const { cssStyles, useRough } = node; + const { cssStyles } = node; - if (useRough) { + if (node.look === 'handdrawn') { console.log('Trapezoid: Inside use useRough'); // @ts-ignore const rc = rough.svg(shapeSvg); diff --git a/packages/mermaid/src/rendering-util/types.d.ts b/packages/mermaid/src/rendering-util/types.d.ts index 3d7e70a07..e1f16737b 100644 --- a/packages/mermaid/src/rendering-util/types.d.ts +++ b/packages/mermaid/src/rendering-util/types.d.ts @@ -47,7 +47,6 @@ interface Node { rx?: number; // Used for rounded corners in Rect, Ellipse, etc.Maybe it to specialized RectNode, EllipseNode, etc. ry?: number; - useRough?: boolean; useHtmlLabels?: boolean; centerLabel?: boolean; //keep for now. //Candidate for removal, maybe rely on labelStyle or a specific property labelPosition: Top, Center, Bottom @@ -62,6 +61,8 @@ interface Node { // Flowchart specific properties x?: number; y?: number; + + look?: string; } // Common properties for any edge in the system @@ -92,7 +93,7 @@ interface Edge { minlen?: number; pattern?: string; thickness?: 'normal' | 'thick' | 'invisible'; - useRough?: boolean; + look?: string; } interface RectOptions { From f19a9d021f5974db1536085aac4c03c71cfd19c7 Mon Sep 17 00:00:00 2001 From: Knut Sveidqvist Date: Wed, 12 Jun 2024 12:25:41 +0200 Subject: [PATCH 2/3] 5237 Removed a comma --- .../mermaid/src/diagrams/state/dataFetcher.js | 30 ++----------------- 1 file changed, 3 insertions(+), 27 deletions(-) diff --git a/packages/mermaid/src/diagrams/state/dataFetcher.js b/packages/mermaid/src/diagrams/state/dataFetcher.js index 2f0edb7a7..613fd8779 100644 --- a/packages/mermaid/src/diagrams/state/dataFetcher.js +++ b/packages/mermaid/src/diagrams/state/dataFetcher.js @@ -67,24 +67,8 @@ const setupDoc = (parentParsedItem, doc, diagramStates, nodes, edges, altFlag, l break; case STMT_RELATION: { - dataFetcher( - parentParsedItem, - item.state1, - diagramStates, - nodes, - edges, - altFlag,, - look - ); - dataFetcher( - parentParsedItem, - item.state2, - diagramStates, - nodes, - edges, - altFlag, - look - ); + dataFetcher(parentParsedItem, item.state1, diagramStates, nodes, edges, altFlag, look); + dataFetcher(parentParsedItem, item.state2, diagramStates, nodes, edges, altFlag, look); const edgeData = { id: 'edge' + graphItemCount, start: item.state1.id, @@ -222,15 +206,7 @@ function getClassesFromDbInfo(dbInfoItem) { } } } -export const dataFetcher = ( - parent, - parsedItem, - diagramStates, - nodes, - edges, - altFlag, - look -) => { +export const dataFetcher = (parent, parsedItem, diagramStates, nodes, edges, altFlag, look) => { const itemId = parsedItem.id; const classStr = getClassesFromDbInfo(diagramStates.get(itemId)); From a35152843fdbf57ba7317a1dfb3141c69724c435 Mon Sep 17 00:00:00 2001 From: Knut Sveidqvist Date: Wed, 12 Jun 2024 12:35:53 +0200 Subject: [PATCH 3/3] #5237 Handling remaining references to useRough --- cypress/platform/knsv2.html | 46 ++++++++++++++++--- packages/mermaid/src/config.type.ts | 2 +- .../mermaid/src/diagrams/flowchart/flowDb.ts | 2 +- .../rendering-elements/shapes/trapezoid.ts | 2 +- .../rendering-elements/shapes/util.js | 2 +- .../mermaid/src/schemas/config.schema.yaml | 1 - 6 files changed, 43 insertions(+), 12 deletions(-) diff --git a/cypress/platform/knsv2.html b/cypress/platform/knsv2.html index 260d540d3..9c91100bb 100644 --- a/cypress/platform/knsv2.html +++ b/cypress/platform/knsv2.html @@ -85,7 +85,7 @@ end Apa --> C - 
+    
 flowchart LR
 subgraph Apa["Apa"]
     B["This is B"]
@@ -95,7 +95,7 @@ end
     Apa --> C
       

-    
+    
 flowchart RL
 subgraph Apa["Apa"]
   subgraph Gorilla
@@ -107,7 +107,7 @@ end
     Gorilla --> C
       

-    
+    
 flowchart LR
 subgraph Apa["Apa"]
   subgraph Gorilla
@@ -154,6 +154,32 @@ flowchart LR
     Apa --- C
     A --x C
 
+    
+---
+config:
+  look: neo
+  theme: neo
+  layout: elk
+  elk.mergeEdges: true
+  themeVariables: {}
+---
+%% 'elk.stress',
+%% 'elk.force'
+%%'elk.mrtree'
+%% 'elk.sporeOverlap
+stateDiagram
+  direction TB
+  A --> B
+  A --> C
+  A --> D
+  A --> E
+  A --> F
+  state F {
+    Another
+  }
+  Another --> A
+
+
       

     
@@ -180,6 +206,12 @@ flowchart LR
 
       

+    
+      %%{init: {"layout": "elk", "mergeEdges": true} }%%
+flowchart
+      A --> B(This is B)
+      

     
       %%{init: {"layout": "elk", "mergeEdges": false, "elk.nodePlacement.strategy": "SIMPLE"} }%%
       stateDiagram
@@ -200,7 +232,7 @@ flowchart LR
     if_state --> True : if n >= 0
       

-    
+    
       %%{init: {"layout": "dagre", "mergeEdges": true} }%%
 stateDiagram
   direction TB
@@ -221,7 +253,7 @@ State T1 {
     }
       

-    
+    
       %%{init: {"layouts": "elk2", "mergeEdges": true} }%%
       stateDiagram
       State S1 {
@@ -231,7 +263,7 @@ State T1 {
   S1 --> S2
       

-    
+    
       %%{init: {"layout": "elk", "mergeEdges": true} }%%
 stateDiagram
 State T1 {
@@ -241,7 +273,7 @@ State T1 {
     }
       

-    
+    
       %%{init: {"layout": "elk", "mergeEdges": true} }%%
 stateDiagram
   [*] --> T1
diff --git a/packages/mermaid/src/config.type.ts b/packages/mermaid/src/config.type.ts
index be69ce455..afe636144 100644
--- a/packages/mermaid/src/config.type.ts
+++ b/packages/mermaid/src/config.type.ts
@@ -68,7 +68,7 @@ export interface MermaidConfig {
    * Defines which main look to use for the diagram.
    *
    */
-  look?: 'classic' | 'handdrawn' | 'slick';
+  look?: 'classic' | 'handdrawn';
   /**
    * Defines the seed to be used when using handdrawn look. This is important for the automated tests as they will always find differences without the seed. The default value is 0 which gives a random seed.
    *
diff --git a/packages/mermaid/src/diagrams/flowchart/flowDb.ts b/packages/mermaid/src/diagrams/flowchart/flowDb.ts
index 0faa5c048..b24fc8805 100644
--- a/packages/mermaid/src/diagrams/flowchart/flowDb.ts
+++ b/packages/mermaid/src/diagrams/flowchart/flowDb.ts
@@ -852,7 +852,7 @@ export const getData = () => {
 
   const n = getVertices();
   n.forEach((vertex) => {
-    const node = addNodeFromVertex(vertex, nodes, parentDB, subGraphDB, config, useRough);
+    const node = addNodeFromVertex(vertex, nodes, parentDB, subGraphDB, config, config.look);
   });
 
   const e = getEdges();
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts
index 1677ef8cf..eb25dc52a 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/trapezoid.ts
@@ -37,7 +37,7 @@ export const trapezoid = async (parent: SVGAElement, node: Node): Promise
-  (node.useRough ? 'rough-node' : 'node') + ' ' + node.cssClasses + ' ' + (extra || '');
+  (node.look === 'handdrawn' ? 'rough-node' : 'node') + ' ' + node.cssClasses + ' ' + (extra || '');
diff --git a/packages/mermaid/src/schemas/config.schema.yaml b/packages/mermaid/src/schemas/config.schema.yaml
index 381337f10..107a0e2ec 100644
--- a/packages/mermaid/src/schemas/config.schema.yaml
+++ b/packages/mermaid/src/schemas/config.schema.yaml
@@ -78,7 +78,6 @@ properties:
     enum:
       - classic
       - handdrawn
-      - slick
     default: 'classic'
   handdrawnSeed:
     description: |