From 9e1ecccdaf2059419e7d0689e7cf4bcbfa221156 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 7 Nov 2025 14:51:51 +0000
Subject: [PATCH 01/10] Implement MathML support for Slipstream
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This commit adds comprehensive MathML (Mathematical Markup Language) support
to Slipstream, enabling declarative mathematical notation in HTML documents.

**Container Element:**
- **Math** (`math`): Main MathML container with optional display attribute
  for block or inline rendering

**Token Elements:**
- **MI** (`mi`): Identifiers (variables, function names) - rendered in italic
- **MO** (`mo`): Operators (+, -, ×, ÷, =, etc.)
- **MN** (`mn`): Numeric literals
- **MText** (`mtext`): Arbitrary text content for annotations
- **MS** (`ms`): String literals with surrounding quotes

**Layout Elements:**
- **MRow** (`mrow`): Groups sub-expressions together
- **MFrac** (`mfrac`): Fractions with numerator/denominator and configurable
  line thickness
- **MSup** (`msup`): Superscripts (e.g., x²)
- **MSub** (`msub`): Subscripts (e.g., x₀)
- **MSubSup** (`msubsup`): Combined sub/superscripts
- **MSqrt** (`msqrt`): Square root
- **MRoot** (`mroot`): Nth root

**Script Elements:**
- **MUnder** (`munder`): Underscripts (e.g., limits)
- **MOver** (`mover`): Overscripts (e.g., accents)
- **MUnderOver** (`munderover`): Combined under/overscripts (e.g., summations)

**Table Elements:**
- **MTable** (`mtable`): Tables for matrices and systems of equations
- **MTr** (`mtr`): Table rows
- **MTd** (`mtd`): Table cells

All elements follow Slipstream patterns with SwiftUI-style ViewBuilder APIs
while honoring W3C MathML terminology. Comprehensive test coverage includes
simple expressions, complex formulas (quadratic formula, summations),
matrices, and nested structures.

Also updates SlipstreamForWebDevelopers.md to document all MathML elements
and adds missing SVG documentation.
---
 .../Guides/SlipstreamForWebDevelopers.md      |  41 ++
 .../EmbeddedContent/MathML/MFrac.swift        |  55 ++
 .../Elements/EmbeddedContent/MathML/MI.swift  |  49 ++
 .../Elements/EmbeddedContent/MathML/MN.swift  |  48 ++
 .../Elements/EmbeddedContent/MathML/MO.swift  |  49 ++
 .../EmbeddedContent/MathML/MOver.swift        |  40 ++
 .../EmbeddedContent/MathML/MRoot.swift        |  39 ++
 .../EmbeddedContent/MathML/MRow.swift         |  41 ++
 .../Elements/EmbeddedContent/MathML/MS.swift  |  47 ++
 .../EmbeddedContent/MathML/MSqrt.swift        |  38 ++
 .../EmbeddedContent/MathML/MSub.swift         |  39 ++
 .../EmbeddedContent/MathML/MSubSup.swift      |  40 ++
 .../EmbeddedContent/MathML/MSup.swift         |  39 ++
 .../EmbeddedContent/MathML/MTable.swift       |  54 ++
 .../Elements/EmbeddedContent/MathML/MTd.swift |  45 ++
 .../EmbeddedContent/MathML/MText.swift        |  50 ++
 .../Elements/EmbeddedContent/MathML/MTr.swift |  45 ++
 .../EmbeddedContent/MathML/MUnder.swift       |  44 ++
 .../EmbeddedContent/MathML/MUnderOver.swift   |  45 ++
 .../EmbeddedContent/MathML/Math.swift         |  79 +++
 Tests/SlipstreamTests/W3C/MathMLTests.swift   | 525 ++++++++++++++++++
 21 files changed, 1452 insertions(+)
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MFrac.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MOver.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRoot.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRow.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSqrt.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSub.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSubSup.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSup.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTable.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTd.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTr.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnder.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnderOver.swift
 create mode 100644 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/Math.swift
 create mode 100644 Tests/SlipstreamTests/W3C/MathMLTests.swift

