Want to build a full stack in HTMX?
HTMX on Steroids.

func handleDocStream(w http.ResponseWriter, r *http.Request) {
    w.Header().Set("Content-Type", "text/event-stream")
    flusher, _ := w.(http.Flusher)

    patch := components.StreamPatch{
        TxID:    "tx_9841",
        Sub:     "agent_reviewer",
        Dom:     "doc_q4_plan",
        Target:  "blk_body_1",
        Op:      "set_attribute",
        Prop:    "data-reviewed-at",
        Val:     time.Now().Format(time.RFC3339),
        Inverse: "",
        TS:      time.Now().UnixMilli(),
    }

    data, _ := json.Marshal(patch)
    fmt.Fprintf(w, "event: hx-stream:patch\ndata: %s\n\n", data)
    flusher.Flush()
}

@app.get("/api/doc/stream")
async def stream_doc_patches():
    async def event_generator():
        while True:
            await asyncio.sleep(3)
            patch = {
                "txId": f"tx_{int(time.time()*1000)}",
                "sub": "agent_reviewer",
                "dom": "doc_q4_plan",
                "target": "blk_body_1",
                "op": "set_attribute",
                "prop": "data-reviewed-at",
                "val": time.strftime("%Y-%m-%dT%H:%M:%SZ", time.gmtime()),
                "ts": int(time.time() * 1000)
            }
            yield f"event: hx-stream:patch\ndata: {json.dumps(patch)}\n\n"

    return StreamingResponse(event_generator(), media_type="text/event-stream")

app.MapGet("/api/doc/stream", async (HttpContext ctx) =>
{
    ctx.Response.Headers.Append("Content-Type", "text/event-stream");
    var patch = new {
        txId = $"tx_{DateTimeOffset.UtcNow.ToUnixTimeMilliseconds()}",
        sub = "agent_reviewer",
        dom = "doc_q4_plan",
        target = "blk_body_1",
        op = "set_attribute",
        prop = "data-reviewed-at",
        val = DateTime.UtcNow.ToString("o")
    };
    await ctx.Response.WriteAsync($"event: hx-stream:patch\ndata: {JsonSerializer.Serialize(patch)}\n\n");
    await ctx.Response.Body.FlushAsync();
});

async fn stream_doc() -> Sse>> {
    let stream = stream::repeat_with(|| {
        let json = r#"{"target":"blk_body_1","op":"set_attribute","prop":"data-reviewed-at","val":"active"}"#;
        Event::default().event("hx-stream:patch").data(json)
    }).map(Ok).throttle(Duration::from_secs(3));

    Sse::new(stream).keep_alive(KeepAlive::default())
}

// Stream micro-delta: Δ:::
func streamMarketTicks(w http.ResponseWriter, r *http.Request) {
    w.Header().Set("Content-Type", "text/event-stream")
    flusher, _ := w.(http.Flusher)
    fmt.Fprintf(w, "event: hxMatrixUpdate\ndata: Δ0:1:$94250.00:bg-emerald-500/20\n\n")
    flusher.Flush()
}

@app.get("/api/matrix/stream")
async def stream_matrix():
    async def generate():
        while True:
            await asyncio.sleep(0.016) # 60 FPS
            yield f"event: hxMatrixUpdate\ndata: Δ0:1:$94250.00:bg-emerald-500/20\n\n"
    return StreamingResponse(generate(), media_type="text/event-stream")

app.MapGet("/api/matrix/stream", async (HttpContext ctx) => {
    ctx.Response.Headers.Append("Content-Type", "text/event-stream");
    await ctx.Response.WriteAsync("event: hxMatrixUpdate\ndata: Δ0:1:$94250.00:bg-emerald-500/20\n\n");
    await ctx.Response.Body.FlushAsync();
});

async fn stream_matrix() -> Sse>> {
    let stream = stream::repeat_with(|| {
        Event::default().event("hxMatrixUpdate").data("Δ0:1:$94250.00:bg-emerald-500/20")
    }).map(Ok).throttle(Duration::from_millis(16));
    Sse::new(stream).keep_alive(KeepAlive::default())
}

func RenderCanvas() components.Component {
    return components.Div("relative w-full h-96 bg-slate-950",
        components.HxLayer(0, "surface", "", components.Div("grid-bg")),
        components.HxLayer(1, "content", "", components.Div("card", components.Text("API Gateway"))),
        components.HxLayer(2, "manipulator", "", components.Div("handle")),
        components.HxLayer(9, "hud", "", components.Span("badge", components.Text("Online"))),
    )
}

@app.get("/components/canvas", response_class=HTMLResponse)
async def get_canvas():
    return """
    

      

      
API Gateway
      

      Online
    
    """

app.MapGet("/components/canvas", () => Results.Content("""
    

      

      
API Gateway
      

      Online
    
    """, "text/html"));

async fn get_canvas_fragment() -> axum::response::Html<&'static str> {
    axum::response::Html(r#"
    

      

      
Auth Gateway
      

      Online
    
    "#)
}