Skip to content
FrontMark logo FrontMark Generator vfrontmark-clean-d77d3642f159 Very rich Markdown, easy to use.
Repository
About Getting Started Documentation Contact
Repository

Mermaid CSS tests

Test blocks

Section titled “Test blocks”

Test block1

Section titled “Test block1”
Super utilisateur 
apt update
apt install nginx
systemctl restart nginx

Test block2

Section titled “Test block2”
=== "app.py"

    ~~~ py title="app.py" linenums="1" hl_lines="4"
    from fastapi import FastAPI

    app = FastAPI()
    app.title = "Demo"
    ~~~

=== "config.yml"

    ~~~ yaml title="config.yml" linenums="1"
    site_name: Demo
    theme:
      name: material
    ~~~

=== "package.json"

    ~~~ { .json .no-copy title="package.json" }
    {
      "scripts": {
        "dev": "astro dev"
      }
    }
    ~~~
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"
site_name: Demo
theme:
  name: material
{
  "scripts": {
    "dev": "astro dev"
  }
}

Test block3

Section titled “Test block3”
app.py 
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"

Test block4

Section titled “Test block4”
app.py 
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"

Test block5

Section titled “Test block5”
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"

Test block6

Section titled “Test block6”
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"

Test block7

Section titled “Test block7”
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"

Test block8

Section titled “Test block8”
app.py 
from fastapi import FastAPI

app = FastAPI()
app.title = "Demo"

Mermaid CSS tests

Section titled “Mermaid CSS tests”

Imported from https://gitea.newkube.ia86.cc/sigMAX/Image_devsite at commit a3b56db.

This page gathers 20 Mermaid diagrams in one place to test FrontMark Mermaid CSS across sizes and diagram types.

Test 1

Section titled “Test 1”

Source: src/content/docs/concepts/agreements.md:59

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 60, "rankSpacing": 72, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:14px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:14px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Contract[/"Contract<br/>expected state"/]:::contract
    subgraph Effective["Effective state"]
      direction TB
      Artifacts["Generated<br/>artifacts"]:::deterministic
      Binary["Compiled<br/>WASM"]:::runtime
      Metadata["Build metadata<br/>hashes"]:::input
    end
    Agreement(["Agreement<br/>evidence record"]):::agreement
    Compare{"Compare"}:::agreement
    Decision["Accept<br/>or reject"]:::container
    Contract -->|"defines target"| Compare
    Artifacts -->|"record files"| Agreement
    Binary -->|"record binary"| Agreement
    Metadata -->|"record evidence"| Agreement
    Agreement -->|"effective result"| Compare
    Compare -->|"matches or drifts"| Decision
    Decision -->|"auditable outcome"| Agreement
    style Effective fill:#dcfce7,fill-opacity:0.34,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 2

Section titled “Test 2”

Source: src/content/docs/concepts/binary-model.md:37

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 48, "rankSpacing": 58, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:15px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:15px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart TB
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef llm fill:#e8f0ff,stroke:#2b6cb0,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Binary[/"Binary"/]:::contract
    Pseudo{{"Pseudo-code"}}:::llm
    CSubset["C subset build"]:::deterministic
    Wasm["WASM artifact"]:::wasm
    Validate{"Validate"}:::agreement
    Runtime[("Rust Runtime")]:::runtime
    Agreement(["Agreement"]):::agreement
    Reject["Reject"]:::container
    Binary -->|"guides"| Pseudo
    Pseudo -->|"translates"| CSubset
    CSubset -->|"compiles"| Wasm
    Binary -->|"ABI"| Validate
    Wasm -->|"checks"| Validate
    Validate -->|"accepted"| Runtime
    Validate -->|"drift"| Reject
    Validate -->|"records"| Agreement
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 3

Section titled “Test 3”

Source: src/content/docs/concepts/component-model.md:63

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 48, "rankSpacing": 58, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:15px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:15px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart TB
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    App[/"App Contract"/]:::contract
    Component[/"Component"/]:::contract
    Surface{{"Surface"}}:::deterministic
    Binary[/"Binary"/]:::contract
    Runtime[("Rust Runtime")]:::runtime
    Container[["Container"]]:::container
    Agreement(["Agreement"]):::agreement
    App -->|"declares"| Component
    Component -->|"surface"| Surface
    Component -->|"binary"| Binary
    Binary -->|"validates"| Runtime
    Surface -->|"publishes"| Container
    Runtime -->|"executes"| Container
    Container -->|"records"| Agreement
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 4

