Painted in Scala

mermoid parses Mermaid flowchart, state, class, ER, and sequence diagrams and paints SVG in Scala, on the JVM and in the browser.

Class

A class diagram is types and the UML relations between them. Class diagrams is the reference.

MermoidAscent.svgDiagram(classes)
1 places *1 holds *CustomerOrderLineItem

ER

An ER diagram is entities and cardinality. The mark is a crow's foot. ER diagrams is the reference.

MermoidAscent.svgDiagram(orders)
placesCUSTOMERPK string nameORDERPK int idFK string customerId

Sequence

A sequence diagram is a timeline: participants are columns, messages are rows. Sequence diagrams is the reference.

MermoidAscent.svgDiagram(exchange)
place orderacceptedAliceBob

Flowchart

A flowchart ranks nodes and routes the edges. Flowcharts is the reference. State diagrams live on their own page.

MermoidAscent.svgDiagram(pipeline)
ParseLayoutSVG

Install

The coordinate is the release this site advertises.

libraryDependencies += "rocks.earlyeffect" %% "mermoid" % "0.2.0"
libraryDependencies += "rocks.earlyeffect" %% "mermoid-ascent" % "0.2.0"

Parse and paint

MermaidParser.parse reads the source. SvgRenderer.render paints the SVG string. Neither method is inline, so the panels below are those definitions.

mermoid.MermaidParser.parse
def parse(input: String): Either[ParseError, Diagram] =
    fastparse.parse(input, diagram(using _)) match
      case Parsed.Success(Diagram.Sequence(stmts), _) =>
        SequenceModel.resolve(stmts).map(Diagram.Sequence(_))
      case Parsed.Success(diagram: Diagram.StateDiagram, _) =>
        StateModel.resolve(diagram).map(_ => diagram)
      case Parsed.Success(diagram: Diagram.ClassDiagram, _) =>
        ClassModel.resolve(diagram).map(_ => diagram)
      case Parsed.Success(diagram: Diagram.ErDiagram, _) =>
        ErModel.resolve(diagram).map(_ => diagram)
      case Parsed.Success(value, _) => Right(value)
      case f: Parsed.Failure        => Left(ParseError.fromFastparse(f))

View source

mermoid.SvgRenderer.render
def render(
      diagram: Diagram,
      config: RenderConfig = RenderConfig(),
      viewport: Option[Viewport] = None,
  ): String =
    SvgSerializer.render(renderTree(diagram, config, viewport))

View source