Code-fence formats

One registry, four very different jobs

remarkLfmCodeFences ships knowing no formats. Each handler below was registered explicitly. What they produce differs on purpose — some parse to a tree, one produces a URL, one hands a spec to a client renderer, one just claims the language.

JSON Schema parses to a tree · zero dependencies

The same shape as YANG: everything happens at build time, nothing ships to the browser. Local $refs expand inline with cycle detection.

schema: Participant
  +-- handle            string
  +-- name              string
  +-- kauffman_class?   integer | null
  +-- status?           enum  {"active", "alumni", "prospective"}
  +-- current_stack?*   array<$ref StackItem>
      +-- tool     string
      +-- notes?   string

Source

{
  "title": "Participant",
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "type": "object",
  "required": [
    "handle",
    "name"
  ],
  "properties": {
    "handle": {
      "type": "string"
    },
    "name": {
      "type": "string"
    },
    "kauffman_class": {
      "type": [
        "integer",
        "null"
      ]
    },
    "status": {
      "enum": [
        "active",
        "alumni",
        "prospective"
      ]
    },
    "current_stack": {
      "type": "array",
      "items": {
        "$ref": "#/$defs/StackItem"
      }
    }
  },
  "$defs": {
    "StackItem": {
      "type": "object",
      "required": [
        "tool"
      ],
      "properties": {
        "tool": {
          "type": "string"
        },
        "notes": {
          "type": "string",
          "description": "Why it earns its place."
        }
      }
    }
  }
}

PlantUML encodes to a URL · no renderer, no Java

The full UML surface Mermaid doesn't cover. The handler deflates the source and encodes it into a server URL, so the page is a plain <img> — no client JavaScript at all. Detected kind: sequence.

Rendered by the public plantuml.com server, which means the diagram source travels there in the URL. Self-host via createPlantUml({ server }) for anything private.

Source

participant Author
participant LFM
participant Renderer

Author -> LFM: ```plantuml fence
LFM -> LFM: deflate + base64
LFM --> Renderer: data.fence.svg
Renderer --> Author: <img src="...">

Vega-Lite parses the spec · client renders the chart

Parsing is free (it's JSON) and yields a summary the page can use for fallback and alt text — a chart that renders as nothing without JS should still say what it meant to draw.

mark: bar
channels: y, x, color
data: 4 inline rows

Source

{
  "title": "Tools by stack count",
  "data": {
    "values": [
      {
        "tool": "claude-code",
        "n": 12
      },
      {
        "tool": "cursor",
        "n": 7
      },
      {
        "tool": "windsurf",
        "n": 5
      },
      {
        "tool": "ghostty",
        "n": 4
      }
    ]
  },
  "mark": "bar",
  "encoding": {
    "y": {
      "field": "tool",
      "type": "nominal",
      "sort": "-x",
      "title": null
    },
    "x": {
      "field": "n",
      "type": "quantitative",
      "title": "stacks"
    },
    "color": {
      "field": "tool",
      "type": "nominal",
      "legend": null
    }
  }
}

Graphviz recognition only

DOT's whole value is the layout — the part that can't happen at parse time. So the handler claims the language and stops; a site renders it with @viz-js/viz (WASM, no server).

data.fence.format = graphviz, no parsed — exactly as intended.

Source

digraph fences {
  rankdir=LR;
  fence -> remarkLfmCodeFences -> handler -> "data.fence";
}