Section titled “Test 4”

Source: src/content/docs/concepts/contracts.md:38

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 58, "rankSpacing": 76, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:14px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:14px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart TB
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Intent(["Intent<br/>constraints"]):::input
    subgraph Expected["Expected state"]
      direction LR
      App[/"Application<br/>Contract"/]:::contract
      Component[/"Component<br/>Contract"/]:::contract
      Binary[/"Binary<br/>Contract"/]:::contract
    end
    subgraph Build["Generation and validation"]
      direction LR
      Pseudo["Controlled<br/>pseudo-code"]:::deterministic
      Wasm["WASM<br/>executable"]:::wasm
      Runtime[("Rust runtime")]:::runtime
    end
    Agreement(["Agreement<br/>effective state"]):::agreement
    Intent -->|"describes"| App
    App -->|"decomposes"| Component
    Component -->|"binds executable"| Binary
    Binary -->|"guides"| Pseudo
    Pseudo -->|"compiled by tooling"| Wasm
    Wasm -->|"loaded by"| Runtime
    Runtime -->|"produces evidence"| Agreement
    Binary -->|"expected ABI"| Agreement
    Component -->|"expected surface"| Agreement
    App -->|"expected topology"| Agreement
    style Expected fill:#dcfce7,fill-opacity:0.34,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style Build fill:#99f6e4,fill-opacity:0.34,stroke:#0d9488,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 5

Section titled “Test 5”

Source: src/content/docs/concepts/drift-detection.md:47

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 58, "rankSpacing": 76, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:14px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:14px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Contract[/"Contract<br/>expected state"/]:::contract
    Agreement(["Agreement<br/>effective state"]):::agreement
    subgraph Checks["Comparison checks"]
      direction LR
      Topology{"Topology"}:::agreement
      Capability{"Capability"}:::agreement
      Artifact{"Artifact"}:::agreement
    end
    Accepted["Accepted"]:::deterministic
    Drift["Drift detected"]:::container
    Action["Regenerate<br/>revise<br/>investigate"]:::input
    Contract -->|"expected"| Checks
    Agreement -->|"effective"| Checks
    Checks -->|"all match"| Accepted
    Checks -->|"mismatch"| Drift
    Drift -->|"requires action"| Action
    style Checks fill:#dcfce7,fill-opacity:0.34,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 6

Section titled “Test 6”

Source: src/content/docs/concepts/objectir-docir.md:54

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 58, "rankSpacing": 78, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:14px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:14px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Runtime[("Rust runtime<br/>host primitives")]:::runtime
    subgraph ObjectState["Business state"]
      direction TB
      ObjectIR[/"ObjectIR<br/>typed objects"/]:::contract
      CRepr["c_repr<br/>binary layout"]:::deterministic
    end
    subgraph DocumentState["Document state"]
      direction TB
      DocIR[/"DocIR<br/>renderable document"/]:::agreement
      Rendered[/"Markdown<br/>HTML<br/>PDF"/]:::input
    end
    Validation{"Validation"}:::agreement
    Runtime -->|"produces"| ObjectIR
    ObjectIR -->|"encodes for WASM"| CRepr
    CRepr -->|"decodes"| ObjectIR
    ObjectIR -->|"projects"| DocIR
    ObjectIR -->|"checks shape"| Validation
    DocIR -->|"checks document"| Validation
    DocIR -->|"renders"| Rendered
    Validation -->|"accepts or rejects"| Runtime
    style ObjectState fill:#dcfce7,fill-opacity:0.34,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style DocumentState fill:#99f6e4,fill-opacity:0.34,stroke:#0d9488,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 7

Section titled “Test 7”

