3 files changed, 30 insertions, 2 deletions
diff --git a/src/eval/Element.zig b/src/eval/Element.zig
index 72b6d7d..f93dc1a 100644
--- a/src/eval/Element.zig
+++ b/src/eval/Element.zig
@@ -9,6 +9,7 @@ pub const Root = @import("Root.zig");
 const blocks = @import("blocks.zig");
 pub const Code = blocks.Code;
 pub const Figure = blocks.Figure;
+pub const Callout = blocks.Callout;
 
 const Element = @This();
 
diff --git a/src/eval/blocks.zig b/src/eval/blocks.zig
index 63c0291..78e28f6 100644
--- a/src/eval/blocks.zig
+++ b/src/eval/blocks.zig
@@ -57,3 +57,30 @@ pub const Figure = struct {
         return el.element();
     }
 };
+
+pub const Callout = struct {
+    content: Element,
+    title: ?[]const u8 = null,
+    kind: ?[]const u8 = null,
+
+    const Self = @This();
+
+    pub fn init(alloc: Allocator, content: Element) !*Self {
+        const v = try alloc.create(Self);
+        v.* = .{ .content = content };
+        return v;
+    }
+
+    pub fn element(self: *Self) Element {
+        return .{ .ptr = self, .vtable = .{ .html = Self.html } };
+    }
+
+    fn html(context: *anyopaque, alloc: Allocator) HTML.Error!HTML {
+        const self: *Self = @ptrCast(@alignCast(context));
+        var el = try HTML.Content.init(alloc, "div");
+        try el.base.appendClass("callout");
+        if (self.kind) |kind| try el.base.setAttribute("data-callout", kind);
+        try el.append(try self.content.html(alloc));
+        return el.element();
+    }
+};
diff --git a/src/eval/html/Void.zig b/src/eval/html/Void.zig
index 58550f4..ec35fc7 100644
--- a/src/eval/html/Void.zig
+++ b/src/eval/html/Void.zig
@@ -28,7 +28,7 @@ pub fn element(self: *Self) Element {
 }
 
 pub fn setAttribute(self: *Self, k: []const u8, v: []const u8) Error!void {
-    try self.attributes.put(try self.alloc.dupe(u8, k), try self.alloc.dupe(u8, v));
+    try self.attributes.put(try self.alloc.dupe(u8, k), try html.escape(self.alloc, v));
 }
 
 pub fn removeAttribute(self: *Self, k: []const u8) void {
@@ -40,7 +40,7 @@ pub fn hasAttribute(self: *Self, k: []const u8) bool {
 }
 
 pub fn appendClass(self: *Self, v: []const u8) Error!void {
-    try self.class_list.insert(v);
+    try self.class_list.insert(try html.escape(self.alloc, v));
 }
 
 pub fn hasClass(self: *Self, v: []const u8) bool {