diff --git a/Sources/Slipstream/Documentation.docc/Guides/SlipstreamForWebDevelopers.md b/Sources/Slipstream/Documentation.docc/Guides/SlipstreamForWebDevelopers.md
index 8df6ea6..309275f 100644
--- a/Sources/Slipstream/Documentation.docc/Guides/SlipstreamForWebDevelopers.md
+++ b/Sources/Slipstream/Documentation.docc/Guides/SlipstreamForWebDevelopers.md
@@ -230,3 +230,44 @@ provided below is an organized table of W3C HTML tags and their equivalent Slips
 [`<template>`](https://html.spec.whatwg.org/multipage/sections.html#the-template-element) | ``Template``
 [`<slot>`](https://html.spec.whatwg.org/multipage/sections.html#the-slot-element) | ``Slot``
 [`<canvas>`](https://html.spec.whatwg.org/multipage/sections.html#the-canvas-element) | ``Canvas``
+
+### SVG (Scalable Vector Graphics)
+
+ W3C tag | Slipstream view
+:--------|:----------------
+[`<svg>`](https://svgwg.org/svg2-draft/struct.html#SVGElement) | ``SVG``
+[`<circle>`](https://svgwg.org/svg2-draft/shapes.html#CircleElement) | ``SVGCircle``
+[`<defs>`](https://svgwg.org/svg2-draft/struct.html#DefsElement) | ``SVGDefs``
+[`<desc>`](https://svgwg.org/svg2-draft/struct.html#DescElement) | ``SVGDesc``
+[`<g>`](https://svgwg.org/svg2-draft/struct.html#GElement) | ``SVGGroup``
+[`<linearGradient>`](https://svgwg.org/svg2-draft/pservers.html#LinearGradientElement) | ``SVGLinearGradient``
+[`<path>`](https://svgwg.org/svg2-draft/paths.html#PathElement) | ``SVGPath``
+[`<radialGradient>`](https://svgwg.org/svg2-draft/pservers.html#RadialGradientElement) | ``SVGRadialGradient``
+[`<rect>`](https://svgwg.org/svg2-draft/shapes.html#RectElement) | ``SVGRect``
+[`<stop>`](https://svgwg.org/svg2-draft/pservers.html#StopElement) | ``SVGStop``
+[`<text>`](https://svgwg.org/svg2-draft/text.html#TextElement) | ``SVGText``
+[`<title>`](https://svgwg.org/svg2-draft/struct.html#TitleElement) | ``SVGTitle``
+
+### MathML (Mathematical Markup Language)
+
+ W3C tag | Slipstream view
+:--------|:----------------
+[`<math>`](https://www.w3.org/TR/MathML3/chapter2.html#interf.toplevel) | ``Math``
+[`<mi>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mi) | ``MI``
+[`<mo>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mo) | ``MO``
+[`<mn>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mn) | ``MN``
+[`<mtext>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtext) | ``MText``
+[`<ms>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.ms) | ``MS``
+[`<mrow>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mrow) | ``MRow``
+[`<mfrac>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mfrac) | ``MFrac``
+[`<msup>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.msup) | ``MSup``
+[`<msub>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.msub) | ``MSub``
+[`<msubsup>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.msubsup) | ``MSubSup``
+[`<msqrt>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.msqrt) | ``MSqrt``
+[`<mroot>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mroot) | ``MRoot``
+[`<munder>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.munder) | ``MUnder``
+[`<mover>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mover) | ``MOver``
+[`<munderover>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.munderover) | ``MUnderOver``
+[`<mtable>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtable) | ``MTable``
+[`<mtr>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtr) | ``MTr``
+[`<mtd>`](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtd) | ``MTd``
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MFrac.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MFrac.swift
new file mode 100644
index 0000000..a78eefa
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MFrac.swift
@@ -0,0 +1,55 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mfrac>` element for fractions.
+///
+/// The `<mfrac>` element is used to display fractions with a numerator and denominator
+/// separated by a horizontal line.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MFrac {
+///           MI("a")
+///           MI("b")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mfrac](https://www.w3.org/TR/MathML3/chapter3.html#presm.mfrac) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MFrac<Content>: View where Content: View {
+  /// Creates an MFrac element.
+  ///
+  /// - Parameter content: The numerator and denominator expressions (must contain exactly two children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+    self.linethicknessValue = nil
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mfrac")
+    if let linethickness = linethicknessValue {
+      try element.attr("linethickness", linethickness)
+    }
+    try self.content().render(element, environment: environment)
+  }
+
+  /// Sets the thickness of the fraction line.
+  ///
+  /// - Parameter thickness: The line thickness (e.g., "thin", "medium", "thick", or a length value)
+  /// - Returns: A new MFrac with the specified line thickness.
+  public func linethickness(_ thickness: String) -> MFrac {
+    var newFrac = self
+    newFrac.linethicknessValue = thickness
+    return newFrac
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+  private var linethicknessValue: String?
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
new file mode 100644
index 0000000..dffbae1
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
@@ -0,0 +1,49 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mi>` element for identifiers.
+///
+/// The `<mi>` element is used to represent identifier symbols in mathematical expressions,
+/// such as variable names or function names. By default, content is rendered in italic.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MI("x")
+///           MO("+")
+///           MI("y")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mi](https://www.w3.org/TR/MathML3/chapter3.html#presm.mi) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MI<ChildContent: View>: W3CElement {
+  public let tagName = "mi"
+
+  @ViewBuilder public let content: @Sendable () -> ChildContent
+
+  /// Creates an MI element with view content.
+  ///
+  /// - Parameter content: The view content for the identifier
+  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
+    self.content = content
+  }
+}
+
+@available(iOS 17.0, macOS 14.0, *)
+extension MI where ChildContent == DOMString {
+  /// Creates an MI element with text content.
+  ///
+  /// - Parameter text: The identifier text content
+  public init(_ text: String) {
+    self.content = {
+      DOMString(text)
+    }
+  }
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
new file mode 100644
index 0000000..35b0f23
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
@@ -0,0 +1,48 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mn>` element for numbers.
+///
+/// The `<mn>` element is used to represent numeric literals in mathematical expressions.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MN("42")
+///           MO("+")
+///           MN("3.14")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mn](https://www.w3.org/TR/MathML3/chapter3.html#presm.mn) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MN<ChildContent: View>: W3CElement {
+  public let tagName = "mn"
+
+  @ViewBuilder public let content: @Sendable () -> ChildContent
+
+  /// Creates an MN element with view content.
+  ///
+  /// - Parameter content: The view content for the number
+  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
+    self.content = content
+  }
+}
+
+@available(iOS 17.0, macOS 14.0, *)
+extension MN where ChildContent == DOMString {
+  /// Creates an MN element with text content.
+  ///
+  /// - Parameter text: The number text content
+  public init(_ text: String) {
+    self.content = {
+      DOMString(text)
+    }
+  }
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
new file mode 100644
index 0000000..92831ca
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
@@ -0,0 +1,49 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mo>` element for operators.
+///
+/// The `<mo>` element is used to represent operators in mathematical expressions,
+/// such as +, -, ×, ÷, =, and other mathematical operators.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MI("x")
+///           MO("+")
+///           MI("y")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mo](https://www.w3.org/TR/MathML3/chapter3.html#presm.mo) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MO<ChildContent: View>: W3CElement {
+  public let tagName = "mo"
+
+  @ViewBuilder public let content: @Sendable () -> ChildContent
+
+  /// Creates an MO element with view content.
+  ///
+  /// - Parameter content: The view content for the operator
+  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
+    self.content = content
+  }
+}
+
+@available(iOS 17.0, macOS 14.0, *)
+extension MO where ChildContent == DOMString {
+  /// Creates an MO element with text content.
+  ///
+  /// - Parameter text: The operator text content
+  public init(_ text: String) {
+    self.content = {
+      DOMString(text)
+    }
+  }
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MOver.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MOver.swift
new file mode 100644
index 0000000..7d61f66
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MOver.swift
@@ -0,0 +1,40 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mover>` element for overscripts.
+///
+/// The `<mover>` element is used to attach an overscript to a base expression,
+/// commonly used for accents, limits, and other notations.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MOver {
+///           MI("x")
+///           MO("^")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mover](https://www.w3.org/TR/MathML3/chapter3.html#presm.mover) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MOver<Content>: View where Content: View {
+  /// Creates an MOver element.
+  ///
+  /// - Parameter content: The base and overscript expressions (must contain exactly two children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mover")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRoot.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRoot.swift
new file mode 100644
index 0000000..a66a0f6
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRoot.swift
@@ -0,0 +1,39 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mroot>` element for nth roots.
+///
+/// The `<mroot>` element is used to display the nth root of an expression.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRoot {
+///           MI("x")
+///           MN("3")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mroot](https://www.w3.org/TR/MathML3/chapter3.html#presm.mroot) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MRoot<Content>: View where Content: View {
+  /// Creates an MRoot element.
+  ///
+  /// - Parameter content: The base and index expressions (must contain exactly two children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mroot")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRow.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRow.swift
new file mode 100644
index 0000000..c7ce1ff
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MRow.swift
@@ -0,0 +1,41 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mrow>` element for grouping expressions.
+///
+/// The `<mrow>` element is used to group together any number of sub-expressions,
+/// typically to apply a common formatting or to indicate that they form a single expression.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MI("x")
+///           MO("+")
+///           MI("y")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mrow](https://www.w3.org/TR/MathML3/chapter3.html#presm.mrow) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MRow<Content>: View where Content: View {
+  /// Creates an MRow element.
+  ///
+  /// - Parameter content: The mathematical expressions to group together.
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mrow")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
new file mode 100644
index 0000000..a74b61d
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
@@ -0,0 +1,47 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<ms>` element for string literals.
+///
+/// The `<ms>` element is used to represent string literals in mathematical expressions.
+/// By default, the content is displayed with surrounding quotes.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MS("Hello")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [ms](https://www.w3.org/TR/MathML3/chapter3.html#presm.ms) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MS<ChildContent: View>: W3CElement {
+  public let tagName = "ms"
+
+  @ViewBuilder public let content: @Sendable () -> ChildContent
+
+  /// Creates an MS element with view content.
+  ///
+  /// - Parameter content: The view content for the string literal
+  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
+    self.content = content
+  }
+}
+
+@available(iOS 17.0, macOS 14.0, *)
+extension MS where ChildContent == DOMString {
+  /// Creates an MS element with text content.
+  ///
+  /// - Parameter text: The string literal text content
+  public init(_ text: String) {
+    self.content = {
+      DOMString(text)
+    }
+  }
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSqrt.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSqrt.swift
new file mode 100644
index 0000000..9d4164d
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSqrt.swift
@@ -0,0 +1,38 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<msqrt>` element for square roots.
+///
+/// The `<msqrt>` element is used to display the square root of an expression.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MSqrt {
+///           MI("x")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [msqrt](https://www.w3.org/TR/MathML3/chapter3.html#presm.msqrt) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MSqrt<Content>: View where Content: View {
+  /// Creates an MSqrt element.
+  ///
+  /// - Parameter content: The expression to take the square root of.
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("msqrt")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSub.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSub.swift
new file mode 100644
index 0000000..ac03a7e
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSub.swift
@@ -0,0 +1,39 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<msub>` element for subscripts.
+///
+/// The `<msub>` element is used to attach a subscript to a base expression.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MSub {
+///           MI("x")
+///           MN("0")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [msub](https://www.w3.org/TR/MathML3/chapter3.html#presm.msub) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MSub<Content>: View where Content: View {
+  /// Creates an MSub element.
+  ///
+  /// - Parameter content: The base and subscript expressions (must contain exactly two children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("msub")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSubSup.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSubSup.swift
new file mode 100644
index 0000000..7752f27
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSubSup.swift
@@ -0,0 +1,40 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<msubsup>` element for subscripts and superscripts.
+///
+/// The `<msubsup>` element is used to attach both a subscript and superscript to a base expression.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MSubSup {
+///           MI("x")
+///           MN("0")
+///           MN("2")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [msubsup](https://www.w3.org/TR/MathML3/chapter3.html#presm.msubsup) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MSubSup<Content>: View where Content: View {
+  /// Creates an MSubSup element.
+  ///
+  /// - Parameter content: The base, subscript, and superscript expressions (must contain exactly three children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("msubsup")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSup.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSup.swift
new file mode 100644
index 0000000..01a430c
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MSup.swift
@@ -0,0 +1,39 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<msup>` element for superscripts.
+///
+/// The `<msup>` element is used to attach a superscript to a base expression.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MSup {
+///           MI("x")
+///           MN("2")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [msup](https://www.w3.org/TR/MathML3/chapter3.html#presm.msup) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MSup<Content>: View where Content: View {
+  /// Creates an MSup element.
+  ///
+  /// - Parameter content: The base and superscript expressions (must contain exactly two children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("msup")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTable.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTable.swift
new file mode 100644
index 0000000..cf267b7
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTable.swift
@@ -0,0 +1,54 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mtable>` element for tables.
+///
+/// The `<mtable>` element is used to create tables in mathematical expressions,
+/// such as matrices, determinants, or systems of equations.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MTable {
+///           MTr {
+///             MTd {
+///               MN("1")
+///             }
+///             MTd {
+///               MN("2")
+///             }
+///           }
+///           MTr {
+///             MTd {
+///               MN("3")
+///             }
+///             MTd {
+///               MN("4")
+///             }
+///           }
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mtable](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtable) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MTable<Content>: View where Content: View {
+  /// Creates an MTable element.
+  ///
+  /// - Parameter content: The table rows (MTr elements).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mtable")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTd.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTd.swift
new file mode 100644
index 0000000..a1bf4b8
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTd.swift
@@ -0,0 +1,45 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mtd>` element for table cells.
+///
+/// The `<mtd>` element is used to represent a cell in a MathML table row (mtr).
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MTable {
+///           MTr {
+///             MTd {
+///               MN("1")
+///             }
+///             MTd {
+///               MN("2")
+///             }
+///           }
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mtd](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtd) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MTd<Content>: View where Content: View {
+  /// Creates an MTd element.
+  ///
+  /// - Parameter content: The content of the table cell.
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mtd")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
new file mode 100644
index 0000000..cb6d86d
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
@@ -0,0 +1,50 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mtext>` element for text content.
+///
+/// The `<mtext>` element is used to represent arbitrary text in mathematical expressions,
+/// typically for annotations or labels.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MI("x")
+///           MO("=")
+///           MN("5")
+///           MText(" (inches)")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mtext](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtext) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MText<ChildContent: View>: W3CElement {
+  public let tagName = "mtext"
+
+  @ViewBuilder public let content: @Sendable () -> ChildContent
+
+  /// Creates an MText element with view content.
+  ///
+  /// - Parameter content: The view content for the text
+  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
+    self.content = content
+  }
+}
+
+@available(iOS 17.0, macOS 14.0, *)
+extension MText where ChildContent == DOMString {
+  /// Creates an MText element with text content.
+  ///
+  /// - Parameter text: The text content
+  public init(_ text: String) {
+    self.content = {
+      DOMString(text)
+    }
+  }
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTr.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTr.swift
new file mode 100644
index 0000000..573ca77
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MTr.swift
@@ -0,0 +1,45 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<mtr>` element for table rows.
+///
+/// The `<mtr>` element is used to represent a row in a MathML table (mtable).
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MTable {
+///           MTr {
+///             MTd {
+///               MN("1")
+///             }
+///             MTd {
+///               MN("2")
+///             }
+///           }
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [mtr](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtr) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MTr<Content>: View where Content: View {
+  /// Creates an MTr element.
+  ///
+  /// - Parameter content: The table cells (MTd elements).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mtr")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnder.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnder.swift
new file mode 100644
index 0000000..9a25d87
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnder.swift
@@ -0,0 +1,44 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<munder>` element for underscripts.
+///
+/// The `<munder>` element is used to attach an underscript to a base expression,
+/// commonly used for limits and other notations.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MUnder {
+///           MO("lim")
+///           MRow {
+///             MI("x")
+///             MO("→")
+///             MN("0")
+///           }
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [munder](https://www.w3.org/TR/MathML3/chapter3.html#presm.munder) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MUnder<Content>: View where Content: View {
+  /// Creates an MUnder element.
+  ///
+  /// - Parameter content: The base and underscript expressions (must contain exactly two children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("munder")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnderOver.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnderOver.swift
new file mode 100644
index 0000000..875c61a
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MUnderOver.swift
@@ -0,0 +1,45 @@
+import SwiftSoup
+
+/// A view that represents a MathML `<munderover>` element for underscripts and overscripts.
+///
+/// The `<munderover>` element is used to attach both an underscript and overscript to a base expression,
+/// commonly used for summations, integrals, and limits.
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MUnderOver {
+///           MO("∑")
+///           MRow {
+///             MI("i")
+///             MO("=")
+///             MN("1")
+///           }
+///           MI("n")
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [munderover](https://www.w3.org/TR/MathML3/chapter3.html#presm.munderover) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct MUnderOver<Content>: View where Content: View {
+  /// Creates an MUnderOver element.
+  ///
+  /// - Parameter content: The base, underscript, and overscript expressions (must contain exactly three children).
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("munderover")
+    try self.content().render(element, environment: environment)
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+}
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/Math.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/Math.swift
new file mode 100644
index 0000000..8b47ef6
--- /dev/null
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/Math.swift
@@ -0,0 +1,79 @@
+import SwiftSoup
+
+/// A view that represents a MathML mathematical expression container.
+///
+/// Math provides a declarative way to include mathematical notation in your document
+/// using MathML (Mathematical Markup Language).
+///
+/// ```swift
+/// struct MySiteContent: View {
+///   var body: some View {
+///     Body {
+///       Math {
+///         MRow {
+///           MI("x")
+///           MO("=")
+///           MFrac {
+///             MRow {
+///               MO("-")
+///               MI("b")
+///               MO("±")
+///               MSqrt {
+///                 MRow {
+///                   MSup {
+///                     MI("b")
+///                     MN("2")
+///                   }
+///                   MO("-")
+///                   MN("4")
+///                   MI("a")
+///                   MI("c")
+///                 }
+///               }
+///             }
+///             MRow {
+///               MN("2")
+///               MI("a")
+///             }
+///           }
+///         }
+///       }
+///     }
+///   }
+/// }
+/// ```
+///
+/// - SeeAlso: W3C [math](https://www.w3.org/TR/MathML3/chapter2.html#interf.toplevel) specification.
+@available(iOS 17.0, macOS 14.0, *)
+public struct Math<Content>: View where Content: View {
+  /// Creates a Math view.
+  ///
+  /// - Parameters:
+  ///   - content: The MathML content to render within this container.
+  public init(@ViewBuilder content: @escaping @Sendable () -> Content) {
+    self.content = content
+    self.displayValue = nil
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("math")
+    if let display = displayValue {
+      try element.attr("display", display)
+    }
+    try self.content().render(element, environment: environment)
+  }
+
+  /// Sets the display style of the math element.
+  ///
+  /// - Parameter display: The display mode ("block" or "inline")
+  /// - Returns: A new Math with the specified display mode.
+  public func display(_ display: String) -> Math {
+    var newMath = self
+    newMath.displayValue = display
+    return newMath
+  }
+
+  @ViewBuilder private let content: @Sendable () -> Content
+  private var displayValue: String?
+}
diff --git a/Tests/SlipstreamTests/W3C/MathMLTests.swift b/Tests/SlipstreamTests/W3C/MathMLTests.swift
new file mode 100644
index 0000000..69b9b38
--- /dev/null
+++ b/Tests/SlipstreamTests/W3C/MathMLTests.swift
@@ -0,0 +1,525 @@
+import Foundation
+import Testing
+
+import Slipstream
+
+struct MathMLTests {
+  @Test func basicMath() throws {
+    let html = try renderHTML(Math {
+      MI("x")
+    })
+
+    #expect(html == """
+<math>
+ <mi>x</mi>
+</math>
+""")
+  }
+
+  @Test func mathWithDisplay() throws {
+    let html = try renderHTML(Math {
+      MI("x")
+    }
+    .display("block"))
+
+    #expect(html == """
+<math display="block">
+ <mi>x</mi>
+</math>
+""")
+  }
+
+  @Test func simpleExpression() throws {
+    let html = try renderHTML(Math {
+      MRow {
+        MI("x")
+        MO("+")
+        MI("y")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mrow>
+  <mi>x</mi>
+  <mo>+</mo>
+  <mi>y</mi>
+ </mrow>
+</math>
+""")
+  }
+
+  @Test func fraction() throws {
+    let html = try renderHTML(Math {
+      MFrac {
+        MI("a")
+        MI("b")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mfrac>
+  <mi>a</mi>
+  <mi>b</mi>
+ </mfrac>
+</math>
+""")
+  }
+
+  @Test func fractionWithLinethickness() throws {
+    let html = try renderHTML(Math {
+      MFrac {
+        MI("a")
+        MI("b")
+      }
+      .linethickness("2px")
+    })
+
+    #expect(html == """
+<math>
+ <mfrac linethickness="2px">
+  <mi>a</mi>
+  <mi>b</mi>
+ </mfrac>
+</math>
+""")
+  }
+
+  @Test func superscript() throws {
+    let html = try renderHTML(Math {
+      MSup {
+        MI("x")
+        MN("2")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <msup>
+  <mi>x</mi>
+  <mn>2</mn>
+ </msup>
+</math>
+""")
+  }
+
+  @Test func subscript() throws {
+    let html = try renderHTML(Math {
+      MSub {
+        MI("x")
+        MN("0")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <msub>
+  <mi>x</mi>
+  <mn>0</mn>
+ </msub>
+</math>
+""")
+  }
+
+  @Test func subscriptAndSuperscript() throws {
+    let html = try renderHTML(Math {
+      MSubSup {
+        MI("x")
+        MN("0")
+        MN("2")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <msubsup>
+  <mi>x</mi>
+  <mn>0</mn>
+  <mn>2</mn>
+ </msubsup>
+</math>
+""")
+  }
+
+  @Test func squareRoot() throws {
+    let html = try renderHTML(Math {
+      MSqrt {
+        MI("x")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <msqrt>
+  <mi>x</mi>
+ </msqrt>
+</math>
+""")
+  }
+
+  @Test func nthRoot() throws {
+    let html = try renderHTML(Math {
+      MRoot {
+        MI("x")
+        MN("3")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mroot>
+  <mi>x</mi>
+  <mn>3</mn>
+ </mroot>
+</math>
+""")
+  }
+
+  @Test func underscript() throws {
+    let html = try renderHTML(Math {
+      MUnder {
+        MO("lim")
+        MRow {
+          MI("x")
+          MO("→")
+          MN("0")
+        }
+      }
+    })
+
+    #expect(html == """
+<math>
+ <munder>
+  <mo>lim</mo>
+  <mrow>
+   <mi>x</mi>
+   <mo>→</mo>
+   <mn>0</mn>
+  </mrow>
+ </munder>
+</math>
+""")
+  }
+
+  @Test func overscript() throws {
+    let html = try renderHTML(Math {
+      MOver {
+        MI("x")
+        MO("^")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mover>
+  <mi>x</mi>
+  <mo>^</mo>
+ </mover>
+</math>
+""")
+  }
+
+  @Test func underAndOverscript() throws {
+    let html = try renderHTML(Math {
+      MUnderOver {
+        MO("∑")
+        MRow {
+          MI("i")
+          MO("=")
+          MN("1")
+        }
+        MI("n")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <munderover>
+  <mo>∑</mo>
+  <mrow>
+   <mi>i</mi>
+   <mo>=</mo>
+   <mn>1</mn>
+  </mrow>
+  <mi>n</mi>
+ </munderover>
+</math>
+""")
+  }
+
+  @Test func table() throws {
+    let html = try renderHTML(Math {
+      MTable {
+        MTr {
+          MTd {
+            MN("1")
+          }
+          MTd {
+            MN("2")
+          }
+        }
+        MTr {
+          MTd {
+            MN("3")
+          }
+          MTd {
+            MN("4")
+          }
+        }
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mtable>
+  <mtr>
+   <mtd>
+    <mn>1</mn>
+   </mtd>
+   <mtd>
+    <mn>2</mn>
+   </mtd>
+  </mtr>
+  <mtr>
+   <mtd>
+    <mn>3</mn>
+   </mtd>
+   <mtd>
+    <mn>4</mn>
+   </mtd>
+  </mtr>
+ </mtable>
+</math>
+""")
+  }
+
+  @Test func textElement() throws {
+    let html = try renderHTML(Math {
+      MRow {
+        MI("x")
+        MO("=")
+        MN("5")
+        MText(" inches")
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mrow>
+  <mi>x</mi>
+  <mo>=</mo>
+  <mn>5</mn>
+  <mtext> inches</mtext>
+ </mrow>
+</math>
+""")
+  }
+
+  @Test func stringLiteral() throws {
+    let html = try renderHTML(Math {
+      MS("Hello")
+    })
+
+    #expect(html == """
+<math>
+ <ms>Hello</ms>
+</math>
+""")
+  }
+
+  @Test func quadraticFormula() throws {
+    let html = try renderHTML(Math {
+      MRow {
+        MI("x")
+        MO("=")
+        MFrac {
+          MRow {
+            MO("-")
+            MI("b")
+            MO("±")
+            MSqrt {
+              MRow {
+                MSup {
+                  MI("b")
+                  MN("2")
+                }
+                MO("-")
+                MN("4")
+                MI("a")
+                MI("c")
+              }
+            }
+          }
+          MRow {
+            MN("2")
+            MI("a")
+          }
+        }
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mrow>
+  <mi>x</mi>
+  <mo>=</mo>
+  <mfrac>
+   <mrow>
+    <mo>-</mo>
+    <mi>b</mi>
+    <mo>±</mo>
+    <msqrt>
+     <mrow>
+      <msup>
+       <mi>b</mi>
+       <mn>2</mn>
+      </msup>
+      <mo>-</mo>
+      <mn>4</mn>
+      <mi>a</mi>
+      <mi>c</mi>
+     </mrow>
+    </msqrt>
+   </mrow>
+   <mrow>
+    <mn>2</mn>
+    <mi>a</mi>
+   </mrow>
+  </mfrac>
+ </mrow>
+</math>
+""")
+  }
+
+  @Test func summation() throws {
+    let html = try renderHTML(Math {
+      MRow {
+        MUnderOver {
+          MO("∑")
+          MRow {
+            MI("i")
+            MO("=")
+            MN("1")
+          }
+          MI("n")
+        }
+        MSup {
+          MI("i")
+          MN("2")
+        }
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mrow>
+  <munderover>
+   <mo>∑</mo>
+   <mrow>
+    <mi>i</mi>
+    <mo>=</mo>
+    <mn>1</mn>
+   </mrow>
+   <mi>n</mi>
+  </munderover>
+  <msup>
+   <mi>i</mi>
+   <mn>2</mn>
+  </msup>
+ </mrow>
+</math>
+""")
+  }
+
+  @Test func matrix() throws {
+    let html = try renderHTML(Math {
+      MTable {
+        MTr {
+          MTd {
+            MI("a")
+          }
+          MTd {
+            MI("b")
+          }
+        }
+        MTr {
+          MTd {
+            MI("c")
+          }
+          MTd {
+            MI("d")
+          }
+        }
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mtable>
+  <mtr>
+   <mtd>
+    <mi>a</mi>
+   </mtd>
+   <mtd>
+    <mi>b</mi>
+   </mtd>
+  </mtr>
+  <mtr>
+   <mtd>
+    <mi>c</mi>
+   </mtd>
+   <mtd>
+    <mi>d</mi>
+   </mtd>
+  </mtr>
+ </mtable>
+</math>
+""")
+  }
+
+  @Test func nestedFractions() throws {
+    let html = try renderHTML(Math {
+      MFrac {
+        MN("1")
+        MRow {
+          MI("x")
+          MO("+")
+          MFrac {
+            MN("1")
+            MI("y")
+          }
+        }
+      }
+    })
+
+    #expect(html == """
+<math>
+ <mfrac>
+  <mn>1</mn>
+  <mrow>
+   <mi>x</mi>
+   <mo>+</mo>
+   <mfrac>
+    <mn>1</mn>
+    <mi>y</mi>
+   </mfrac>
+  </mrow>
+ </mfrac>
+</math>
+""")
+  }
+
+  @Test func mathWithClassModifier() throws {
+    let html = try renderHTML(Math {
+      MI("x")
+    }
+    .className("equation"))
+
+    #expect(html == """
+<math class="equation">
+ <mi>x</mi>
+</math>
+""")
+  }
+}

From 5e9ba733c57d9f5c486c256e50058e1e7abafa87 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 7 Nov 2025 18:17:18 +0000
Subject: [PATCH 02/10] Fix build error: rename test function from 'subscript'
 to 'msubElement'

The 'subscript' keyword is reserved in Swift and cannot be used as a
function name, causing compilation errors.
---
 Tests/SlipstreamTests/W3C/MathMLTests.swift | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Tests/SlipstreamTests/W3C/MathMLTests.swift b/Tests/SlipstreamTests/W3C/MathMLTests.swift
index 69b9b38..080d268 100644
--- a/Tests/SlipstreamTests/W3C/MathMLTests.swift
+++ b/Tests/SlipstreamTests/W3C/MathMLTests.swift
@@ -104,7 +104,7 @@ struct MathMLTests {
 """)
   }
 
-  @Test func subscript() throws {
+  @Test func msubElement() throws {
     let html = try renderHTML(Math {
       MSub {
         MI("x")

From 3c3efe7f9fe7e0bf113d4e3a1ed6acd331d1f37c Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 7 Nov 2025 18:31:20 +0000
Subject: [PATCH 03/10] Fix MathML token elements to render text inline

Changed MI, MO, MN, MText, and MS elements to use direct text rendering
instead of W3CElement protocol. This ensures text content is rendered
inline (e.g., <mi>x</mi>) rather than with extra newlines and formatting.

The token elements now follow the same pattern as SVGText, using
element.text() to set content directly, which produces cleaner HTML
output that matches test expectations.
---
 .../Elements/EmbeddedContent/MathML/MI.swift  | 26 +++++++------------
 .../Elements/EmbeddedContent/MathML/MN.swift  | 26 +++++++------------
 .../Elements/EmbeddedContent/MathML/MO.swift  | 26 +++++++------------
 .../Elements/EmbeddedContent/MathML/MS.swift  | 26 +++++++------------
 .../EmbeddedContent/MathML/MText.swift        | 26 +++++++------------
 5 files changed, 45 insertions(+), 85 deletions(-)

diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
index dffbae1..0b71c9e 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
@@ -23,27 +23,19 @@ import SwiftSoup
 ///
 /// - SeeAlso: W3C [mi](https://www.w3.org/TR/MathML3/chapter3.html#presm.mi) specification.
 @available(iOS 17.0, macOS 14.0, *)
-public struct MI<ChildContent: View>: W3CElement {
-  public let tagName = "mi"
+public struct MI: View {
+  private let text: String
 
-  @ViewBuilder public let content: @Sendable () -> ChildContent
-
-  /// Creates an MI element with view content.
-  ///
-  /// - Parameter content: The view content for the identifier
-  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
-    self.content = content
-  }
-}
-
-@available(iOS 17.0, macOS 14.0, *)
-extension MI where ChildContent == DOMString {
   /// Creates an MI element with text content.
   ///
   /// - Parameter text: The identifier text content
   public init(_ text: String) {
-    self.content = {
-      DOMString(text)
-    }
+    self.text = text
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mi")
+    try element.text(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
index 35b0f23..4b26ae5 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
@@ -22,27 +22,19 @@ import SwiftSoup
 ///
 /// - SeeAlso: W3C [mn](https://www.w3.org/TR/MathML3/chapter3.html#presm.mn) specification.
 @available(iOS 17.0, macOS 14.0, *)
-public struct MN<ChildContent: View>: W3CElement {
-  public let tagName = "mn"
+public struct MN: View {
+  private let text: String
 
-  @ViewBuilder public let content: @Sendable () -> ChildContent
-
-  /// Creates an MN element with view content.
-  ///
-  /// - Parameter content: The view content for the number
-  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
-    self.content = content
-  }
-}
-
-@available(iOS 17.0, macOS 14.0, *)
-extension MN where ChildContent == DOMString {
   /// Creates an MN element with text content.
   ///
   /// - Parameter text: The number text content
   public init(_ text: String) {
-    self.content = {
-      DOMString(text)
-    }
+    self.text = text
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mn")
+    try element.text(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
index 92831ca..f2a586a 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
@@ -23,27 +23,19 @@ import SwiftSoup
 ///
 /// - SeeAlso: W3C [mo](https://www.w3.org/TR/MathML3/chapter3.html#presm.mo) specification.
 @available(iOS 17.0, macOS 14.0, *)
-public struct MO<ChildContent: View>: W3CElement {
-  public let tagName = "mo"
+public struct MO: View {
+  private let text: String
 
-  @ViewBuilder public let content: @Sendable () -> ChildContent
-
-  /// Creates an MO element with view content.
-  ///
-  /// - Parameter content: The view content for the operator
-  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
-    self.content = content
-  }
-}
-
-@available(iOS 17.0, macOS 14.0, *)
-extension MO where ChildContent == DOMString {
   /// Creates an MO element with text content.
   ///
   /// - Parameter text: The operator text content
   public init(_ text: String) {
-    self.content = {
-      DOMString(text)
-    }
+    self.text = text
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mo")
+    try element.text(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
index a74b61d..7b91464 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
@@ -21,27 +21,19 @@ import SwiftSoup
 ///
 /// - SeeAlso: W3C [ms](https://www.w3.org/TR/MathML3/chapter3.html#presm.ms) specification.
 @available(iOS 17.0, macOS 14.0, *)
-public struct MS<ChildContent: View>: W3CElement {
-  public let tagName = "ms"
+public struct MS: View {
+  private let text: String
 
-  @ViewBuilder public let content: @Sendable () -> ChildContent
-
-  /// Creates an MS element with view content.
-  ///
-  /// - Parameter content: The view content for the string literal
-  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
-    self.content = content
-  }
-}
-
-@available(iOS 17.0, macOS 14.0, *)
-extension MS where ChildContent == DOMString {
   /// Creates an MS element with text content.
   ///
   /// - Parameter text: The string literal text content
   public init(_ text: String) {
-    self.content = {
-      DOMString(text)
-    }
+    self.text = text
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("ms")
+    try element.text(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
index cb6d86d..082d47a 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
@@ -24,27 +24,19 @@ import SwiftSoup
 ///
 /// - SeeAlso: W3C [mtext](https://www.w3.org/TR/MathML3/chapter3.html#presm.mtext) specification.
 @available(iOS 17.0, macOS 14.0, *)
-public struct MText<ChildContent: View>: W3CElement {
-  public let tagName = "mtext"
+public struct MText: View {
+  private let text: String
 
-  @ViewBuilder public let content: @Sendable () -> ChildContent
-
-  /// Creates an MText element with view content.
-  ///
-  /// - Parameter content: The view content for the text
-  public init(@ViewBuilder content: @escaping @Sendable () -> ChildContent) {
-    self.content = content
-  }
-}
-
-@available(iOS 17.0, macOS 14.0, *)
-extension MText where ChildContent == DOMString {
   /// Creates an MText element with text content.
   ///
   /// - Parameter text: The text content
   public init(_ text: String) {
-    self.content = {
-      DOMString(text)
-    }
+    self.text = text
+  }
+
+  @_documentation(visibility: private)
+  public func render(_ container: Element, environment: EnvironmentValues) throws {
+    let element = try container.appendElement("mtext")
+    try element.text(text)
   }
 }

From 00d4fedecec6896e266652068ce93b493530c29c Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 7 Nov 2025 18:37:08 +0000
Subject: [PATCH 04/10] Use appendText instead of text() for MathML token
 elements

Changed MI, MO, MN, MText, and MS to use element.appendText() instead
of element.text() to ensure inline rendering. The appendText() method is
the same one used by DOMString and properly keeps text content inline
without extra newlines.
---
 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift | 2 +-
 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift | 2 +-
 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift | 2 +-
 Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift | 2 +-
 .../Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift  | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
index 0b71c9e..52a3811 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MI.swift
@@ -36,6 +36,6 @@ public struct MI: View {
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
     let element = try container.appendElement("mi")
-    try element.text(text)
+    try element.appendText(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
index 4b26ae5..0435793 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MN.swift
@@ -35,6 +35,6 @@ public struct MN: View {
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
     let element = try container.appendElement("mn")
-    try element.text(text)
+    try element.appendText(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
index f2a586a..47d08af 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MO.swift
@@ -36,6 +36,6 @@ public struct MO: View {
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
     let element = try container.appendElement("mo")
-    try element.text(text)
+    try element.appendText(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
index 7b91464..43ee926 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MS.swift
@@ -34,6 +34,6 @@ public struct MS: View {
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
     let element = try container.appendElement("ms")
-    try element.text(text)
+    try element.appendText(text)
   }
 }
diff --git a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
index 082d47a..e449a28 100644
--- a/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
+++ b/Sources/Slipstream/W3C/Elements/EmbeddedContent/MathML/MText.swift
@@ -37,6 +37,6 @@ public struct MText: View {
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
     let element = try container.appendElement("mtext")
-    try element.text(text)
+    try element.appendText(text)
   }
 }

From 931f8813b58c8d9ee936925f48567162e2092792 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 7 Nov 2025 18:42:15 +0000
Subject: [PATCH 05/10] Configure MathML token elements as inline tags in
 SwiftSoup

Added MathML token elements (mi, mo, mn, ms, mtext) to SwiftSoup's
inline tags list in the renderHTML and inlineHTML functions. This tells
SwiftSoup's formatter to treat these elements as inline, preventing the
addition of newlines and indentation around their text content.

This ensures MathML expressions render compactly:
- Before: <mi>\n x\n</mi>
- After: <mi>x</mi>

The configuration is applied to both renderHTML and inlineHTML functions
to ensure consistent formatting across all rendering contexts.
---
 Sources/Slipstream/Rendering/Render.swift | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/Sources/Slipstream/Rendering/Render.swift b/Sources/Slipstream/Rendering/Render.swift
index 128d992..372c7f7 100644
--- a/Sources/Slipstream/Rendering/Render.swift
+++ b/Sources/Slipstream/Rendering/Render.swift
@@ -25,6 +25,10 @@ import SwiftSoup
 /// - Returns: The generated and formatted HTML string.
 public func renderHTML(_ view: any View) throws -> String {
   let document = Document("/")
+  // Configure MathML elements as inline to prevent extra newlines
+  document.outputSettings().addInlineTags(
+    "mi", "mo", "mn", "ms", "mtext"
+  )
   try view.render(document, environment: EnvironmentValues())
   return try document.html()
 }
@@ -41,6 +45,10 @@ public func renderHTML(_ view: any View) throws -> String {
 /// error will be returned as an HTML comment.
 public func inlineHTML<Content: View>(@ViewBuilder _ builder: () -> Content) -> String {
   let document = Document("/")
+  // Configure MathML elements as inline to prevent extra newlines
+  document.outputSettings().addInlineTags(
+    "mi", "mo", "mn", "ms", "mtext"
+  )
   do {
     try builder().render(document, environment: EnvironmentValues())
     return try document.html()

From ce237814a1013ba8b3196236f21b9060b516a2be Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 7 Nov 2025 22:08:32 +0000
Subject: [PATCH 06/10] Post-process MathML token elements to format inline

Since SwiftSoup doesn't recognize MathML tags, it formats them as
block-level elements with extra newlines and indentation. This commit
adds post-processing to the renderHTML and inlineHTML functions to
collapse whitespace within MathML token elements (mi, mo, mn, ms, mtext).

The regex pattern matches <tag>\s*text\s*</tag> and replaces it with
<tag>text</tag>, removing the unwanted formatting while preserving the
proper indentation of the surrounding structure.

This approach was necessary because SwiftSoup doesn't provide an API to
register custom inline tags, and its Tag system uses a private known tags
dictionary that can't be modified at runtime.
---
 Sources/Slipstream/Rendering/Render.swift | 42 +++++++++++++++++------
 1 file changed, 32 insertions(+), 10 deletions(-)

diff --git a/Sources/Slipstream/Rendering/Render.swift b/Sources/Slipstream/Rendering/Render.swift
index 372c7f7..2ba2aa4 100644
--- a/Sources/Slipstream/Rendering/Render.swift
+++ b/Sources/Slipstream/Rendering/Render.swift
@@ -25,12 +25,25 @@ import SwiftSoup
 /// - Returns: The generated and formatted HTML string.
 public func renderHTML(_ view: any View) throws -> String {
   let document = Document("/")
-  // Configure MathML elements as inline to prevent extra newlines
-  document.outputSettings().addInlineTags(
-    "mi", "mo", "mn", "ms", "mtext"
-  )
   try view.render(document, environment: EnvironmentValues())
-  return try document.html()
+  var html = try document.html()
+
+  // Post-process to format MathML token elements inline
+  // SwiftSoup doesn't know MathML tags, so it formats them as block-level
+  // We need to collapse whitespace within these elements to render them inline
+  let mathmlTokenTags = ["mi", "mo", "mn", "ms", "mtext"]
+  for tag in mathmlTokenTags {
+    // Pattern matches: <tag>\n whitespace text whitespace\n</tag>
+    // Replaces with: <tag>text</tag>
+    let pattern = "<\(tag)>\\s*([^<]+?)\\s*</\(tag)>"
+    html = html.replacingOccurrences(
+      of: pattern,
+      with: "<\(tag)>$1</\(tag)>",
+      options: .regularExpression
+    )
+  }
+
+  return html
 }
 
 /// Renders the given view as an HTML document and returns the HTML.
@@ -45,13 +58,22 @@ public func renderHTML(_ view: any View) throws -> String {
 /// error will be returned as an HTML comment.
 public func inlineHTML<Content: View>(@ViewBuilder _ builder: () -> Content) -> String {
   let document = Document("/")
-  // Configure MathML elements as inline to prevent extra newlines
-  document.outputSettings().addInlineTags(
-    "mi", "mo", "mn", "ms", "mtext"
-  )
   do {
     try builder().render(document, environment: EnvironmentValues())
-    return try document.html()
+    var html = try document.html()
+
+    // Post-process to format MathML token elements inline
+    let mathmlTokenTags = ["mi", "mo", "mn", "ms", "mtext"]
+    for tag in mathmlTokenTags {
+      let pattern = "<\(tag)>\\s*([^<]+?)\\s*</\(tag)>"
+      html = html.replacingOccurrences(
+        of: pattern,
+        with: "<\(tag)>$1</\(tag)>",
+        options: .regularExpression
+      )
+    }
+
+    return html
   } catch let error {
     return "<!-- \(error) -->"
   }

From 618cacab898ed2d0c45f2aec915d214782cbe7b0 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 8 Nov 2025 22:07:19 +0000
Subject: [PATCH 07/10] Fix regex to preserve content whitespace in MathML
 elements

Updated the regex pattern to only remove newlines and indentation added
by SwiftSoup's pretty-printer, while preserving spaces that are part of
the actual text content.

Changed from \s* (which matches all whitespace including content spaces)
to \r?\n[ \t]+ which specifically matches:
- Newline after opening tag
- Indentation (spaces/tabs only)
- Then captures content including any leading/trailing spaces
- Removes newline and indentation before closing tag

This fixes the test failure where MText(" inches") was being rendered
as <mtext>inches</mtext> instead of <mtext> inches</mtext>.
---
 Sources/Slipstream/Rendering/Render.swift | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/Sources/Slipstream/Rendering/Render.swift b/Sources/Slipstream/Rendering/Render.swift
index 2ba2aa4..a1ae93b 100644
--- a/Sources/Slipstream/Rendering/Render.swift
+++ b/Sources/Slipstream/Rendering/Render.swift
@@ -33,9 +33,9 @@ public func renderHTML(_ view: any View) throws -> String {
   // We need to collapse whitespace within these elements to render them inline
   let mathmlTokenTags = ["mi", "mo", "mn", "ms", "mtext"]
   for tag in mathmlTokenTags {
-    // Pattern matches: <tag>\n whitespace text whitespace\n</tag>
-    // Replaces with: <tag>text</tag>
-    let pattern = "<\(tag)>\\s*([^<]+?)\\s*</\(tag)>"
+    // Pattern matches: <tag>\n indentation content trailing-spaces\n indentation</tag>
+    // Only removes newlines and indentation, preserving spaces in the content
+    let pattern = "<\(tag)>\\r?\\n[ \\t]+(.*?)[ \\t]*\\r?\\n[ \\t]*</\(tag)>"
     html = html.replacingOccurrences(
       of: pattern,
       with: "<\(tag)>$1</\(tag)>",
@@ -65,7 +65,8 @@ public func inlineHTML<Content: View>(@ViewBuilder _ builder: () -> Content) ->
     // Post-process to format MathML token elements inline
     let mathmlTokenTags = ["mi", "mo", "mn", "ms", "mtext"]
     for tag in mathmlTokenTags {
-      let pattern = "<\(tag)>\\s*([^<]+?)\\s*</\(tag)>"
+      // Only removes newlines and indentation, preserving spaces in the content
+      let pattern = "<\(tag)>\\r?\\n[ \\t]+(.*?)[ \\t]*\\r?\\n[ \\t]*</\(tag)>"
       html = html.replacingOccurrences(
         of: pattern,
         with: "<\(tag)>$1</\(tag)>",

From 31ae1bfd4031b2dda4c45adce64789cc92c2a4a1 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 8 Nov 2025 22:15:38 +0000
Subject: [PATCH 08/10] Use NSRegularExpression to properly preserve content
 whitespace

Switched from simple regex replacement to NSRegularExpression with custom
logic to correctly handle MathML token element formatting. The new approach:

1. Captures leading spaces, content, and closing tag indentation separately
2. Uses the closing tag's indentation to determine how many characters to strip
3. Combines leading spaces + content, then strips only the indentation amount
4. Preserves any spaces beyond the indentation (those are content spaces)

This correctly handles cases like MText(" inches") where the leading space
is part of the content and must be preserved, while still removing the
SwiftSoup pretty-printer's formatting indentation.

Example:
Input:  <mtext>\n   inches\n  </mtext> (3 spaces + content, 2 space indent)
Output: <mtext> inches</mtext> (1 content space preserved)
---
 Sources/Slipstream/Rendering/Render.swift | 69 ++++++++++++++++++-----
 1 file changed, 54 insertions(+), 15 deletions(-)

diff --git a/Sources/Slipstream/Rendering/Render.swift b/Sources/Slipstream/Rendering/Render.swift
index a1ae93b..e753c55 100644
--- a/Sources/Slipstream/Rendering/Render.swift
+++ b/Sources/Slipstream/Rendering/Render.swift
@@ -1,4 +1,5 @@
 import SwiftSoup
+import Foundation
 
 /// Renders the given view as an HTML document and returns the HTML.
 /// 
@@ -33,14 +34,35 @@ public func renderHTML(_ view: any View) throws -> String {
   // We need to collapse whitespace within these elements to render them inline
   let mathmlTokenTags = ["mi", "mo", "mn", "ms", "mtext"]
   for tag in mathmlTokenTags {
-    // Pattern matches: <tag>\n indentation content trailing-spaces\n indentation</tag>
-    // Only removes newlines and indentation, preserving spaces in the content
-    let pattern = "<\(tag)>\\r?\\n[ \\t]+(.*?)[ \\t]*\\r?\\n[ \\t]*</\(tag)>"
-    html = html.replacingOccurrences(
-      of: pattern,
-      with: "<\(tag)>$1</\(tag)>",
-      options: .regularExpression
-    )
+    // Pattern captures: indentation before content, content, indentation before closing tag
+    // We'll strip the indentation (based on closing tag) while preserving content spaces
+    let pattern = "<\(tag)>\\r?\\n([ \\t]*)(.*?)\\r?\\n([ \\t]*)</\(tag)>"
+    let regex = try! NSRegularExpression(pattern: pattern, options: [])
+    let nsString = html as NSString
+    let matches = regex.matches(in: html, options: [], range: NSRange(location: 0, length: nsString.length))
+
+    // Process matches in reverse to maintain string indices
+    for match in matches.reversed() {
+      guard match.numberOfRanges == 4 else { continue }
+      let fullRange = match.range(at: 0)
+      let leadingSpacesRange = match.range(at: 1)
+      let contentRange = match.range(at: 2)
+      let closingSpacesRange = match.range(at: 3)
+
+      let leadingSpaces = nsString.substring(with: leadingSpacesRange)
+      let content = nsString.substring(with: contentRange)
+      let closingSpaces = nsString.substring(with: closingSpacesRange)
+
+      // The closing tag's indentation tells us how much to strip from content line
+      let indentCount = closingSpaces.count
+      // Combine leading spaces and content, then strip only the indentation
+      let fullContent = leadingSpaces + content
+      let trimmedContent = String(fullContent.dropFirst(min(indentCount, fullContent.count)))
+
+      let replacement = "<\(tag)>\(trimmedContent)</\(tag)>"
+      html = nsString.replacingCharacters(in: fullRange, with: replacement) as String
+      nsString = html as NSString
+    }
   }
 
   return html
@@ -65,13 +87,30 @@ public func inlineHTML<Content: View>(@ViewBuilder _ builder: () -> Content) ->
     // Post-process to format MathML token elements inline
     let mathmlTokenTags = ["mi", "mo", "mn", "ms", "mtext"]
     for tag in mathmlTokenTags {
-      // Only removes newlines and indentation, preserving spaces in the content
-      let pattern = "<\(tag)>\\r?\\n[ \\t]+(.*?)[ \\t]*\\r?\\n[ \\t]*</\(tag)>"
-      html = html.replacingOccurrences(
-        of: pattern,
-        with: "<\(tag)>$1</\(tag)>",
-        options: .regularExpression
-      )
+      let pattern = "<\(tag)>\\r?\\n([ \\t]*)(.*?)\\r?\\n([ \\t]*)</\(tag)>"
+      let regex = try! NSRegularExpression(pattern: pattern, options: [])
+      let nsString = html as NSString
+      let matches = regex.matches(in: html, options: [], range: NSRange(location: 0, length: nsString.length))
+
+      for match in matches.reversed() {
+        guard match.numberOfRanges == 4 else { continue }
+        let fullRange = match.range(at: 0)
+        let leadingSpacesRange = match.range(at: 1)
+        let contentRange = match.range(at: 2)
+        let closingSpacesRange = match.range(at: 3)
+
+        let leadingSpaces = nsString.substring(with: leadingSpacesRange)
+        let content = nsString.substring(with: contentRange)
+        let closingSpaces = nsString.substring(with: closingSpacesRange)
+
+        let indentCount = closingSpaces.count
+        let fullContent = leadingSpaces + content
+        let trimmedContent = String(fullContent.dropFirst(min(indentCount, fullContent.count)))
+
+        let replacement = "<\(tag)>\(trimmedContent)</\(tag)>"
+        html = nsString.replacingCharacters(in: fullRange, with: replacement) as String
+        nsString = html as NSString
+      }
     }
 
     return html

From b1ebc93c9b510bd60085f9a3b7ba25813fe65428 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 8 Nov 2025 22:17:42 +0000
Subject: [PATCH 09/10] Fix build error: change nsString from let to var

The nsString variable is reassigned in the loop after each replacement,
so it needs to be declared as var instead of let.
---
 Sources/Slipstream/Rendering/Render.swift | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Sources/Slipstream/Rendering/Render.swift b/Sources/Slipstream/Rendering/Render.swift
index e753c55..a93cae2 100644
--- a/Sources/Slipstream/Rendering/Render.swift
+++ b/Sources/Slipstream/Rendering/Render.swift
@@ -38,7 +38,7 @@ public func renderHTML(_ view: any View) throws -> String {
     // We'll strip the indentation (based on closing tag) while preserving content spaces
     let pattern = "<\(tag)>\\r?\\n([ \\t]*)(.*?)\\r?\\n([ \\t]*)</\(tag)>"
     let regex = try! NSRegularExpression(pattern: pattern, options: [])
-    let nsString = html as NSString
+    var nsString = html as NSString
     let matches = regex.matches(in: html, options: [], range: NSRange(location: 0, length: nsString.length))
 
     // Process matches in reverse to maintain string indices
@@ -89,7 +89,7 @@ public func inlineHTML<Content: View>(@ViewBuilder _ builder: () -> Content) ->
     for tag in mathmlTokenTags {
       let pattern = "<\(tag)>\\r?\\n([ \\t]*)(.*?)\\r?\\n([ \\t]*)</\(tag)>"
       let regex = try! NSRegularExpression(pattern: pattern, options: [])
-      let nsString = html as NSString
+      var nsString = html as NSString
       let matches = regex.matches(in: html, options: [], range: NSRange(location: 0, length: nsString.length))
 
       for match in matches.reversed() {

From 66b496c3378deff14ab5f9dd96e00cc513b74505 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 8 Nov 2025 22:27:40 +0000
Subject: [PATCH 10/10] Fix indentation stripping to account for content
 nesting level

SwiftSoup indents content one level deeper than its parent element.
For example:
  <mi>      (2 spaces)
   a        (3 spaces - one level deeper)
  </mi>     (2 spaces)

The previous logic only stripped the closing tag's indentation (2),
leaving an extra space. The fix is to strip closingIndent + 1 to
account for the content being nested one level deeper.

This correctly handles both:
- MI("a") -> <mi>a</mi> (no extra space)
- MText(" inches") -> <mtext> inches</mtext> (content space preserved)
---
 Sources/Slipstream/Rendering/Render.swift | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/Sources/Slipstream/Rendering/Render.swift b/Sources/Slipstream/Rendering/Render.swift
index a93cae2..8f8f74a 100644
--- a/Sources/Slipstream/Rendering/Render.swift
+++ b/Sources/Slipstream/Rendering/Render.swift
@@ -53,11 +53,12 @@ public func renderHTML(_ view: any View) throws -> String {
       let content = nsString.substring(with: contentRange)
       let closingSpaces = nsString.substring(with: closingSpacesRange)
 
-      // The closing tag's indentation tells us how much to strip from content line
-      let indentCount = closingSpaces.count
-      // Combine leading spaces and content, then strip only the indentation
+      // The closing tag's indentation tells us the element's indent level
+      // Content is indented one level deeper, so we strip closingIndent + 1
+      let indentToStrip = closingSpaces.count + 1
+      // Combine leading spaces and content, then strip the indentation
       let fullContent = leadingSpaces + content
-      let trimmedContent = String(fullContent.dropFirst(min(indentCount, fullContent.count)))
+      let trimmedContent = String(fullContent.dropFirst(min(indentToStrip, fullContent.count)))
 
       let replacement = "<\(tag)>\(trimmedContent)</\(tag)>"
       html = nsString.replacingCharacters(in: fullRange, with: replacement) as String
@@ -103,9 +104,9 @@ public func inlineHTML<Content: View>(@ViewBuilder _ builder: () -> Content) ->
         let content = nsString.substring(with: contentRange)
         let closingSpaces = nsString.substring(with: closingSpacesRange)
 
-        let indentCount = closingSpaces.count
+        let indentToStrip = closingSpaces.count + 1
         let fullContent = leadingSpaces + content
-        let trimmedContent = String(fullContent.dropFirst(min(indentCount, fullContent.count)))
+        let trimmedContent = String(fullContent.dropFirst(min(indentToStrip, fullContent.count)))
 
         let replacement = "<\(tag)>\(trimmedContent)</\(tag)>"
         html = nsString.replacingCharacters(in: fullRange, with: replacement) as String