Source: src/content/docs/concepts/primitives.md:49

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 54, "rankSpacing": 70, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:18px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:15px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:15px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    subgraph Sandbox["WASM sandbox"]
      direction LR
      Wasm["WASM module"]:::wasm
      Memory[("Linear memory")]:::deterministic
    end
    subgraph Abi["Host ABI"]
      direction LR
      Primitive[/"Primitive import"/]:::contract
      ErrorCode(["Stable error code"]):::agreement
    end
    subgraph HostRuntime["Runtime boundary"]
      direction LR
      Runtime[("Rust runtime")]:::runtime
      Policy{"Route capability policy"}:::agreement
      Host[["Host services<br/>state<br/>HTTP<br/>Dapr"]]:::container
    end
    Wasm -->|"Call"| Primitive
    Primitive -->|"validate pointers"| Memory
    Primitive -->|"enter host"| Runtime
    Runtime -->|"check"| Policy
    Policy -->|"allow or deny"| Host
    Host -->|"bounded result"| Runtime
    Runtime -->|"write memory"| Memory
    Runtime -->|"return"| ErrorCode
    ErrorCode -->|"status"| Wasm
    style Sandbox fill:#dcfce7,fill-opacity:0.34,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style Abi fill:#ede9fe,fill-opacity:0.34,stroke:#6b46c1,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style HostRuntime fill:#99f6e4,fill-opacity:0.32,stroke:#0d9488,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 8

Section titled “Test 8”

Source: src/content/docs/frontend/astro-svelte-vite.md:20

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 64, "rankSpacing": 72, "padding": 18}, "themeVariables": {"fontSize": "14px", "lineColor": "#f8fafc"}, "themeCSS": ".cluster-label p{font-size:15px!important;font-weight:900!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:4px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:16px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef llm fill:#e8f0ff,stroke:#2b6cb0,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:14px,font-weight:800;
    subgraph Source["Content source"]
        direction TB
        Markdown(["Markdown"]):::input
    end
    subgraph Framework["Site framework"]
        direction TB
        Astro{{"Astro"}}:::llm
        Starlight[/"Starlight"/]:::contract
    end
    subgraph Interactivity["Interactive islands"]
        direction TB
        Svelte["Svelte"]:::wasm
    end
    subgraph Tooling["Build toolchain"]
        direction TB
        Vite["Vite"]:::deterministic
    end
    subgraph Output["Delivery output"]
        direction TB
        Assets[["HTML · CSS · JS"]]:::container
        Nginx[("Nginx")]:::runtime
    end
    Markdown -->|"provides pages"| Astro
    Astro -->|"applies docs UI"| Starlight
    Astro -->|"mounts islands"| Svelte
    Vite -->|"serves dev mode"| Astro
    Vite -->|"bundles components"| Svelte
    Astro -->|"generates assets"| Assets
    Svelte -->|"adds behavior"| Assets
    Assets -->|"serves static output"| Nginx
    style Source fill:#b9f7ea,fill-opacity:0.58,stroke:#0891b2,stroke-width:2px,color:#000000
    style Framework fill:#a7f3d0,fill-opacity:0.54,stroke:#0f766e,stroke-width:2px,color:#000000
    style Interactivity fill:#ecfdf5,fill-opacity:0.52,stroke:#2f855a,stroke-width:2px,color:#000000
    style Tooling fill:#99f6e4,fill-opacity:0.52,stroke:#0d9488,stroke-width:2px,color:#000000
    style Output fill:#bae6fd,fill-opacity:0.56,stroke:#0284c7,stroke-width:2px,color:#000000
    linkStyle default stroke:#f8fafc,stroke-width:4px,color:#f8fafc

Test 9

Section titled “Test 9”

