diff --git a/packages/mermaid/src/rendering-util/rendering-elements/nodes.js b/packages/mermaid/src/rendering-util/rendering-elements/nodes.js index b2132e8f48..44d0668778 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/nodes.js +++ b/packages/mermaid/src/rendering-util/rendering-elements/nodes.js @@ -31,7 +31,7 @@ import { halfRoundedRectangle } from './shapes/halfRoundedRectangle.js'; import { curvedTrapezoid } from './shapes/curvedTrapezoid.js'; import { slopedRect } from './shapes/slopedRect.js'; import { bowTieRect } from './shapes/bowTieRect.js'; -import { dividedRect } from './shapes/dividedRect.js'; +import { dividedRectangle } from './shapes/dividedRect.js'; import { crossedCircle } from './shapes/crossedCircle.js'; import { waveRectangle } from './shapes/waveRectangle.js'; import { tiltedCylinder } from './shapes/tiltedCylinder.js'; @@ -48,57 +48,175 @@ import { multiWaveEdgedRectangle } from './shapes/multiWaveEdgedRectangle.js'; import { windowPane } from './shapes/windowPane.js'; import { linedWaveEdgedRect } from './shapes/linedWaveEdgedRect.js'; import { taggedWaveEdgedRectangle } from './shapes/taggedWaveEdgedRectangle.js'; +import { curlyBraces } from './shapes/curlyBraces.js'; +//Use these names as the left side to render shapes. const shapes = { + // States state, stateStart, + 'small-circle': stateStart, + 'sm-circ': stateStart, + start: stateStart, stateEnd, - fork: forkJoin, - join: forkJoin, - choice, - note, - roundedRect, + 'framed-circle': stateEnd, + stop: stateEnd, + + // Rectangles rectWithTitle, + rect: rectWithTitle, + process: rectWithTitle, + proc: rectWithTitle, + roundedRect, + rounded: roundedRect, + event: roundedRect, squareRect, stadium, + pill: stadium, + term: stadium, + windowPane, + 'win-pane': windowPane, + 'internal-storage': windowPane, + dividedRectangle, + 'divided-rectangle': dividedRectangle, + 'div-rect': dividedRectangle, + 'div-proc': dividedRectangle, + taggedRect, + 'tagged-rect': taggedRect, + 'tag-rect': taggedRect, + 'tag-proc': taggedRect, + multiRect, + 'multi-rect': multiRect, + 'mul-rect': multiRect, + 'mul-proc': multiRect, + + // Subroutine subroutine, + 'framed-rectangle': subroutine, + fr: subroutine, + subproc: subroutine, + + // Cylinders cylinder, + cyl: cylinder, + db: cylinder, + tiltedCylinder, + 'tilted-cylinder': tiltedCylinder, + 't-cyl': tiltedCylinder, + das: tiltedCylinder, + linedCylinder, + 'lined-cylinder': linedCylinder, + 'l-cyl': linedCylinder, + disk: linedCylinder, + + // Circles circle, doublecircle, - odd: rect_left_inv_arrow, - diamond: question, - hexagon, - lean_right, - lean_left, + dc: doublecircle, + crossedCircle, + 'crossed-circ': crossedCircle, + 'cross-circ': crossedCircle, + summary: crossedCircle, + filledCircle, + 'filled-circle': filledCircle, + fc: filledCircle, + junction: filledCircle, + shadedProcess, + 'lined-proc': shadedProcess, + 'lined-rect': shadedProcess, + + // Trapezoids trapezoid, + trapezoidBaseBottom: trapezoid, + 'trapezoid-bottom': trapezoid, + 'trap-b': trapezoid, + priority: trapezoid, inv_trapezoid, - labelRect, - text, - card, - shadedProcess, - anchor, - triangle, - halfRoundedRectangle, + 'trapezoid-top': inv_trapezoid, + 'trap-t': inv_trapezoid, + manual: inv_trapezoid, curvedTrapezoid, - slopedRect, - bowTieRect, - dividedRect, - crossedCircle, - waveRectangle, - tiltedCylinder, - trapezoidalPentagon, + 'curved-trapezoid': curvedTrapezoid, + 'cur-trap': curvedTrapezoid, + disp: curvedTrapezoid, + + // Hexagons & Misc Geometric + hexagon, + hex: hexagon, + prepare: hexagon, + triangle, + 'small-triangle': triangle, + 'sm-tri': triangle, + extract: triangle, flippedTriangle, - hourglass, - taggedRect, - multiRect, - linedCylinder, + 'flipped-triangle': flippedTriangle, + 'flip-tria': flippedTriangle, + 'manual-file': flippedTriangle, + trapezoidalPentagon, + 'notched-pentagon': trapezoidalPentagon, + 'not-pen': trapezoidalPentagon, + 'loop-limit': trapezoidalPentagon, + + //wave Edged Rectangles + waveRectangle, + 'wave-rectangle': waveRectangle, + 'w-rect': waveRectangle, + flag: waveRectangle, + 'paper-tape': waveRectangle, waveEdgedRectangle, - lightningBolt, - filledCircle, + 'wave-rect': waveEdgedRectangle, + 'we-rect': waveEdgedRectangle, + doc: waveEdgedRectangle, multiWaveEdgedRectangle, - windowPane, + 'multi-wave-edged-rectangle': multiWaveEdgedRectangle, + 'mul-we-rect': multiWaveEdgedRectangle, + 'mul-doc': multiWaveEdgedRectangle, linedWaveEdgedRect, + 'lined-wave-edged-rect': linedWaveEdgedRect, + 'lin-we-rect': linedWaveEdgedRect, + 'lin-doc': linedWaveEdgedRect, taggedWaveEdgedRectangle, + 'tagged-wave-edged-rect': taggedWaveEdgedRectangle, + 'tag-we-rect': taggedWaveEdgedRectangle, + + // Custom Rectangles + bowTieRect, + 'bow-tie-rect': bowTieRect, + 'bt-rect': bowTieRect, + 'stored-data': bowTieRect, + slopedRect, + 'sloped-rectangle': slopedRect, + 'sloped-rect': slopedRect, + 'manual-input': slopedRect, + halfRoundedRectangle, + 'half-rounded-rect': halfRoundedRectangle, + delay: halfRoundedRectangle, + card, + 'notched-rect': card, + 'notch-rect': card, + lean_right, + 'l-r': lean_right, + 'in-out': lean_right, + lean_left, + 'l-l': lean_left, + 'out-in': lean_left, + + // Miscellaneous + forkJoin, + fork: forkJoin, + join: forkJoin, + choice, + note, + text, + anchor, + diamond: question, + lightningBolt, + bolt: lightningBolt, + 'com-link': lightningBolt, + curlyBraces, + hourglass, + odd: rect_left_inv_arrow, + labelRect, }; const nodeElems = new Map(); diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/dividedRect.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/dividedRect.ts index b1ce5a2b25..8f66eb15e5 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/dividedRect.ts +++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/dividedRect.ts @@ -7,7 +7,7 @@ import { } from '$root/rendering-util/rendering-elements/shapes/handDrawnShapeStyles.js'; import rough from 'roughjs'; -export const dividedRect = async (parent: SVGAElement, node: Node) => { +export const dividedRectangle = async (parent: SVGAElement, node: Node) => { const { labelStyles, nodeStyles } = styles2String(node); node.labelStyle = labelStyles; const { shapeSvg, bbox, label } = await labelHelper(parent, node, getNodeClasses(node));