Mermaid

slackmark-node handles mermaid fences automatically. Here is a fence and the Slack message it produces:

```mermaid
flowchart LR
  Agent --> Review
  Review --> Slack
```

A flowchart fence, rasterized by the built-in MermaidRenderer. Recorded from a real slackmark-node run rather than produced live, so the picture is the renderer's own PNG.

Block Kit JSON

Chromium cannot run in a browser, so this figure replays a committed recording of a real createNodeConverter() run (slackmark-node with mermaid 11.16.0, Chromium via puppeteer 25.3.0). Regenerate it with pnpm docs:raster-examples. The picture is painted from PNG bytes committed to this repo (850×140, 7.5 kB, renderer bytes), substituted for the payload's image reference because a browser cannot fetch it. A capturing stub stood in for the Slack uploader, so the slack_file IDs below are synthetic; a real upload returns workspace file IDs. Nothing else was touched: the JSON below is what convert() returned.

[
  {
    "type": "image",
    "alt_text": "mermaid diagram",
    "slack_file": {
      "id": "F09DOCS0001"
    }
  }
]

Mermaid pie and xychart-beta prefer Slack's native chart block. Flowcharts, sequence diagrams, state diagrams, and other Mermaid forms use the built-in MermaidRenderer.

The renderer loads the pinned Mermaid browser bundle from installed package bytes and runs it under strict Mermaid security with a fixed edge limit. External URLs, files, workers, downloads, and WebSockets are all blocked, and it checks the dimensions before taking a PNG screenshot.

Rendering returns PNG bytes. During conversion those bytes are passed to the configured uploader. Without one, slackmark first lets later URL renderers recover, then throws a terminal ConfigurationError if no renderer succeeds.

A syntax error or a tripped render limit stays inside its own fence. The result keeps the original source as preformatted text and adds a structured degradation. Note what survives below: the prose around the broken fence is untouched, and the diagram source is still readable in Slack.

Deploy graph:

```mermaid
flowchart LR
  A --> --> B
```

Rollback is manual.

A syntax error in the fence. The rest of the message is unaffected. Recorded from a real slackmark-node run rather than produced live. This one produced no image, which is the point.

code.mermaid image.render → skip · Renderer failed
code.mermaid other → rich_text_preformatted · No native chart / renderer image; emitting mermaid source

Block Kit JSON · 2 degradations

This figure replays a committed recording of a real createNodeConverter() run. Regenerate it with pnpm docs:raster-examples. Nothing else was touched: the JSON below is what convert() returned.

[
  {
    "type": "rich_text",
    "elements": [
      {
        "type": "rich_text_section",
        "elements": [
          {
            "type": "text",
            "text": "Deploy graph:"
          }
        ]
      }
    ]
  },
  {
    "type": "rich_text",
    "elements": [
      {
        "type": "rich_text_preformatted",
        "elements": [
          {
            "type": "text",
            "text": "flowchart LR\n  A --> --> B"
          }
        ],
        "border": 0,
        "language": "mermaid"
      }
    ]
  },
  {
    "type": "rich_text",
    "elements": [
      {
        "type": "rich_text_section",
        "elements": [
          {
            "type": "text",
            "text": "Rollback is manual."
          }
        ]
      }
    ]
  }
]

For themes and limits, see Built-in renderers. For Chromium setup, see Production.