Source: src/content/docs/frontend/frontmark.md:61

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 62, "rankSpacing": 78, "padding": 18, "curve": "basis"}, "themeVariables": {"fontFamily": "Inter, ui-sans-serif, system-ui", "fontSize": "14px", "primaryTextColor": "#0f172a", "lineColor": "#dff7ff"}, "themeCSS": ".cluster-label p{font-size:15px!important;font-weight:900!important;letter-spacing:.01em!important}.flowchart-link{stroke:#dff7ff!important;stroke-width:3.5px!important;stroke-linecap:round!important;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}.marker{fill:#dff7ff!important;stroke:#dff7ff!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel p{color:#f8fafc!important;font-weight:800!important;text-shadow:0 1px 3px rgba(0,0,0,.9)!important}"}}%%
flowchart LR
  classDef source fill:#ecfeff,stroke:#0891b2,stroke-width:2px,color:#0f172a,font-weight:800;
  classDef frontmark fill:#dcfce7,stroke:#16a34a,stroke-width:3px,color:#052e16,font-weight:900;
  classDef surface fill:#eff6ff,stroke:#2563eb,stroke-width:2px,color:#172554,font-weight:800;
  classDef core fill:#fef3c7,stroke:#d97706,stroke-width:2px,color:#451a03,font-weight:800;
  classDef runtime fill:#f5f3ff,stroke:#7c3aed,stroke-width:2px,color:#2e1065,font-weight:800;
  subgraph Authoring["Authoring"]
    direction TB
    Markdown["Markdown source"]:::source
    Enrichment["FrontMark directives"]:::source
  end
  subgraph Layer["FrontMark layer"]
    direction TB
    Renderer{{"Renderer"}}:::frontmark
    Patterns["Callouts · tabs · diagrams · containers"]:::frontmark
  end
  subgraph Surfaces["Published surfaces"]
    direction TB
    Docs["Documentation pages"]:::surface
    Guides["Examples and guides"]:::surface
    LightUI["Lightweight frontend content"]:::surface
  end
  subgraph Sigmax["sigMAX core"]
    direction TB
    Contracts["Contracts"]:::core
    Agreements["Agreements"]:::core
    Runtime["Controlled runtime"]:::runtime
  end
  Markdown -->|"authored as text"| Renderer
  Enrichment -->|"adds structure"| Renderer
  Renderer -->|"renders"| Patterns
  Patterns --> Docs
  Patterns --> Guides
  Patterns --> LightUI
  Docs -. "explains" .-> Contracts
  Guides -. "illustrates" .-> Agreements
  LightUI -. "presents" .-> Runtime
  style Authoring fill:#0e7490,fill-opacity:.22,stroke:#67e8f9,stroke-width:2px,color:#f8fafc
  style Layer fill:#16a34a,fill-opacity:.20,stroke:#86efac,stroke-width:2px,color:#f8fafc
  style Surfaces fill:#2563eb,fill-opacity:.18,stroke:#93c5fd,stroke-width:2px,color:#f8fafc
  style Sigmax fill:#7c2d12,fill-opacity:.18,stroke:#fbbf24,stroke-width:2px,color:#f8fafc

Test 10

Section titled “Test 10”

Source: src/content/docs/generation/overview.md:18

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 78, "rankSpacing": 92, "padding": 22}, "themeVariables": {"fontSize": "14px", "lineColor": "#f8fafc"}, "themeCSS": ".cluster-label p{font-size:16px!important;font-weight:900!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:4px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:17px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart TB
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef llm fill:#e8f0ff,stroke:#2b6cb0,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:14px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:14px,font-weight:800;
    subgraph S0["Inputs"]
        direction TB
        Intent(["Intent"]):::input
        Constraints(["Constraints"]):::input
    end
    subgraph S1["LLM-controlled generation"]
        direction TB
        Blueprint{{"Blueprint"}}:::llm
        AppContract[/"App Contract"/]:::contract
        ComponentA[/"Component A"/]:::contract
        ComponentB[/"Component B"/]:::contract
        ComponentN[/"Component N"/]:::contract
        BinaryA1[/"Binary A1"/]:::contract
        BinaryA2[/"Binary A2"/]:::contract
        BinaryB1[/"Binary B1"/]:::contract
        PseudoA1["Pseudo A1"]:::llm
        PseudoA2["Pseudo A2"]:::llm
        PseudoB1["Pseudo B1"]:::llm
    end
    subgraph S2["Deterministic generation"]
        direction TB
        Stack["App stack"]:::deterministic
        CSubsetA1["C subset A1"]:::deterministic
        CSubsetA2["C subset A2"]:::deterministic
        CSubsetB1["C subset B1"]:::deterministic
        WasmA1["WASM A1"]:::wasm
        WasmA2["WASM A2"]:::wasm
        WasmB1["WASM B1"]:::wasm
    end
    subgraph S3["Component packaging"]
        direction TB
        ContainerA[["Container A<br/>runtime<br/>contracts<br/>agreements"]]:::container
        ContainerB[["Container B<br/>runtime<br/>contracts<br/>agreements"]]:::container
        ContainerC[["Container C<br/>runtime<br/>contracts<br/>agreements"]]:::container
    end
    subgraph S4["Controlled execution"]
        direction TB
        Runtime[("sigMAX Runtime")]:::runtime
    end
    Intent -->|"describes"| Blueprint
    Constraints -->|"constrain"| Blueprint
    Blueprint -->|"drafts"| AppContract
    AppContract -->|"declares compose stack"| Stack
    AppContract -->|"decomposes"| ComponentA
    AppContract -->|"decomposes"| ComponentB
    AppContract -->|"extends"| ComponentN
    ComponentA -->|"defines"| BinaryA1
    ComponentA -->|"defines"| BinaryA2
    ComponentB -->|"defines"| BinaryB1
    BinaryA1 -->|"guides"| PseudoA1
    BinaryA2 -->|"guides"| PseudoA2
    BinaryB1 -->|"guides"| PseudoB1
    PseudoA1 -->|"compiles"| CSubsetA1
    PseudoA2 -->|"compiles"| CSubsetA2
    PseudoB1 -->|"compiles"| CSubsetB1
    CSubsetA1 -->|"clang wasm32"| WasmA1
    CSubsetA2 -->|"clang wasm32"| WasmA2
    CSubsetB1 -->|"clang wasm32"| WasmB1
    ComponentA -->|"packages"| ContainerA
    ComponentB -->|"packages"| ContainerB
    ComponentN -->|"packages"| ContainerC
    WasmA1 -->|"embeds"| ContainerA
    WasmA2 -->|"embeds"| ContainerA
    WasmB1 -->|"embeds"| ContainerB
    Stack -->|"orchestrates"| ContainerA
    Stack -->|"orchestrates"| ContainerB
    Stack -->|"orchestrates"| ContainerC
    ContainerA -->|"loads"| Runtime
    ContainerB -->|"loads"| Runtime
    ContainerC -->|"loads"| Runtime
    Blueprint -. "iteration" .-> Intent
    style S0 fill:#b9f7ea,fill-opacity:0.58,stroke:#0891b2,stroke-width:2px,color:#000000
    style S1 fill:#a7f3d0,fill-opacity:0.54,stroke:#0f766e,stroke-width:2px,color:#000000
    style S2 fill:#99f6e4,fill-opacity:0.52,stroke:#0d9488,stroke-width:2px,color:#000000
    style S3 fill:#fee2e2,fill-opacity:0.46,stroke:#c53030,stroke-width:2px,color:#000000
    style S4 fill:#bae6fd,fill-opacity:0.56,stroke:#0284c7,stroke-width:2px,color:#000000
    linkStyle default stroke:#f8fafc,stroke-width:4px,color:#f8fafc

