Mermaid Diagram Delivery Kit

Validate one bounded Mermaid flowchart and generate accessible SVG plus optional PNG entirely in the browser with actual-byte integrity receipts.

Developers preparing safe local diagram deliverables without uploading source or accepting hosted rendering claims.

Local delivery result

Build-time verified hosted sample

{
  "ok": true,
  "schema_version": "utilito.product-kit.v1",
  "kit": {
    "id": "mermaid-diagram-delivery-kit",
    "version": "1.0.0"
  },
  "result": {
    "status": "validation_plan_only",
    "generated": false,
    "browser_generation_required": true,
    "source_echoed": false,
    "validation": {
      "validator": "utilito-mermaid-preflight-v1",
      "diagram_type": "flowchart",
      "source_bytes": 68,
      "lines": 3,
      "nodes": 3,
      "edges": 2
    },
    "requested": {
      "theme": "dark",
      "width": 800,
      "height": 450,
      "background": "#020617",
      "title_present": true,
      "description_present": true,
      "alt_text_present": true,
      "outputs": [
        "png",
        "svg"
      ]
    },
    "deliverables": [
      {
        "format": "png",
        "mime_type": "image/png",
        "filename": "mermaid-diagram.png",
        "generated": false,
        "bytes": null,
        "width": null,
        "height": null,
        "sha256": null,
        "reopen_verified": false
      },
      {
        "format": "svg",
        "mime_type": "image/svg+xml",
        "filename": "mermaid-diagram.svg",
        "generated": false,
        "bytes": null,
        "width": null,
        "height": null,
        "sha256": null,
        "reopen_verified": false
      }
    ],
    "limitations": [
      "Hosted direct, API, and MCP output is a deterministic validation plan only.",
      "Actual bytes, dimensions, digests, decode checks, previews, and downloads exist only after browser-local generation.",
      "Submitted Mermaid labels can contain secrets and necessarily appear in generated local SVG and PNG pixels; review before sharing."
    ]
  },
  "receipt": {
    "input_bytes": 391,
    "output_bytes": 1653,
    "complete_bytes": 1653,
    "source_bytes": 68,
    "nodes": 3,
    "edges": 2,
    "operations": 1,
    "omitted_items": 0,
    "warnings": []
  },
  "provenance": {
    "deterministic": true,
    "model_used": false,
    "network_used": false,
    "storage_used": false,
    "browser_bytes_generated": false,
    "core_versions": {
      "mermaid_diagram_delivery_kit": "1.0.0",
      "mermaid_validation": "utilito-mermaid-preflight-v1"
    }
  },
  "error": null
}

Boundary and limitations

Hosted direct, API, and MCP return a validation plan only: never rendered bytes, actual dimensions, hashes, decode results, reopen proof, previews, or downloads.

Only the bounded simple flowchart subset is accepted. Scripts, unsafe HTML labels, event attributes, click/link directives, arbitrary URLs, directives, config, and frontmatter fail closed.

Caller-authored title and description are escaped into the SVG and referenced with aria-labelledby. Alt text is retained for the local preview and receipt; this is not a broad accessibility conformance claim.

Source may contain secrets. Hosted failures and metadata do not echo it, but validated labels necessarily appear in generated SVG and PNG pixels. Review files before sharing.