DRYL — Code Block

Data

DrylCodeBlock

AI-aware

A glass code surface with a language label and a copy-to-clipboard button — the natural home for code emitted by a model. Code is syntax-highlighted server-side by a dependency-free C# tokenizer (no JS) and HTML-encoded, so it is safe against injection.

View source

Basic

csharp

public sealed record Person(string Name, int Age)
{
    public bool IsAdult => Age >= 18;
}

With line numbers

json

{
  "tool": "get_weather",
  "arguments": { "city": "Berlin", "unit": "celsius" }
}

Languages

typescript

// Stream a chat completion
async function* chat(prompt: string): AsyncGenerator<string> {
    const res = await fetch("/api/chat", { method: "POST", body: prompt });
    const reader = res.body!.getReader();
    for (let n = 0; n < 100; n++) {
        const { value, done } = await reader.read();
        if (done) break;
        yield new TextDecoder().decode(value);
    }
}

python

# Filter adults from a list of people
from dataclasses import dataclass

@dataclass
class Person:
    name: str
    age: int

def adults(people: list[Person]) -> list[Person]:
    return [p for p in people if p.age >= 18]

sql

-- Top 5 customers by revenue
SELECT c.name, SUM(o.total) AS revenue
FROM customers c
JOIN orders o ON o.customer_id = c.id
WHERE o.created_at >= '2026-01-01'
GROUP BY c.name
ORDER BY revenue DESC
LIMIT 5;

html

<!-- A glass card -->
<article class="glass-card" data-id="42">
    <h2>Hello &amp; welcome</h2>
    <a href="/docs">Read the docs</a>
</article>

css

/* Accent button */
.btn-primary {
    background: var(--accent-grad);
    border-radius: var(--r-md);
    padding: 8px 16px;
    transition: box-shadow 240ms ease;
}

Highlighting off

Set Highlight="false" to render verbatim plain text.

csharp

public sealed record Person(string Name, int Age)
{
    public bool IsAdult => Age >= 18;
}

AI states

bash

dotnet add package Markdig

bash

dotnet add package Markdig