Test 11

Section titled “Test 11”

Source: src/content/docs/index.md:53

quadrantChart
    title Architecture models: simplicity vs maintainability
    x-axis Low maintainability --> High maintainability
    y-axis Low simplicity --> High simplicity
    quadrant-1 Simple and maintainable
    quadrant-2 Simple but limited
    quadrant-3 Complex and fragile
    quadrant-4 Maintainable & advanced
    Monolith: [0.25, 0.84]
    Modular: [0.58, 0.76]
    N-tier: [0.48, 0.62]
    SOA: [0.62, 0.46]
    Microservices: [0.70, 0.34]
    Event-driven: [0.84, 0.26]
    Hexagonal: [0.78, 0.40]
    Serverless: [0.66, 0.42]
    sigMAX: [0.86, 0.58]

Test 12

Section titled “Test 12”

Source: src/content/docs/index.md:170

flowchart LR
    classDef bad fill:#fee2e2,stroke:#dc2626,stroke-width:2px,color:#450a0a;
    classDef good fill:#e0f2fe,stroke:#0284c7,stroke-width:2px,color:#082f49;
    classDef sigmax fill:#e6fffa,stroke:#0f766e,stroke-width:3px,color:#042f2e;
    A["Microservices-first<br/>split by deployment"]:::bad
    B["Many services<br/>unclear contracts<br/>operational complexity"]:::bad
    C["Hexagonal-first<br/>split by domain boundary"]:::good
    D["Ports, adapters<br/>contracts<br/>testable components"]:::good
    S["sigMAX<br/>contract-first components<br/>WASM runtime<br/>agreements"]:::sigmax
    A --> B
    C --> D
    D --> S

Test 13

Section titled “Test 13”

Source: src/content/docs/index.md:340

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 70, "rankSpacing": 90, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc"}, "themeCSS": ".flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:13px!important;font-weight:700!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart TD
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111;
    classDef llm fill:#e8f0ff,stroke:#2b6cb0,stroke-width:2px,color:#111;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111;
    AppContract[/"Application Contract"/]:::contract
    ComponentContract[/"Component Contract"/]:::contract
    Ports["Ports and capabilities"]:::input
    Adapters["Adapters<br/>REST · Storage · Dapr"]:::container
    Wasm["WASM business binaries"]:::wasm
    Runtime[("sigMAX Runtime")]:::runtime
    Validation{"Agreement validation"}:::agreement
    AppContract -->|"defines components"| ComponentContract
    ComponentContract -->|"declares boundaries"| Ports
    Ports -->|"generates adapters"| Adapters
    Ports -->|"generates binaries"| Wasm
    Adapters -->|"connects host work"| Runtime
    Wasm -->|"executes logic"| Runtime
    Runtime -->|"produces evidence"| Validation
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 14

Section titled “Test 14”

Source: src/content/docs/runtime/dapr.md:30

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 82, "rankSpacing": 92, "padding": 22}, "themeVariables": {"fontSize": "13px", "lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.20)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;fill:#020617!important;color:#020617!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:4px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:16px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    External(["Exterieur"]):::input
    RuntimeRust[("Runtime Rust<br/>WASM host<br/>component orchestration")]:::runtime
    subgraph Host["Hote"]
      direction TB
      subgraph Docker["Docker"]
        direction LR
        subgraph Encoder["encodeur"]
          direction LR
          EncoderApp[/"sigmax-encodeur<br/>localhost/sigmax-encodeur:0.0<br/>Up 3 days healthy"/]:::wasm
          EncoderDapr["sigmax-encodeur-dapr<br/>daprio/daprd:1.17.9<br/>Up 3 days"]:::contract
        end
        subgraph Metier["metier"]
          direction LR
          MetierDapr["sigmax-metier-dapr<br/>daprio/daprd:1.17.9<br/>Up 3 days"]:::contract
          MetierApp[/"sigmax-metier<br/>localhost/sigmax-metier:0.0<br/>Up 3 days healthy"/]:::wasm
        end
        subgraph Storage["storage"]
          direction LR
          StorageDapr["sigmax-storage-dapr<br/>daprio/daprd:1.17.9<br/>Up 3 days"]:::contract
          StorageApp[/"sigmax-storage<br/>storage-service:0.1.0<br/>Up 3 days healthy"/]:::wasm
          Postgres[("postgres<br/>docker.io/postgres:16<br/>Up 3 days healthy")]:::runtime
        end
      end
    end
    External -->|"request"| RuntimeRust
    RuntimeRust -->|"routes 8080"| EncoderApp
    RuntimeRust -->|"routes 8081"| MetierApp
    RuntimeRust -->|"routes 8090"| StorageApp
    EncoderApp -->|"Call"| EncoderDapr
    MetierApp -->|"Call"| MetierDapr
    EncoderDapr <-->|"Dapr 3500"| MetierDapr
    MetierDapr <-->|"Dapr 3500"| StorageDapr
    EncoderDapr -. "depends_on" .-> EncoderApp
    MetierDapr -. "depends_on" .-> MetierApp
    StorageDapr -. "depends_on" .-> StorageApp
    StorageApp -. "depends_on" .-> Postgres
    style Host fill:#bae6fd,fill-opacity:0.16,stroke:#0284c7,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style Docker fill:#f7fafc,fill-opacity:0.20,stroke:#cbd5e1,stroke-width:3px,color:#020617
    style Encoder fill:#dcfce7,fill-opacity:0.50,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style Metier fill:#dcfce7,fill-opacity:0.50,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style Storage fill:#99f6e4,fill-opacity:0.50,stroke:#0d9488,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:4px,color:#f8fafc

Test 15

Section titled “Test 15”

Source: src/content/docs/runtime/observability.md:69

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 54, "rankSpacing": 70, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:14px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:14px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Runtime[("sigMAX runtime")]:::runtime
    subgraph Core["sigMAX Core"]
      direction TB
      Podman["podman logs"]:::input
    end
    subgraph Enterprise["sigMAX Enterprise"]
      direction TB
      Loki[("Loki<br/>logs")]:::agreement
      Thanos[("Thanos<br/>metrics")]:::deterministic
      Zipkin{{"Zipkin<br/>trace UI"}}:::contract
      Grafana["Grafana<br/>dashboards"]:::container
    end
    Runtime -->|"writes logs"| Podman
    Runtime -->|"ships logs"| Loki
    Runtime -->|"exports metrics"| Thanos
    Runtime -->|"emits traces"| Zipkin
    Loki -->|"query logs"| Grafana
    Thanos -->|"query metrics"| Grafana
    style Core fill:#dcfce7,fill-opacity:0.34,stroke:#2f855a,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    style Enterprise fill:#99f6e4,fill-opacity:0.34,stroke:#0d9488,stroke-width:3px,stroke-dasharray:8 6,color:#020617
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 16

Section titled “Test 16”

Source: src/content/docs/runtime/storage-service.md:70

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 52, "rankSpacing": 64, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc", "clusterBkg": "rgba(15, 23, 42, 0.14)", "clusterBorder": "#38bdf8"}, "themeCSS": ".cluster rect{rx:0!important;ry:0!important}.cluster-label p{font-size:16px!important;font-weight:900!important;letter-spacing:0!important;color:#020617!important}.nodeLabel p{font-size:15px!important;font-weight:850!important;line-height:1.15!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:15px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart TB
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:13px,font-weight:800;
    Contract[/"Storage<br/>Contract"/]:::contract
    Config[/"storage.yaml"/]:::input
    Wasm["WASM<br/>module"]:::wasm
    Runtime[("Rust<br/>runtime")]:::runtime
    Primitive[/"Storage<br/>primitive"/]:::contract
    Service[["Storage<br/>service"]]:::container
    Database[("Postgres<br/>local store")]:::runtime
    Agreement(["Storage<br/>Agreement"]):::agreement
    Contract -->|"declares"| Config
    Config -->|"allows"| Runtime
    Wasm -->|"calls"| Primitive
    Primitive -->|"checks policy"| Runtime
    Runtime -->|"generic op"| Service
    Service -->|"persists"| Database
    Service -->|"records"| Agreement
    Config -->|"expected"| Agreement
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 17

Section titled “Test 17”

Source: src/content/docs/runtime/wasm-sandbox.md:50

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 70, "rankSpacing": 90, "padding": 18}, "themeVariables": {"lineColor": "#f8fafc"}, "themeCSS": ".flowchart-link{stroke:#f8fafc!important;stroke-width:5px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:13px!important;font-weight:700!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111;
    classDef llm fill:#e8f0ff,stroke:#2b6cb0,stroke-width:2px,color:#111;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111;
    Contract[/"Binary Contract"/]:::contract
    Agreement(["Effective Agreement"]):::agreement
    Runtime[("Rust<br/>runtime")]:::runtime
    Wasm["WASM<br/>module"]:::wasm
    Memory[("Linear<br/>memory")]:::deterministic
    Imports["Runtime primitives<br/>explicit imports"]:::input
    Policy{"Capability<br/>policy"}:::agreement
    Host["Host services<br/>state · HTTP · secrets · logs · metrics"]:::container
    Contract -->|"declares limits"| Runtime
    Agreement -->|"confirms state"| Runtime
    Runtime -->|"loads entrypoint"| Wasm
    Runtime -->|"exposes imports"| Imports
    Wasm -->|"reads · writes"| Memory
    Wasm -->|"calls import"| Imports
    Imports -->|"validates buffer"| Memory
    Imports -->|"checks capability"| Policy
    Policy -->|"allows · denies"| Runtime
    Runtime -->|"approved work"| Host
    Host -->|"bounded result"| Runtime
    linkStyle default stroke:#f8fafc,stroke-width:5px,color:#f8fafc

Test 18

Section titled “Test 18”

Source: src/content/docs/sigmax.md:70

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 44, "rankSpacing": 72, "padding": 14}, "themeVariables": {"fontSize": "16px", "lineColor": "#f8fafc"}, "themeCSS": ".cluster-label p{font-size:16px!important;font-weight:900!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:4px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:14px!important;font-weight:850!important;line-height:1.08!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef llm fill:#e8f0ff,stroke:#2b6cb0,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef deterministic fill:#e6fffa,stroke:#2c7a7b,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:16px,font-weight:800;
    classDef agreement fill:#f0f9ff,stroke:#0369a1,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    classDef validation fill:#fee2e2,stroke:#dc2626,stroke-width:2px,color:#111,font-size:16px,font-weight:800;
    subgraph S0["Inputs"]
        direction TB
        Intent(["User intent"]):::input
        Constraints(["Constraints"]):::input
    end
    subgraph S1["LLM-controlled generation"]
        direction TB
        Blueprint{{"Application Blueprint"}}:::llm
        AppContract[/"Application Contract"/]:::contract
        ComponentContract[/"Component Contracts"/]:::contract
        BinaryContract[/"Binary Contracts"/]:::contract
        Pseudo["Pseudo-code DSL"]:::llm
    end
    subgraph S2["Deterministic generation"]
        direction TB
        CSubset["C/WASM generation"]:::deterministic
        Wasm["WASM executables"]:::wasm
    end
    subgraph S3["Runtime and proof"]
        direction TB
        Runtime[("sigMAX Runtime")]:::runtime
        Agreements(["Agreements"]):::agreement
        Validation{"Agreement validation"}:::validation
    end
    Intent -->|"describes"| Blueprint
    Constraints -->|"constrain"| Blueprint
    Blueprint -->|"drafts"| AppContract
    AppContract -->|"decomposes"| ComponentContract
    ComponentContract -->|"defines"| BinaryContract
    BinaryContract -->|"guides"| Pseudo
    Pseudo -->|"compiles"| CSubset
    CSubset -->|"emits"| Wasm
    Wasm -->|"loads"| Runtime
    Runtime -->|"records"| Agreements
    Agreements -->|"proves"| Validation
    BinaryContract -. "expected state" .-> Validation
    style S0 fill:#b9f7ea,fill-opacity:0.58,stroke:#0891b2,stroke-width:2px,color:#000000
    style S1 fill:#a7f3d0,fill-opacity:0.54,stroke:#0f766e,stroke-width:2px,color:#000000
    style S2 fill:#99f6e4,fill-opacity:0.52,stroke:#0d9488,stroke-width:2px,color:#000000
    style S3 fill:#bae6fd,fill-opacity:0.56,stroke:#0284c7,stroke-width:2px,color:#000000
    linkStyle default stroke:#f8fafc,stroke-width:4px,color:#f8fafc

Test 19

Section titled “Test 19”

Source: src/content/docs/sigmax.md:156

%%{init: {"theme": "base", "flowchart": {"nodeSpacing": 56, "rankSpacing": 72, "padding": 14}, "themeVariables": {"fontSize": "13px", "lineColor": "#f8fafc"}, "themeCSS": ".cluster-label p{font-size:14px!important;font-weight:850!important}.flowchart-link{stroke:#f8fafc!important;stroke-width:4px!important;stroke-linecap:round!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.65))}.marker{fill:#f8fafc!important;stroke:#f8fafc!important}.edgeLabel,.labelBkg,.edgeLabel span{background:transparent!important}.edgeLabel rect{fill:transparent!important;stroke:transparent!important}.edgeLabel p,.edgeLabel .labelBkg p,.edgeLabel span p{background:transparent!important;color:#f8fafc!important;padding:0!important;font-size:18px!important;font-weight:850!important;line-height:1.15!important;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.85)!important}"}}%%
flowchart LR
    classDef input fill:#fff4cc,stroke:#b7791f,stroke-width:2px,color:#111,font-size:13px,font-weight:750;
    classDef contract fill:#ede9fe,stroke:#6b46c1,stroke-width:2px,color:#111,font-size:13px,font-weight:750;
    classDef container fill:#fef2f2,stroke:#c53030,stroke-width:2px,color:#111,font-size:13px,font-weight:750;
    classDef wasm fill:#ecfdf5,stroke:#2f855a,stroke-width:2px,color:#111,font-size:13px,font-weight:750;
    classDef runtime fill:#f7fafc,stroke:#2d3748,stroke-width:3px,color:#111,font-size:13px,font-weight:750;
    subgraph Container["Standardized component container"]
        direction LR
        Edge[/"HTTP OpenAPI"/]:::contract
        Runtime[("Rust runtime")]:::runtime
        subgraph WasmComponents["WASM components"]
            direction TB
            W1["Business"]:::wasm
            W2["Document"]:::wasm
            W3["Object"]:::wasm
        end
        Primitives["Runtime primitives<br/>storage · logs · JSON"]:::input
    end
    Edge -->|"routes requests"| Runtime
    Runtime -->|"loads"| W1
    Runtime -->|"loads"| W2
    Runtime -->|"loads"| W3
    W1 -->|"calls imports"| Primitives
    W2 -->|"calls imports"| Primitives
    W3 -->|"calls imports"| Primitives
    style Container fill:#fef2f2,fill-opacity:0.58,stroke:#c53030,stroke-width:2px,color:#111
    style WasmComponents fill:#ecfdf5,fill-opacity:0.52,stroke:#2f855a,stroke-width:2px,color:#111
    linkStyle default stroke:#f8fafc,stroke-width:4px,color:#f8fafc
Back to top